Basics of Web Design

30th July,2022

Hello everyone, Hope you all are doing well! Today I am writing a blog on some basics of Web Design. So without any further delay , let me tell you what all I understood about Web Design when I did a course on it

Starting with what is Web Design , Web design consists of the design of a digital product (websites and apps). It may include several fields, such as User Interface (UI), User Experience (UX), and even Search Engine Optimization (SEO).

Web Design Image

The difference between Web Designer and Web Developer is that the designer creates looks and feels of the website and apps while on other hand Web Developer builds it according to the design.

Now that you know what Web Design is, let’s talk about some key components of Web Design

Typography

Typography is art of making and arranging written language readable and beautiful. Some tips regarding Typography

There are two types of font San-Serif and Serif

San Serif is

While Serif is

Serif vs San-Serif

Some good San serif fonts are- OpenSans,Lato,Raleway,Monsterrat,PT sans

And some good Serif Fonts are Cardo,Merriweather,PT Serif



Enough of type of fonts now lets come and understand how to choose a font

How to choose a font

  • Choose a font which reflects the look and feel you want for your website
  • Decide San-serfi or Serif
  • Use a good font
  • Use only that typeface

  • Thats all about Typography now lets see another important element of Web Desin that is Colours

    Colours

    Use Colours like pro

  • Use only one base colour
  • Use colour to draw attention
  • Never use black unless necessary
  • Choose colours wisely
  • Colours

    Here is the list for what each colour depicts and can be used for

  • Red - Power and Passion
  • Orange - Draws attention , Confidence
  • Yellow - Energetic , Curosity
  • Green - Nature life ,Harmony
  • Blue - Patience, Peace , liked by men
  • Purple - Ability,Wisdom, Royality
  • Pink - Care, Affection , Peace
  • Brown - Nature , Comfort, Durability
  • Now lets see another element

    Images

    Working with Images

  • These days everyone uses a large image in background
  • Easiest way to directly put text on image
  • Icons

    Working with Icons

  • Increases astethic of website
  • Use Icons to list features and/steps
  • Use Icons for actions and link
  • Icons should not take center stage
  • Use Icon fonts whenever possible
  • Spacing and Layout

    Whitespace should be used accurately

  • Use Whitespace
  • Put Whitespace between elements
  • Dont use too much whitespace
  • Define hierarchy using whitespace
  • User Experience

    Design according to users needs

  • Design should be according to users and buisness goals
  • Thats all of basic of web design , I will add points as I learn more and more about it.

    Thank you for reading



    Go Back