A Free-Reprint Article Written by: Jason OConnor Article Title: How to Plan and Make a Website's Navigation Bar
See TERMS OF REPRINT to the end of the article. Article Description: The Web is interactive. As a visitor, you get to determine where you go and what you see. One of the most important features of every website is its navigation, and its navigation that gives the controls to the visitor. Additional Article Information: =============================== 841 Words; formatted to 65 Characters per Line Distribution Date and Time: 2009-12-30 14:15:00 Written By: Jason OConnor Copyright: 2009 Contact Email: mailto:[email protected] For more free-reprint articles by Jason OConnor, please visit: http://www.thePhantomWriters.com/recent/author/jason-oconnor.html ============================================= Special Notice For Publishers and Webmasters: ============================================= HTML Copy-and-Paste and TEXT Copy-and-Paste Versions Of Article Are Available at: http://thePhantomWriters.com/free_content/db/o/website-navigation-bar-design.shtml#get_code --------------------------------------------------------------------- How to Plan and Make a Website's Navigation Bar Copyright (c) 2009 Jason OConnor Oak Web Works, LLC http://www.oakwebworks.com/ The Web is interactive. As a visitor, you get to determine where you go and what you see. One of the most important features of every website is its navigation, and its navigation that gives the controls to the visitor. The navigation bar is a grouping of the main sections of your site. It's important that every page has the same navigation bar. Don't make the user think by having to relearn the system when they get to a new page. Don't confuse the visitor. Consistency builds trust and facilitates finding what's desired. The navigation bar should be the same on every page including the homepage. Since half your visitors will start on the homepage, this is the perfect opportunity to introduce your site's structure. The structure is represented in the navigation bar. Use a visual structural diagram to help you create the navigation bar. A visual structural diagram visually is simply something that represents the planned organization or architecture of your website. The main sections which were mapped out in the visual structural diagram become your navigational sections. There are numerous different types of navigation bars. They can be comprised of buttons, text links or JavaScripts. They can be horizontal under each page's main banner image. The can be vertical along the left or right hand sides. There can more than one. For instance, you could have one navigation bar that points to all the main sections of the site run vertical and along the left hand side, and also have a horizontal one that runs across the top and points to all the company-related pages. How should you organize your navigation bar(s)? That depends. Ask yourself, what will make the visitors' lives the easiest, not make them think and help them best accomplish their goals? Also, make sure it's clean and easy to use. If a navigation bar is cluttered with 45 links all on top of each other with no breaks, you're making visitors work hard to find what they want. Finally, stick to Web conventions. Don't reinvent the wheel here. You may have a designer who is dying to present your navigation bar in some weird but original way. Don't let her. You can't go wrong with a simple and small list of vertical links or buttons down the left hand side of each page. Since this is a standard, it's a sure bet. And the other good choice is a horizontal nav bar across the top of your site just under the header graphic. Eye-tracking studies have been done to determine where people's eyes move when they land on a Web page. They generally go from the top left down to the middle of the page first. So be sure that your most important page elements, including your navigation, appear within this path. Now you know why so many websites place their logo in the top left. Even more importantly, always group your navigation in items of six or less. So if you have eighteen buttons in your vertical navigation bar, split them up into three visually distinct groups of six. Eye-tracking studies have shown that this works best for Web page viewers as well. You may have a lot of pages that you want represented in the main navigation bar. In this case, employ rollover menus. This is usually done with JavaScript or Flash. It's important to keep in mind that your site's functionality should work across all popular platforms and browsers. This extends to navigation as well. So if you include rollover menus in your navigation, be sure the rollover functionality works for everyone, regardless of the platform or browser they're using. JavaScript is supported by all popular browsers, that why I suggest using it, but you still need to test it using various platforms and browsers to be sure your navigation works for everyone. When deciding on your navigation bar structure, be sure to think in terms of how your visitors see and use the site. In other words, group similar sections together from the point of view of the user and what the user will want to do. Support sections should be grouped together and company sections should be in a separate grouping. By following a few simple rules when creating a navigation bar you'll be sure you have the best-suited system on your site. First determine what the most important sections are going to be that require a link from every page. Then create a visual structural diagram to visually show your site's various sections. Think in terms of what you're visitors will want to accomplish and use Web conventions such as putting the navigation bar(s) vertically down the left or right hand columns and/or horizontally across the top. Group your sections in clusters of six. Be sure each button/link in your navigation bar is as descriptive as possible so that your visitors know what to expect if they click, and make the navigation the same on every page of your site to establish consistency. Copyright 2009 Oak Web Works, LLC --------------------------------------------------------------------- Jason OConnor is the head of Oak Web Works, LLC (http://www.oakwebworks.com/), an Internet marketing and Web design company in Massachusetts (http://www.oakwebworks.com/design/index.htm). Jason is the author of "The Ultimate Guide to a Successful Business Website" (http://bit.ly/6MPrey) that teaches you how to hire a Web designer and create a money-making website. --- END ARTICLE --- Get HTML or TEXT Copy-and-Paste Versions Of This Article at: http://thePhantomWriters.com/free_content/db/o/website-navigation-bar-design.shtml#get_code ..................................... TERMS OF REPRINT - Publication Rules (Last Updated: May 11, 2006) Our TERMS OF REPRINT are fully enforcable under the terms of: The Digital Millennium Copyright Act http://thomas.loc.gov/cgi-bin/query/z?c105:H.R.2281.ENR: ..................................... *** Digital Reprint Rights *** * If you publish this article in a website/forum/blog, You Must Set All URL's or Mailto Addresses in the body of the article AND in the Author's Resource Box as Hyperlinks (clickable links). * Links must remain in the form that we published them. Clean links should point to the Author's links without redirects having been inserted into the copy. * You are not allowed to Change or Delete any Words or Links in the Article or Resource Box. Paragraph breaks must be retained with articles. You can change where the paragraph breaks fall, but you cannot eliminate all paragraph breaks as some have chosen to do. * Email Distribution of this article Must be done through Opt-in Email Only. No Unsolicited Commercial Email. * You Are Allowed to format the layout of the article for proper display of the article in your website or in your ezine, so long as you can maintain the author's interests within the article. * You may not use sentences from this article as an input for any software that steals sentences from others in order to build an article with software. The copyright on this article applies to the "WHOLE" article. *** Author Notification *** We ask that you notify the author of publication of his or her work. Jason OConnor can be reached at: [email protected] *** Print Publication Reprint Rights *** If you desire to publish this article in a PRINT publication, you must contact the author directly for Print Permission at: mailto:[email protected] ..................................... If you need help converting this text article for proper hyperlinked placement in your webpage, please use this free tool: http://thephantomwriters.com/link-builder.pl ***************************************************************** * * This email is being delivered directly to members of the group: * * [email protected] * ***************************************************************** ===================================================================== ABOUT THIS ARTICLE SUBMISSION http://thePhantomWriters.com is a paid article distribution service. thePhantomWriters.com and Article-Distribution.com are owned and operated by: Bill Platt 3010 E Raintree Stillwater, Oklahoma USA 74074 Learn more about our article distribution services by visiting: http://thephantomwriters.com/x.pl/tpw/info/article-distribution/index.html The content of this article is solely the property and opinion of its author, Jason OConnor http://www.oakwebworks.com/ --------------------------------------------------------------------- XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ---------------------------------------------------------------------
