How to Simplify Your Design Navigation

By Jessica Ann
July 9, 2014

We’ve all dealt with a website that has a million menus and submenus with no clear sense of organization. It’s the last thing you want to do to your own site’s visitors, so it’s important to know how to simplify your design navigation. Usability is so important for web design, and it starts with making it easy to navigate a website.


Have a Plan

A very popular YouTube video about the game World of Warcraft went viral because while it begins with a very calculated, carefully laid-out battle plan, it ended with one of the players simply rushing into the battle blindly, getting everyone killed. The offending player also died, and everyone on his team was very angry with him.

The lesson is clear: if you don’t have a plan, you’re not going to get very far. And your failure is going to make your team, which can include both colleagues and customers, very angry with you. So if you’re building a big website using a website builder, WordPress or some other content management system, plan it out first.

While it may sound strange, the best place to start planning your design navigation is a blank piece of paper. Even if you haven’t selected a website design yet, you can probably predict what types of content you’ll want.

The sweet spot you have to find requires offering visitors easy access to what they’re looking for without cluttering the page and taking attention away from the content itself.

Keep Priorities in Mind

Place the most important pages in a primary, usually horizontal menu at the top of the page. This may include your blog, an about page, and a contact information page at minimum. The fewer the better when it comes to this “main menu.” If you offer a product or a service, a pricing item should also appear in the primary menu.

Use drop-down or menus to include related items with each primary item.  A drop-down menu appears when someone hovers the mouse cursor over the primary item. For example, the “about” menu item may reveal a vertical list of links to related pages like company history, employee biographies and mission statement.

Don’t Fool Your Visitors

Some sites make the primary items impossible to click, forcing visitors to find out the hard way that they need to click a sub-item. Don’t make this mistake: simplify your design navigation by allowing visitors to click on all levels of a menu item.

In the above example, clicking “About” should bring up a main page about your company. Sub-items may be placed in a sidebar menu, conceptually connected to the main menu with similar styling, such as color and typography.

In fact, styling can also be used to make it obvious at all levels of your site where exactly a visitor is at any moment. If someone is reading the Company History section of your About menu, those two items should be highlighted somehow, whether with bolded text or with distinct coloring. Think of this styling like a web page version of the “You are here” dot on a shopping mall map.

There are certainly more complex menu systems for those who need them, but those can also be done simply with these basic principles. The key to figuring out how to simplify your design navigation is to put yourself in the position of your visitors. Think about what they want to see and do, and what you want them to see and do, and you’ll be on your way to a simple and effective design navigation.


This entry was posted on Wednesday, July 9th, 2014 at 2:22 pm and is filed under Web Design. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

Leave a Reply