SEO Basics: How to Design a Good Navigation Bar for Your Site

I know that designing a website can be pretty exciting, especially when you have a ton of awesome ideas to implement on it. However, in the beginning, you might want to reign in your creative musings and stick to what’s practical.

When coming up with a design for your site, one of the first elements you have to consider is your navigation bar. This is where all the major categories of your blog will be found. More importantly, it serves as the doorway and interface to the rest of the pages on your site. Here are a few tips that you might want to consider when designing your nav bar:

1. Follow the KISS principle – Keeping it short and simple is always the best way to go. Try not to squeeze in elaborate headings for each category when a one word description will suffice. Instead of putting “Latest News”, you can use the ever simple “News” for a category heading – a good rule of thumb is 12 characters or less. Practicing simplicity and avoiding over crowding with too much text will improve the readability of your nav bar by keeping it clean and professional.

2. Why won’t anyone think of the spiders? – While you may have a killer navigation bar in terms of looks, remember that there’s more to it than that. Keep in mind that a site not only has to appeal to the visual sense of a human being, but also to the algorithms of a search engine bot. Using a Flash driven nav bar may look pretty, but the spiders might have a tough time reading the text on it.

3. It’s better to be more consistent rather than creative – Remember what I said about keeping it simple? I know it’s not always easy to contain your excitement, especially when you have a lot of ideas whizzing through your head about how you want your site to look. But, usability and consistency should still take top priority. Make sure that your nav bar appears in the exact same place on every page and that any drop down menus are properly lined up with its respective category.

4. Make sure to include visual cues to remind your visitors where they are – This is more applicable if you don’t have too many sub-pages or levels underneath each category in your nav bar. If you do, then it might be better to include a directory or navigation hierarchy running just below the navigation bar. Then again, that’s a bit outside the scope of our discussion. In any case, visual cues help track where a visitor is and improve the clarity of each page. A good tip for this is to change the background color of the navigation tab to indicate the current page.

5. Whether horizontal or vertical, remember how the eye moves – Another practical tip is to observe the behavior in which people normally read: from top to bottom, then from left to right. Keep this in mind when you’re trying to decide on either a horizontal or vertical navigation bar. If any of its categories contain any sub-menus, try to keep them in the proper orientation as well. This will greatly enhance the readability of your nav bar.

Well, those are all the tips I have for you on this subject. On a final note, try to imagine each page your navigation bar directs your visitors to as a landing page where you can push for a possible conversion. This is why it’s important to see that your navigation bar is as user friendly and as clear as possible to everyone visiting your site. In any case, just remember to keep everything practical and have fun designing!

If you have any questions on how to streamline your nav bar further, feel free to drop a line through the comment section below.

Later,

Andy