I’ll not say that I am good web designer, but, I’m learning it. Well, in this learning and improving stage I just came across an awesome article from Inspect Element on designing layouts. In this post I’ll share the knowledge I gained from that article. Here are the 3 Tips that I want to share with you that will give you a better idea of how you can create a good looking and an appealing website layout.

website-layout

The Whitespace

White space means the space between two elements. Its often called as negative space. Whitespaces make a good web design look awesome and cleaner. It makes the visitor notices all the content that you want him to see. Don’t make your layout look so untidy or make your content touching each other. Give it some space and let it breathe. Just look at this awesome example from Mark Boulton. For display of his book 5 Simple steps, he made good use of white spaces by separating the paragraph and the button. Giving the content the attention that they deserve. Here’s the pic.
5 simple steps-layouts
Source: Inspect Element

Let the content Flow

Flow in the sense, you need to make the visitor guide through the content. Let it notice every content. The flow of a web design depends upon the color, typography, size of elements and images. This things tells the visitor what this site can do for you. Here’s an example of the website Fever.
fever-layout
Source: Inspect Element
They have made every content look appealing and get noticed. The visitor will probably not miss any content. The use of image to draw the attention of the user. See points 2,3,4,5 and 6. The use of Typography at points 3,7,8 and 10. The horizontal red lines separating the sections gives natural reading from left to right.

Keep it Aligned

Alignment of elements also helps for maintaining the flow. Alignment gives the user natural reading and he can scan the content better. The best way is the 960 Grid System. Its the most commonly used grid system now a days.
Hope, this added some kbs of knowledge to your brain. Will keep sharing some awesome contents like this. Stay tuned and do subscribe us. Want some widgets and code snippets we’ve got it.

Share and Enjoy:
These icons link to social bookmarking sites where readers can share and discover new web pages.

  • Digg
  • del.icio.us
  • StumbleUpon
  • Reddit
  • Ask
  • email
  • Facebook
  • Squidoo
  • Technorati
  • Twitter
  • Google Bookmarks