1 / 28

– Strategies for Effective Navigation

– Strategies for Effective Navigation. Design & Prototype Phases. Navigation. Effective web navigation is perhaps the most important aspect of ensuring a Web site's usability. Understanding a site's mission and audience.

cliff
Download Presentation

– Strategies for Effective Navigation

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. – Strategies for Effective Navigation Design & Prototype Phases

  2. Navigation • Effective web navigation is perhaps the most important aspect of ensuring a Web site's usability.

  3. Understanding a site's mission and audience • Before designing navigation, you must a firm understanding of the organization and its goals and objectives.

  4. Defining a site's content • Be careful to limit the site’s content - think carefully about the purpose of the content. • Each piece of content should in some way support the site's mission and/or user's goals.

  5. 80/20 rule of Web functionality • Concentrate on satisfying or meeting 80% of user needs. • Meet requirements that some (20% or less) users are interested in, only if it doesn't decrease the usability for the majority of users. • Try to avoid adding functionality or content because "you can" or "it might be cool" or "some people might like it."

  6. Content labeling • Informative labeling is important to a navigational scheme. • Major content sections and subsections should be given descriptive and intuitive titles. • These titles will be used as labels for the various elements of the navigation.

  7. Paper prototyping • Paper prototyping is an excellent method for gaining valuable user and client feedback early in the design process. • It also allows you to save a lot of time, money, frustration, and redesign later in the development process. • The goal is to receive a maximum amount of feedback for a minimum amount of effort.

  8. Benefits of Paper Prototyping • Paper prototyping is also a valuable tool to help ensure that the design team and client/project sponsor are on the same page. • Seeing a tangible, albeit rough, design may help the client to recognize additional content they desire for the site. • It may also help them to identify content or features that are displayed in a way that differs from what they had envisioned.

  9. Global Navigation • A web site's overall navigational scheme may be broken down into a series of complimentary navigational pieces. • These pieces are the global, local (sub), supplemental, and contextual navigation.

  10. Hierarchical global& local

  11. Deep menus could drive you crazy or maybe not!

  12. Navigation styles • The navigation should be flexible enough to accommodate additional links • For this using drop-down menus or section home pages might be helpful.

  13. CSS for creating navigation • http://www.mmlab2.rlc.dcccd.edu/imed2315n01/tutorials/css-navigation.html

  14. The New York Times • The New York Times (http://www.nytimes.com/ chooses to display their global navigation at the top and as a left hand menu • This particular site displays both global and sub navigation in the left hand navigational menu. • Keeping all of the navigational elements in one general location provides consistency for the user.

  15. Contextual Navigation • When describing parks in the Dallas area, you may allow users to navigate to the Texas Department of Natural Resources -- this would be considered part of the contextual navigation system.

  16. Supplemental Navigation • Supplemental systems include things such as sitemaps and site indexes. 

  17. Site Maps • http://barrieranalysis.fhi.net/site_map.htm • http://captus.samhsa.gov/national/site_map.cfm

  18. Search Engines • Most are aware of the huge impact of search engines!

  19. Breadcrumb trail navigation

  20. a good navigation system must be: • AccessibleThis usually means avoiding special effects like Flash, Java, or JavaScript as your only navigation method.

  21. a good navigation system must be: • Consistent - Your navigation should appear on every page - not identical navigation, the basic structure should be the same throughout the site, with changes used only to indicate location within the hierarchy.

  22. a good navigation system must be: • Clear - Links should be clearly and easily identifiable as links (this is also known as visual separation). • You can highlight the current page link (saying, in effect, "You are here") • or provide a brief chain of links at the top of the page (e.g., "Home / Company / EmployeeProfiles")

  23. Therefore, effective navigation systems should: • Tell users where they are – Users must know where they are so they have a reference point for adjoining areas or states • Tell users where they can go – Users cannot go somewhere if they do not know how to get there • Tell users where they have been – Users do not navigate in one direction; they often backtrack

  24. Scalability & Maintenance • In many cases sites have a tendency to outgrow their navigation, necessitating that additional content sections and links be added.

  25. In Conclusion • Remember, don’t reinvent the wheel – use navigation structures that have worked for others. • And don’t disable the back button!

  26. Credits • Interesting Article on Navigating Large Websites • Another Excellent Article • 80-20 Rule

More Related