How To Build A Clean WordPress Website Navigation
Estimated Reading Time: 8 minutes

Guide Users In WordPress Websites With Clear Site Navigation

Table of Contents
    Add a header to begin generating the table of contents

    It’s one of the more overlooked aspects of a web design, and it shouldn’t be. Clear website navigation is paramount to driving traffic in your WordPress website. In this article, we’re not talking about driving traffic to your website, but rather, what to do with website visitors after they’ve found your site.

    We had the pleasure of auditing a WordPress website earlier this week, and one of the biggest takeaways that were established is that the user is getting lost in the website.

    Where You Want The User To Go?

    It’s a simple task really. Give the user a clear path to the information they want to read.

    Too many website owners and in particular, WordPress website designers, forget the most important item on a page – website navigation.

    Here are some of the common items that we’ve seen people do with navigation.

    • The navigation floats on an image
    • The text on the navigation is too small
    • There are no clear buttons
    • Too many options to choose from
    • The navigation text doesn’t make sense
    • Rollover text does not highlight or underline
    • When a user gets to the bottom of the page, they’re lost

    These are just some of the more common items that we’ve seen in recent audits.

    Website Navigation Blends Into The Background

    The biggest culprit, by an overwhelming margin, is definitely the overlap of navigation on top of an image. If you look at our WordPress website,, you’ll see that the navigation is a clear blue bar, and the text changes from white to black. This provides definitive navigation to users.

    With the easy implementation of pages builders such as Divi, WPBakery, Visual Composer, Beaver Builder, Elementor, and more, the ability to modify the header has become a lot easier. These platforms and builders also allow users to have a giant image at the top of their page.

    Unfortunately, too many WordPress websites just don’t have clear navigation that is easy to click.

    If you use white text in the navigation and you upload a white or light background image, you can’t read the text. Similarly, if you make the navigation black text, you can’t use an image with colors or dark areas.

    But there is a simple solution to this; if you place the navigation menu in a solid color, you’re guaranteed that a user can navigate the website no matter what image you upload. This is our preferred, and recommended method for a clean website navigation layout.

    Sticky Headers – Keep The Navigation Visible

    It’s been a trend for the past few years, but in 2018 it really made its mark!

    The Sticky Navigation implementation means that the navigation is here to stay!

    When a user scrolls down the page, the top navigation scrolls with them. This allows a user, at any time, to navigate to a different page if they’re not finding what they need.

    This is an excellent navigation feature for nearly every website out there, but there are definitely use cases where this should not be used.

    There are isolated cases where you want a user to read or view everything on a page, and in those instances, the top navigation should not scroll with the user.

    Some good examples of not using sticky navigation are landing pages.  Specific landing pages used in marketing campaigns or PPC (Paid Per Click) generally don’t use or need, sticky navigation, and some don’t have navigation elements at all.

    When we look at pages considered “long form sales copy”, you want the user to read everything on the page. You want them to read the specifications or features. You want them to look at the reviews and testimonials, and by the time they get to the bottom of the page, that’s when you want them to sign up.

    The “long form sales copy” is a great lead qualifier. Heck, if they sat through everything else, they’re probably a good candidate for your product or service.

    In those cases specifically, you don’t want them to go elsewhere in the site. You are holding their hand through the entire process until they reach the bottom.

    Use Your Words – Label Appropriately

    When we review websites, we find many people use obscure references to sections of their pages rather than words that users would be more familiar in seeing.

    If you have a reviews or testimonials page, call it that. Don’t call it “Story Time” or “Affidavits.”

    When you go to a supermarket, and you’re looking for pastries or bread, they’re located in the “bread aisle” not the “gluten zone”.

    While you may think it’s fancy or even a little tongue in cheek to do this with navigation, you’ve only accomplished confusing your website visitor.

    And for the love of cheese, don’t add things to your navigation because there’s “not much” in the navigation.  Not every page has to be in the top navigation. This is what the footer navigation is designed to do.

    Sometimes, pages don’t belong in any navigation and they’re just linked from other pages.

    Three Seconds – That’s All The Time You Have

    It’s 2020, and people are even more impatient than ever. Website visitors use a total of only three seconds to decide what they’re going to do. If they have to think about what they’re clicking on, you run the risk of losing them and a sale.

    If you’re running a service-based business, and you allow online booking, call it just that. “Online Booking.” Maybe you can get away with “reservations,” although that term is usually used in the hospitality, restaurant, or travel industries.

    If you have a photo gallery on your page, call it a “Photo Gallery” or “Galleries” and stay away from “Client Successes.”

    When you think about it, it just makes sense, doesn’t it?

    If your navigation is not clear cut, then it’s not good navigation.

    Get Rid Of The Clutter – Focus Your Target

    Have you ever walked into the kitchen only to find a stack of dishes, food on the counter, a butter knife in the sink, an empty teacup, and a dog dish in the center of the room?

    My wife has!  I’m sorry, Kim, let me formally take this time to say I really am sorry. And while I promise I’ll do better, you more than likely will walk into a similar situation again in the future!

    The “where do I start?” question surely springs to her mind. The number of options on where to start can be overwhelming!

    Website navigation should never be that complicated whether built in WordPress or any other platform.  I attribute it to a fork in the road. It’s easy for a driver to choose between two options, but the confusion that sets in when you come up to an intersection with 4 options can be a little daunting.

    On a personal note, since I’m being personal in this post, I stay away from those intersections in Omaha. We have a handful of areas in town that you literally have four or five roads to choose from, and they’re an “All-Way Stop.

    Good luck getting drivers to figure out what direction to go!!

    Well, the same goes for your website visitors. If the top navigation has 5 options, and then each one has a dropdown menu with 5 or 7 items in them, you’ve more than confused your website visitor!

    Yes, we want to adhere to the “three clicks or less” website practice, but not everything belongs in the header navigation!

    The Footer Navigation Is Your Friend Too

    It’s the last thing a user sees on your page. It’s usually used by web designers to shove some general information like a billing address, a logo, maybe social media, and a handful of links that are the same as the top navigation.

    But what if you kept that sticky header?

    Do you actually need to repeat the same navigation in the footer?

    Could you maybe use this area to highlight other sections on your WordPress website?

    People have used this section to show their blog or a testimonial, but don’t forget about other key areas of your website.

    In your header navigation you may have a dropdown menu for “services”, and for those websites, the footer is a great area to draw attention to a specific service or service(s).

    What Do I Want You To Do Now?

    Just like navigation guides a user through a website, your blog articles or videos should also be guiding a user down a path that you want them to be on.

    In this case, I want you to share this article or comment on this article with what irks you about website navigation on different sites.

    Do the items that I’ve outlined in this article resonate with you?

    Were you a victim of any of the above items?

    What other items in navigation structures bother you?

    If you need a website review, they are one of the things that we specialize in! We’re more than happy to take a look at your design structure, and review just how users are using your website by reviewing Google Analytics.

    Contact Big Red SEO today, and we’ll help get your website, and your visitors, navigating around your website in an orderly manner, which results in conversions and sales.

    Share this post

    Check Out These Other Articles
    Drunk On SEO – The Comparison

    As much fun as it sounds, we’re not going to get drunk and perform SEO.  Have you ever tried operating a computer drunk? Or even buzzed? What a nightmare! We’re going to talk about Search Engine Optimization (SEO) and the various libations used in getting drunk! This is a quick comparison, or overview, on just how different people approach the process of SEO (and getting drunk). What is effective? What is efficient? What will get you in trouble? So grab a drink, and lets dive into the SEO Process!

    Read More »
    A Poor Web Design Will Hurt Your Omaha Business

    If a business wants to thrive, they need a strong online presence. And the core of any strong online presence is a website. However, as many Omaha businesses discover from their own experiences, not all websites are created equal. If a business has a poor web design, not only can it hold them back, but it can actively hurt them. Specifically, a low quality web design will make a business look unprofessional and cause it to miss out on many potential customers. Since web design problems have immediate consequences, this is an issue that businesses need to address as soon

    Read More »