Understanding the Principles of Good UX Navigation
When a website is excellently designed, we tend not to pay attention to the reasons why it’s so great—we simply enjoy it. On the other hand, if a website is difficult to use or frustrating, we’re more likely to take note of exactly what is making our experience so bad. This phenomenon has a name: It’s called the negativity bias, and simply put, it’s the sociological explanation for why we’re more likely to notice a negative experience than a positive one.1 It turns out that negative experiences require more thought for us to process, as they take us away from the experience we expected and demand a shift or adjustment in our thinking and action.2 Unsurprisingly, these moments are more likely to stick with us than a moment that went perfectly according to plan.
For user experience (UX) designers, the negativity bias is important to keep in mind. Since UX design, at its most basic, is the act of seamlessly and strategically moving users from one place to another, usually within a digital environment, any unwelcome or negative moment within a user’s interaction has the ability to entirely disrupt the experience. On the other hand, if a UX designer has done his/her job well, the user will move through the experience blissfully unaware of the tremendous amount of work that went into the design.
Perhaps the most foundational element of UX design (UXD) and overall user experience is a site’s or application’s navigation. It’s the least subtle indicator within a digital environment that helps users find directional information and understand how to use a site, so they can know where to go and reach the intended outcome of the design.
A site’s navigation is of critical importance, and each digital platform calls for a different navigation strategy. For example, navigation on a tablet will demand a different process than that on a desktop, and an app being used on a phone will require a different interface than one being used on a car’s touch screen. While there are many different approaches to great navigation, there’s a general consensus on what to avoid, or what constitutes a poor navigational experience.
Below, we’ve created a brief list of the basics of good and bad navigation for UX designers to keep in mind.
The Good
Most websites and digital experiences have a reason for being, an end goal for their intended audiences. Usually, the designers and operators of a website are hoping for the user to take certain actions that contribute to whatever the website is promoting.3 Whether it’s buying a new pair of shoes or liking a photograph on social media, it’s up to the design of the site to get the user to, one way or another, use the website as intended, without getting confused or lost along the way. To do this, it’s critical for UX designers to cultivate a strong, clear and simple navigation. Some key strategies to help move users through a website are:
1) Sticky Navigation: You may not have noticed, but on many of the best websites, the navigation at the top of the page never goes away as the site is scrolled through.3 This is a simple technique that keeps the navigation options in front of users at all times, no matter where they are on a given page, allowing them to easily move about the site as its content motivates their interest. It’s also a clean strategy for constantly providing several visible navigation options.
2) Breadcrumbs: On a website, breadcrumbs usually appear just below the primary navigation, showing the user where they’ve been on the site and where their current page exists within the site’s overall structure. This is a strategic move that simply allows users to understand where they are on a site as they get further into its content.4 It’s an especially useful tool for large websites with many secondary and tertiary pages.
3) Consider Mobile: Since over 50 percent of web traffic begins on a mobile device, designers must consider mobile interfaces when developing navigation.5 Mobile devices come with unique restrictions, so to accomplish an intuitive navigation that’s completely compatible across devices, UX designers may need to forgo elements that only really function in a desktop or laptop interface, such as hover navs.4 However, creating an experience that translates is well worth it in the end.
The Bad
Now that we’ve explored ways in which UX designers can create strong navigation, we can look at what not to do. This is a much easier exercise, and in many ways, is self-evident based on what’s been discussed thus far. That is, if creating a strong UX navigation is all about simplicity and clarity, then by that token, UX designers should avoid messiness, confusion and clutter. Elements to avoid when designing navigation include:
1) Confusing Navigation Titles: In both the primary and secondary navigation, it’s helpful to have clearly defined and understood group names, such as “About Us” and “Contact Us.” Try to avoid unclear language. For example, calling a “Contact Us” section “What’s Up?” may seem fun, but might be too confusing for all audiences to quickly understand.
2) Too Much Visibility: Not all websites can be ten pages long. Some websites, by default, will have layers of pages based on the content and business needs. However, it’s important for UX designers to limit what information appears in the primary navigation. Having too many choices can prevent ordinary users from having a successful and enjoyable experience.6
The Good Often Goes Unnoticed
For UX designers, creating a strong UX navigation means trying to integrate the navigation into the user’s experience as smoothly as possible. The best UX navigation is one that doesn’t call attention to itself. It is clean, clear, simple and most importantly, useful.
Want to learn more about how to guide users to where they need to go? Discover Kent State University’s online Master of Science in User Experience Design.
Sources
- Retrieved on March 26, 2018, from positivepsychologyprogram.com/3-steps-negativity-bias/
- Retrieved on March 26, 2018, from nytimes.com/2012/03/24/your-money/why-people-remember-negative-events-more-than-positive-ones.html
- Retrieved on March 26, 2018, from uxplanet.org/5-ui-patterns-navigation-that-makes-good-ux-sense-92a65df7485d
- Retrieved on March 26, 2018, from uxbooth.com/articles/the-rules-for-modern-navigation/
- Retrieved on March 26, 2018, from statista.com/statistics/277125/share-of-website-traffic-coming-from-mobile-devices/Retrieved on March 26, 2018, from psd2html.com/blog/the-good-the-bad-and-the-best-in-website-navigation.html
