Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Best practices for setting up your website’s navigation.


Recommended Posts

Your website’s navigation might not be the first thing you think about when setting up your website, but it is a key aspect of your customer’s experience with your brand. A smooth navigation setup can really make an impact and encourage repeat visitors.

A common goal for navigation is making sure your visitors don’t have to click more than 2-3 times to get from one section of the website to another. Some achieve this by sketching their site out on paper first. Others put everything in first, then let their analytics do the talking. Everyone has different strategies to achieve their perfect site navigation.

What has been most helpful to you when setting up your website’s navigation? Share in the comments below!

 

Link to post
  • Replies 5
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

Over the years, I've adopted various strategies. For smaller sites, it's usually just easiest to sketch on paper so I can "feel" the logical flow. This can work for larger sites also, when navigating

Navigation is the first thing I think about, how to keep it clear and concise. Also important to remember the user journey, say you have a Services page, you probably want to include an option fo

Your website’s navigation might not be the first thing you think about when setting up your website, but it is a key aspect of your customer’s experience with your brand. A smooth navigation setup can

Posted Images

Navigation is the first thing I think about, how to keep it clear and concise.

Also important to remember the user journey, say you have a Services page, you probably want to include an option for them to go to the bookings page / contact page from there.

I believe a sites homepage is its most important tool, I ensure users can get to all of the most important areas of the site from this page, in both the navigation bar and the pages content. 

Link to post

Greetings!

My site has two navigations due to one being for mobile. This becomes an issue for screen reader users as my navigation appears twice when I remove my styles (see image)

It makes my navigation redundant for screen reader users.

Any idea of how to remove the extra navigation with html code

and then add CSS Style that can make the menu accessible/responsive on mobile?

Thanks!

 

Screenshot 2021-03-30 at 14.20.02.png

Link to post

Over the years, I've adopted various strategies. For smaller sites, it's usually just easiest to sketch on paper so I can "feel" the logical flow. This can work for larger sites also, when navigating to grouped sections. If I have an ongoing partnership with my clients, then I will use analytics to determine what might work best.

I would like to switch to digital wireframing, has anyone used Adobe XD? Sketching will always be quicker for me, but I'd prefer a digital copy to look more professional and more quickly share ideas with clients.

Link to post
  • 2 months later...

Primary, secondary, and tertiary navigation.

Primary:
your main header nav, and this should be the big guns of your business, product, or service and what your customers will be looking for and will immediately find easily. Maybe a CTA button as well of which the purpose is what action you want your site visitor to take (alternately, you can place your CTA in the top bar/secondary nav). I try to keep the number of links in this section to 7 or less, and occasionally omit the HOME link if the target audience is savvy enough to know the logo/company name links to the home page. I also include the logo or entity name, with easy-to-understand tagline in this section.

Secondary:
a top bar with email, phone, maybe address (or map icon) if brick/mortar; sm links; and "secondary" links that are not as critical as links in your primary nav. You can also place your CTA button in this section rather than the primary nav. 

Tertiary:
in the footer. Basically all nav links for easy access (perhaps separated into columns by content), along w/ contact/location info, SM links, logo/company name, and tagline.

Examples here and here of primary and secondary navigation.

Example here of primary, secondary, and tertiary navigation.

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...