Blog Posts

Posted by: Brent Meacham on Apr 27, 2011

Good Navigation Websites

Being a part of the Shingo Prize team has been a great experience; one of the objectives of this project was to create an online employee behavior performance evaluation survey that adheres to the world class lean manufacturing principles. We wanted to create a online first class application so I decided to do a research of what characteristics good websites have. in doing so, this is what I found:

Speaking “Block”navigation examples:

Visually appealing icons are used more often:

3D effect:

Being in CEBA has being a very insightful experience, mostly to see first hands on experiences have been amazing. I was able to be a part of the Shingo Prize group. Being in the class System Analysis and Design was definitely a plus to being able to put in practice right away what we were learning in class. One of the things that I learned was researching what Good Navigations Websites have. For example, I was able to find websites that had good navigation, hovers, usability, and quick response. Some of those websites are the following:

1. Cisco.com

2. Naturxam.com

As I researched more, I noticed the following technology was evident in their page source:

Script language, Java Script, JQuery, CSS, Flash player plug-in; most of them had meta names; also, I noticed that they had Face book, Twitter, and RSS to the side. Super UI; also, I noticed that they had a testimonial of the CIO on the right side.

In addition, as I researched more, that these two websites had won awards from the Web Marketing Association’s WebAward.

http://www.webaward.org/winners_detail.asp?yr=all&award_level=best&category=Technology

Here are the criteria they used to choose:

  • Design
  • Ease of use
  • Copyrighting
  • Interactivity
  • Use of technology
  • Innovation
  • Content

Navigation examples

  1. Context sensitive and keyboard shortcuts : http://www.rememberthemilk.com/
  2. Visual JQuery
  3. Footer site-map
  4. Best overall communication? http://www.skype.com/intl/zh-Hant/home
  5. “Unambiguously guide the visitors through the different sections of the site. Designers “Soft” hover-http://www.smashingmagazine.com/2008/02/26/navigation-menus-trends-and-examples/ effects often support the navigation design by making the browsing more pleasant.”
  6. “Navigation is often structured by using blocks of the same height and width; large icons are used quite often”
  7. Atebits, uses links that are in the form of icons that feature a neat effect that allows the icons to light up as you hover over them. It’s simple, subtle, attractive, yet effective.”
  8. Forty, uses creative, image-based user navigation. The arrows “guide” the user’s attention to the buttons and invite the user to click on them.
  9. Healogix , asks the four most important questions of itself with large text that draws the users attention. When, what, why and who? Can all be answered one click away from the homepage?
  10. Pattern Tap, As soon as you enter the site you’re greeted by a green arrow that feeds you information about every section as you scroll through the site. This makes it easier for users to interact with the site.
  11. Work at Play, as you begin to click through the menu of this site, you’ll be able to notice that the position of the background and color of the entire site quickly change.

Comments

Add new comment
Please answer the question below: