There’s a lot to think about when you create a new store. You can’t just throw something together in five minutes and call it a day — that’s a guaranteed recipe for disaster.
Navigation is one element of a store’s design that requires careful consideration, experimentation, and likely even future updates. You could create your navigation in five minutes based on what feels right… or you could use advice and insight to make smarter decisions.
Today, we’re going to explain how you can set up your store’s navigation to work well for shoppers. These tips should help you answer any questions you have so you can get every link placed properly (rather than quickly).
Let’s start by taking a closer look at why navigation options like menus matter so much in the first place.
Why it’s important to get eCommerce navigation right
Econsultancy estimates that up to 30% of your shoppers will go directly to the on-site search bar to find the products they are looking for. That leaves 70% (or more) of shoppers who will instead use your navigation to browse, shop, or hunt for products.
This gives us the first, and perhaps most obvious, reason to get your store’s navigation right: there are a lot of people depending on it. If it doesn’t serve the purpose it’s supposed to, they’re likely to get frustrated and leave.
Another reason to properly sort out the navigational elements of your store: the rest of your design often hinges on them. Whether or not you add additional links to your pages, make your search bar a certain size, or add other features might depend on what you do with your navigation.
Basically — get your navigation right, and everything else should work and flow together seamlessly. Get it wrong, and your store could feel disjointed or difficult to use.
Now that you know why it’s important to get this aspect of your design right, let’s go over some tips that will help you set things up properly.
Links to your products should be front and center
The very first thing you’ll want to add to your store’s navigation is easy access to your products.
If you only have a few products, this may mean adding direct links to those pages in your navigation menu, like the JOCO Cups shop does:
On the other hand, if you have multiple products divided into categories, like the ELEVEN velo store, you’ll want to link to those categories instead:
This brings up the same important point: your shoppers should be able to find and access your products from the moment they view your navigation. Whether that’s through a number of categories or direct links depends on the number of items in your store.
Place other important items in the main navigation — what they are will vary by store
Most online stores have two sets of navigation — one « main » area at the top of the site, as well as a second area at the bottom or in the footer. More important navigational items are typically placed in the main area, while less important links are added to the footer.
Having said that, what you consider an important link might be very different from what a store owner considers important. So when you’re deciding which products, pages, and destinations to link from your top menu, you’ll want to consider your own needs, not what other stores are doing.
For example, consider a store that sells shoes. It can be tough to get the fit of your footwear right without trying it on first, and the subtle variations by brand and shoe type can make returns a far more likely possibility for this type of product. So linking to your return policy page from the main menu would be a no-brainer here.
For a store that sells cookies, though? If you don’t personally like the cookies you receive, you can probably just give them to someone else. The cost is much lower, and cookies are a consumable good. So this store would be safe to add that returns link to their footer instead.
To decide if a link merits space in your main navigation, think about:
- Its frequency of use — Like the return policy example above, it might not make sense to place certain pages front and center if the majority of your customers will never click on them.
- Where customers will look for the information — Many shoppers are now trained to scroll to the bottom of online stores for information like FAQs, policies, shipping fees, and so on. Think about where you might go to look for something before you place it.
- The amount of space lost — This might seem like a strange one, but it’s definitely possible to run out of room in your navigation. Don’t try to cram everything into one small space.
The footer should contain less frequently accessed pages, like your policies and legal terms
Now that we’ve talked about what belongs in your main navigation, let’s move on to the second area of links, or the « footer » in WordPress terms.
Most store owners use the footer to store links to important but usually less frequently accessed pages, such as:
- Shipping fees and/or carriers available
- General company information
- Information not meant for typical consumers, ex. how to sign up for an affiliate program, press coverage
- Contact options including email address, phone number, and social media links (even though they may be displayed/linked elsewhere)
As you can see, the footer can come in really handy if you have some additional pages you’d like to add to your store, but don’t have room to link at the top of your website. But don’t think of this area as a simple « dumping ground » for your leftover links — it should look good, be laid out sensibly, and make sense in the same way your main menu does.
For example, have a look at how the Henry J Socks footer has subheadings that help to classify each area of links:
If you have a lot of footer links like this store does, you can use a similar approach to your store’s design, which will keep everything organized and easy to locate for your shoppers.
Have necessary but not « front-and-center » pages to link? Use sub-menus to consolidate and organize
As we mentioned, most sites have a menu at the top and a footer area at the bottom. Most of the pages and products you’ll want to link will fall neatly into one of those two areas… at first.
As you grow, however, you might find that you’re not able to decide just as quickly and easily where a new page should go. This goes double for those of you who might be adding lots of new products in the future, which will take you from « I can fit these in my menu! » to « wow, my menu’s really long. »
The first solution to this problem is to create category pages that you link instead. Another option is to take advantage of the sub-menu option in WordPress, which allows you to create multiple choice menus that slide out or drop down (depending on your theme) of a given top-level link.
So let’s say that instead of only linking to a shirts category, you now want to link to T-shirts, sweaters, and dress shirts. No problem — you can simply add the three new categories as sub-menu items of the shirts category already present in your navigation. When a shopper hovers over « shirts, » the three additional items will show up for them to click on, too.
You can read more about creating menus and sub-menus with WooCommerce right here in our docs.
Don’t have too many navigation sections! A header and footer is ideal
One final word of advice: don’t give your shoppers too many choices.
This might sound a bit odd. Normally, the opposite is true — it’s certainly fine to add new products, or make new color and size options available. But when it comes to your store’s design, simple is definitely the best way to go.
This absolutely applies to your navigation. If you try to add a third menu, another footer, or even too many sub-menus, your potential customers might become confused by all the choices in front of them.
Imagine a shopper coming to your store for the first time with the intent of browsing to simply see what you have available. If you give them too many options, they simply won’t know where to go first!
This can even cause problems for shoppers who are coming to look for something specific. If there are multiple menus or places to look for categories, products, or sources of information, they might not know where they can find it. This can lead to frustration and site abandonment.
The lesson here: keep it simple wherever possible. It’s doubtful you’ll need more than a header and footer; if your site gets large enough that your destinations won’t all fit there, direct visitors to topical landing or category pages and break it down from there.
Sorting out your navigation takes time, but it will make your customers’ journeys much smoother
Making a conscious effort to create your store’s navigational options with your customers in mind is definitely more time-consuming than simply doing what seems « right. » But there’s a huge reward: it makes your customers’ journeys smooth and simple, eliminating questions and allowing them to find what they’re looking for much faster.
We hope this post has helped you start to think about what your store’s navigation should look like, whether you’re starting a new one or in the process of a redesign. Have any questions for us? Let us know in the comments, we’ll be happy to help.