Wednesday, January 5, 2011

Good Page Layout is Like Beautiful Music

When you listen to a great piece of music, it has form, but yet variety. You can follow along and almost anticipate where it's headed and get excited when something unexpected, yet complementary to the piece, comes up in the song. When I hear some of the pop music that is just the same three chords played over and over again, it's boring and uninteresting. When I hear a song whose every beat is filled will unceasing guitar riffs, drums, and bleating, my ear gets tired. And, frankly, when I hear a song that just isn't speaking to me, not relating to me or my life, I turn it off.

Your website's page layout is the same for the eyes as music is for the ears. It's the frame that holds your content together. A good layout is not only clean, consistent and relative, but intuitive for your end-users.
Keep it Clean
Keep your pages uncluttered. Allow plenty of white space on your pages. White space on a page is like a break in the music, it gives you a moment to rest. Or in this case, a moment for your eyes to rest. Keep the focus of your pages on the topic of the page. Think about what is the one or two things I want users to take away from this page, and make sure there is nothing on there distracting from that message.

Keep it Consistent 
Users generally look at the top center of a page first, then look left, then right, and finally begin systematically moving down the total Web page. On web pages there are some important elements that should be captured and no matter where you put them and they should be in the same place on every page so your user can anticipate and easily find them. This is like the beat of the music, steady and consistent. You know you can tap your foot confidently with the song.

The important elements for a consistent page layout are:
  • Navigation  
  • logo / your company info (header)  
  • Page Titles  
  • content block
A footer with copyright info is important too, but probably not key to the content you are trying to deliver.

Keep it Relative
Make sure your page delievers what it promises and keep important information and any key concepts you are trying to convey near the top of your page so your user can quickly and easily determine that page's purpose and how it fits with their needs.

Make sure it's easy to understand the next steps to take from a page - whether it be to call you, visit another page, or buy something. Every page should have some kind of call to action that a user can do once they've made a decision on the content you delivered.

A good page layout is like a good song. You enjoy it, admire it, and come back to it again and again because it's clean, consistent and relative to you - three easy concepts for beautiful design.