What makes a good navigation button

Disadvantages: The same as label navigation. Which differentiates through the icon floating above the UI and has the appropriate dynamic effects, creating new navigation guidelines. Similarly, Evernote also draws lessons from this model, the user simply taps the lower right corner of the floating button, you can quickly record the current inspiration.

Tumblr is equipped with vivid icons and appropriate labels. When you scroll down to browse content, these icons will naturally disappear. The icons are clear and easy to understand, and they allow custom labeling, which results in a refined and neat visual experience. More and more designers are aware of the importance of mobile navigation menu design for improving the user experience.

In Android, we saw the navigation iteration from Hamburg to a separate tab bar. In iOS, more and more apps are removing small tab bars and replacing them with bigger, clearer icons. In pursuit of better user experience and simplified APP design, designers are constantly exploring new design directions along the path of optimization on navigation design.

UX Planet is a one-stop resource for everything related to…. UX Planet is a one-stop resource for everything related to user experience. Sign in. UX Planet. Amy Smith Follow. I like sharing All thing about design! UX Planet Follow. Written by Amy Smith Follow. More From Medium. Websites without a home button often will see an increase in direct traffic from returning users during a session indicating that users who do not know the logo is a route to the home page will instead clear the address bar back to the root domain to get back home.

Based on our research, we have decided to omit the home button in most instances. Although when it is present, it is often used, most users seem to understand how to get to the home page regardless of the inclusion of a home button. With the complexity of modern websites, we are usually pressed for space in the header and can better use the real estate that would be dedicated to the home button for other UI elements.

That said, if the audience for our website skews older, we will still include the home button. Our research has indicated older users are less familiar with the concept of the logo being a home button.

Answered 6 years ago. I'll provide the standard UX answer: it depends. With the small bit of information you provided it is tough to make a definitive decision.

Navigation is key element to user satisfaction. Effective support of the users task flow is critical. A home screen may or may not provide utility to the task flow - it depends on usage patterns. I'm happy to discuss to get more details IMO, the navigation is sacred real estate that should remain uncluttered.

A gratuitous Home link adds 0 value there. Look for trends in how your participants group the pages on your site, and ask them how they would name each category.

The resulting organization can help build the backbone of your site navigation. If your marketing analytics software provides it, attribution reporting is perfect for deciding what should go into your main navigation. This report attributes the number of newly created contacts to their interactions with your business, so you can better understand the content and functionality on your site that's converting visitors into leads.

While some of our content offers garner a lot of traffic, the most common pages viewed by people who ended up buying HubSpot software were the product pages, pricing, case studies, and partners. If you take a look at our homepage, you'll see that the navigation reflects this finding and prioritizes those critical pages. If you don't have an attribution report, you can still get a sense of which pages are important on your site though the Users Flow report in Google Analytics.

While this report doesn't differentiate standard traffic from customers, it does highlight how people seem to navigate their experience on your site. In Google's own words : "The Users Flow report is a graphical representation of the paths users took through your site, from the source, through the various pages, and where along their paths they exited your site.

Order matters in website navigation. Cognitive studies provide evidence that web page viewers tend to remember links on either end of the navigation most vividly. Often referred to as the primacy and recency effects , they speak to the phenomena that words presented either first or last in a list tend to pull more heavily on the attention span of viewers. So for your website, you'll want to be very intentional about what items you place in these spots. Think about what is most important for your typical visitor.

How you phrase your navigation options depends on the type of business or organization you are. You can opt for straight-forward, or experiment with more creative labels.

Then, think of search engine optimization. Arguably the most clear-cut option for websites is object-based navigation. Object-based navigation places content under concrete typically noun-only categories. This type of organization treats the navigation as a table of contents and groups pages into the topics or categories that best fit. Notice that the navigation links to the right are more action-based than object-based. Some sites may be better served by action-oriented navigations.

To know when this is appropriate, ask your audience whether they primarily come to your website to learn about something, or to take an specific action. In the example below from Howard University, visitors are clearly coming with an action in mind. For companies that have multiple audiences with clear lines, you may want to consider an audience-based navigation or sub-navigation as in the example below.

This only works, however, if a visitor can easily classify themselves. For example, you wouldn't want to use small vs. In the example below, Boston College does a nice job of using an audience-based approach in combination with an object-based navigation. In addition to matching the way your audience instinctually organizes your site, you'll want to think of how to best optimize your navigation terms for search. In an article on Distilled , SEO strategist Kristina Kledzik advises using Google Analytics and Google's Keywords tool to identify the search terms that are most commonly bringing people to your site, and use variations on those words as the guide for your website navigation.

Propa Beauty has a minimalist horizontal navigation bar designed to generate sales or convert visitors into members. Its logo is to the left. At the center is a link to its product archive page. To the right, there are three icons, each respectively representing a search box, link to a member login page, and link to a shopping cart. NWP is another ecommerce site with a horizontal navigation bar. When the page loads, you can only see the primary navigation links.

The Shade Room makes use of two styles of navigation menus as well. At the top of the page, you see a standard horizontal header. Notice that this header contains a hamburger button to the right. If you click on this button, a secondary navigation interface appears to the right. This acts like a lightbox popup , blocking some of the content and dimming the rest of the background, and contains more navigation links that you can use to browse the site.

To accommodate its large catalog of items, Patagonia implemented a mega menu on its website. Like Patagonia, the website navigation on Briogeo.

Twitter features one of the standard navigation types — the vertical sidebar menu — but with a twist. Instead of simply featuring text navigation items, it includes icons next to each item.

Notice the strategic color use as well. The only other pop of color in the nav bar is the CTA button. The portfolio site of Creative Director Olivier Gillaizeau features an eye-catching vertical sidebar menu that displays his projects on a timeline. When you hover over one of the nav items, a video preview of the project shows.

Clicking the nav item will take you to a page with more information about and visuals of the project. The golden rule of website navigation? Don't make people think. Usability consultant Steve Krug bases an entire book on this sentiment. To enable users to navigate your website with ease without feeling lost or frustrated, follow these best practices.