How to avoid poor navigation on websites and blogs
17th June 2014
One of my biggest pet peeves is websites that lead me on a wild goose chase, and that leave me horribly lost in a world of backwards and forwards links. I’m sure I’m not the only one who finds this irritating.
I was recently browsing BlogLovin’ to find new blogs, and I ended up on the website of a popular British blogger. I’m not here to name and shame, but they had almost 20,000 followers and the worst navigation on a website that I have ever seen. I was shocked to find that the site was filled with broken links and no access to the post archives. You’d expect better from a website that’s so popular.
I’ve compiled my top tips for improving the navigation on your website or blog that I hope you will find useful. I’m sure many of you are already familiar with these, but hopefully this will provide a helpful reminder.
Make your main navigation links clear and obvious
Your navigation links to your main pages (i.e. about, content, contact etc.) should be close to the top of the page so that the visitor doesn’t have to scroll to find them. They should also draw attention to themselves. Make them bold, larger than other text or give them a background. Keep the design tasteful but make the links obvious.
For example, my links are currently located just below the Empfire logo. They’re large, but not too large, and the background colours helps them to stand out a little more.
Check for broken links
I’m not going to lie, it’s a tedious task, but entirely worth it, especially for SEO purposes. To avoid broken links in the first place, check them as you implement them. Also, try not to alter the permalinks to posts and pages in WordPress as any links using the old permalinks will no longer work.
Your main concern should be making sure that the links in your main navigation function. It is an absolute priority that these work, so check them!
You can check for broken links on this website. It will highlight if there are any broken links and where they are located.
Don’t force the reader to click through a long series of links
The subheading doesn’t explain this well (sorry). I’ll show you an example of what I mean using a real life example from my old website:
Home > Visitors > Graphics > Icons > Musicians
That’s a lot of clicking to do just to get to the icons featuring musicians. Lots of clicking gets quite annoying after a while. Your visitors just want to get straight to the point without having to click their way through millions of links. Try to find ways to avoid this.
If you send them forwards, you’ve got to get them back!
Don’t leave your visitors stranded. If you do send them along a chain of links then make sure that they can get back to each previous stage again.
Let’s look at the example I used above once more. On the Musician page I would have a link that would return the visitor to the Icons page, and a link on the Icons page to send them back to the Graphics page, and so on. Make sure the visitors can also easily get back to the home page, either using a link within the header image or a separate link near the top of the page.
Access to a post archive is essential for blogs
Visitors may want to read posts that you have wrote in the past so make sure you provide easy access to your archive. This may be on a separate page with a link to it on the homepage (Clean Archives Reloaded is an excellent plugin for WordPress), or it might be located in the sidebar. If you are really organised you might want to use blog category or tag links in the sidebar to aid navigation further.
‘Jump to top’ link for long pages
If you have particularly long pages, for instance if you have more than one post per page, a link which allows the visitor to jump to the top of the page might be helpful for your visitors. Nobody likes lots of scrolling.
You can use the following code to create a ‘Jump to top’ link:
<a href="#">Jump to top</a>
I hope you find these tips useful!