Website Navigation and Layout 101

A website isn’t any good unless you can capture the attention of your target demographic. Let’s face it, many of us have been through the first, second or even third re-design of our website to achieve a more effective image, layout and/or increase sales, sign ups or page views.

Whether it is your first or forth website, these are things you should keep in mind in regards to layout and navigation.

Web surfers are impatient!

1. Catch their Attention Fast – Satisfy their needs as soon as you can through simple design and in your face call outs.
2. Simple is Better – If you navigation wording is confusing, the visitor will not find what they are looking for. KISS (Keep it simple silly) should be what you reach for in naming the pages of your site. Resist the temptation to use clever or ambiguous names for links.
3. No Flashy Intros – Splash/Flashy intros are a bad idea (in my opinion). Remember most visitors are looking for information, not entertainment. If you fell like you need one, make sure you give your visitor the ability to skip.
4. Three Click Rule – Studies have shown most users will only click three times in order to get to the information they want. Make sure all the information on your site is three clicks or less away from your home page.

Home, About Us, Contact Us – Oh My!

Navigation is something that must be seen right away! If a visitor can not find what they are looking for then they will leave and never return (well they might come back but it is better to capture them right away then chance it). Have your navigation where people look for it:

1. Top Menu- usually located directly below the page header, each menu item can be represented by a graphic or just plain text. Menu items are single, drop down or expanding.
2. Left Menu – implemented as a column or text area, each item (like the top menu) can be single link or expanding.
3. Right Menu – primarily used for ad space, the right side can be used for navigation and would be implemented like the left menu.
4. Bottom Menu – exclusively used as text links and are located in the footer.

Road Trip! How do I get from one place to another more effectively?

I would hope that your existing site or idea for your new site does not come complete with a road map on how to get from one page to the next for your visitors. Your site should be set up as a no brainer for your visitor. They should be able to get from your homepage to an internal page as if they were a repeat visitor to your site!

1. Internal Pages – Every page should be 2-3 clicks away from the home page
2. Important pages should be ONE Click! Home page buttons and call-outs are usually somewhere you can get to them right away. After all – if you are trying to get someone to navigate to those pages you want them upfront and easily found.
3. Login – if you have login boxes those are typically found in the upper right hand corner above the header. They should be prominently displayed as to not frustrate a client or member of the site.
4. Shopping carts – a view cart button should be easily access able from each page. The most commonly used location is the top right side or as part of the header. The same goes for ordering. Buy now buttons should be large and visible, the fewer clicks it takes to get to the order page, the more orders you will get!
5. Breadcrumbs – I used to think these were over rated but as you get into the more complicated sites, the more pages you have the more useful breadcrumbs become. Each page is listed in the order you arrived there and they each link back to those specific pages. (i.e. Home >> Articles >> Marketing)
6. Advertisements – Usually hyper-linked to the source, these should open in a new window and can be placed anywhere on the page but most often found on the right side of the page. Thinking back to when you took those marketing courses, above the fold was a common expression when it came to grabbing attention. The same is true for ad placement. If your ad placement is placed above the fold, they tend to be more affective. However you will notice that the Web design trend is shifting to fit all elements of at least the home page above the fold in order to grab the attention of the visitor more quickly than before.
7. Downloading items! Make sure the user is aware of how large the file is by listing that information as well as what software will be required to view the file. Commonly you may see links to software sites for those documents or applications that may not be as standard as others. (i.e. Linking to an updated flash player vs. A word document)
8. Site Map – A great idea for search engines large and small! Starting with a site map is one of the most important aspects when developing your navigation. This helps you gather your thoughts on what will be where when deciding how to get to certain pages in the site (within 3 clicks of course). Having a site map on your website is great for visitors who know how to use it and what it is for. These are usually linked to within the footer of the site.

A good navigation and layout can be the difference in getting your story or message across to your visitors. Does your website follow these guidelines? If you answered no, maybe we should talk : )