Full day training course offered at The UX Conference San Francisco

Navigation Design

Menu styles and UI components for effective navigation

Course Date: May 01, 2013


Usable navigation allows users to seamlessly move throughout your website or application. To create an effective and extensible navigation system, you must understand the possible navigation components and styles that support both your business needs and your users’ tasks and capabilities.

In this seminar, we’ll explore a broad range of specific navigation components and menu styles and give you the tools you need to make informed navigation design decisions that make your information architecture clear and understandable.

"Nicely detailed course backed up with great exercises and very explained slides. Engaging and presenting different perspectives for the different navigation issues. I liked how most of the points have a mobile solution — that most of the slides are visuals and full of examples of which help us visualise the problem and the solution."

Grance Maroun
GUIX

Topics Covered

Topics Covered

  • Purpose of navigation
  • Orientation, route selection and arrival
  • Navigation as part of the UX system
    • When to define navigation
    • Which navigation components to use
    • How to test navigation
  • Fighting requests for Wow! factor design that is not user-friendly
  • Top attributes of effective navigation systems
  • Flow comparison
  • Tier comparison
  • Process for defining a navigation system 
  • Global navigation: placement, orientation and behavior
    • Tabs
    • Static links
    • Roll-overs
    • Fly-outs
    • Cascades
    • Horizontal vs. vertical orientation
  • Local navigation
    • When to introduce local navigation
    • What to include in local navigation: Understanding parent, child, and sibling pages
    • E-commerce variations
    • Deep-site strategies: mini navigation and roll-up navigation
    • Placement: right versus left
    • Floating menus
  • Navigation for discovery
    • Related links
    • Social filters
    • Tag clouds
    • Filmstrips
  • Faceted search: integrating search and browse
    • Single versus multiple selection
    • Set-clear-set interaction pattern
    • Placement
    • Intuitive controls
  • Navigation for task support
    • Utility menu
    • Quicklinks
  • Elements for creating structure
    • Spatial navigation
    • Site maps
    • Breadcrumbs
    • Process navigation
    • Pagination
    • Footers
    • Related links

Format

Format

This course is an interactive lecture. You will learn to apply and practice new principles and techniques through in-depth exercises, while staying grounded in the research that supports them. Individually, and in groups, you will evaluate and redesign a website’s existing navigation system.

The course also includes:

  • Findings from our own usability studies, including eyetracking
  • Videos from user testing showing people's behavior in response to a design
  • Screenshots of designs that work and don’t work, and why
  • Opportunities to ask questions and get answers

Participant Comments

Participant Comments

"The information is based on research and not opinion. A good broad range of examples shown and analysed — very useful. I like how discussion is encouraged."

Denise Popovic, Royal Australasian College of Physicans

"This course found me to look at navigation from the user's perspective. It made me realise that my perception of a logical navigation may differ quite a lot from the end users who use my site."

Alexei Krasnov, Mastercard

"Although the topic is short on easy answers, it is great to understand the pro's and cons of the many possible approaches."

Andrew Dean,  Rapid Prototyper: LIC

"Get clarity and confirm how to use elements in web pages to get where you need."

 

"The range of examples shown was great. Instructor took great pains to answer individual questions and expand them to general audience."

Mala, Project Manager — Sydney

"The content of the course provided structure to development and design. The combo of theories and examples are really useful."

 

"Very useful and insightful course with a lot of examples from user research."

Laura Versteele

"I truly enjoyed Katie's teaching style. Her passion and excitement for this domain is infectious. I feel that even though there is a lot of content to this course, I am now comfortable with the topic because it was presented so well. Excellent job!"

 

"From start to finish, this class was great and I can't wait to get back to the office to share key takeaways and implement some of the strategies and good nav attributes I learned. Mind blown!"

 

"Provided plenty of examples and exercises to keep me engaged as well as provided me perspective."

Antonio Lee, Wells Fargo

"This course provided key design concepts organized in such a good way that will help me refer to and apply right away when going back to provide navigation recommendations for my projects. Great presenter!"

Maria Rubio, Liberty Mutual Insurance

"Fantastic class! So great to get questions that directly pertain to me and my company answered! Thank you."

Sarah Davies, Lexmark International

"This course answered a lot of questions I had about determining architecture, displaying navigation and handling different tiers of subnav. The exercises were most helpful for grasping the info."

Dana George, Standing Dog Interactive

Instructor

Instructor

Jennifer Cardello

Jennifer Cardello is a Director of User Research at athenahealth. For over 18 years she has designed strategies to help organizations bridge the gap between business goals and user needs. Prior to joining athenahealth, Cardello was a member of Nielsen Norman Group, where her research focused on information structure, navigation patterns, rating and review systems, discussion forums, content sharing, and trust and persuasion.