Usability is where you structure your layout and offer various features which ensure that a visitor can navigate and use your website efficiently and effectively. Quite simply, usability is ensuring that your site is easy to use!

Naturally, a confused visitor is never a good recipe for success, which is why usability is so important to a website. The following will list and briefly discuss some of the things you should look out for, and why they are important. The pointers below are in no particular order (i.e. they aren’t in order of most important to least important).

Have Clear Sections

Whilst website designs vary wildly, which is a brilliant aspect of the internet, the overall structure of the average website is relatively common – a header image/section, a navigation bar, possibly a secondary navigation bar, and a content area are all very constant elements across nearly all websites.

Therefore, make sure that it is clear to your users where each section is – don’t have one section looking very similar to another. Use colour, borders and/or spacing to ensure that each section is defined and distinguishable. You wouldn’t, for example, want your navigation bar and your content area to look very similar as this may confuse your visitors.

When a visitor comes to your website, it has been proven that they make up their minds about your website in a maximum of 10 seconds. So having clearly defined sections and making it easy for the visitor to know where your navigation bar is, where your content is, where your header is (etc) is essential.

Have Consistent Navigation

Always keep your main navigation bar consistent (Web Dev Dawn’s main nav bar is the orange one located directly below the header image – with the main “Home”, “Forums” etc links on it). By consistent, this means making sure that it is in the same position on all your pages, that the links on it don’t change depending on the page you are on, and that it has the same look/style on all pages.

This is imperative since the main navigation bar contains links to the most important pages of your website, and so if these change as a user browses your website, it may confuse them. Especially since visitors will start to learn and remember your site’s navigation structure as they browse.

Of course, if you go from the website onto (say) the website’s forums or image galleries (i.e. not directly part of the main website), the navigation bar and the links it contains may be different to your main website’s navigation bar’s links. This is fine since they are substantially different aspects of your website. The “have consistent navigation” tip mainly refers to the navigation bar on the main part of your website.

Have Clear Links

Make sure that it’s easy to distinguish between the links and text on your website. Do this by having a suitably different colour for your links compared to your text. For example, if your text is black, don’t choose a very dark link colour. Also consider having your links underlined, which then instantly lets the user know that they are links and not just different coloured text, for example.

Usability is by-and-large about making things easy for the user. And helping them know exactly which are links will greatly help your users with navigating your website.

Have A Search Feature

Having a search feature, and one that is easy to find and use, is essential. The average web user likes to have easy access to information, and not have to hunt around to find the information they are seeking.

That’s why a search feature is so useful – a user can search specifically for what they are looking for, and have the results given to them with ease. No hunting about, just a bit of quick typing!

If you don’t feel confident creating a search feature yourself (or simply don’t power your website via databases/dynamic methods), you are able to add a search feature to your site powered by Google via Google custom search or via the Google search engine box you can add to your site via the Google AdSense service.

Have Useful Error Pages

The most common types of errors are 404 (file not found) and 403 (unauthorized requested location) errors. So, for example, if a user was to follow an incorrect link to your website, a 404 error page would be shown.

Some good design/content choices for your 403/404 error pages are thus:

The average user won’t know what a 403 or 404 error message is. So don’t call the page a “403/404 error page” – just put the heading as “An error has occurred” or simply “Error”.
Be sure to explain what has gone wrong – i.e. “The website page you requested could not be found. This perhaps was due to you following an incorrectly typed link.” to help the user understand what happened which resulted in an error page being shown.
Help the user get back to where they want – have links to your sitemap and most popular pages on the error page. Make sure the search feature (if you have one) is also visible on the error page.
Have the error page look similar (i.e. have similar colours) if not the same as your current website’s look. A user definitely would be put off if they click on a link on your nice looking website only to be taken to a page with a bland white background with large black writing.

Use Text, Not Images, Where Possible

Whilst images look good and are very useful in breaking up the content on a page, be wary of putting important information in the images themselves. This is because your website will probably be visited by at least a few disabled users, some of whom may be using screen readers to surf your website (which work by reading out the text on a page; but these obviously can’t read text/important information if they are in the images).

It is advisable to put alt tags on your images (short descriptions which describe the images, which screen readers are able to read out), however it’s still a wise idea to put any important information as text itself.

Additionally, images can take a while to load – remember that some users are still using slow modems to connect to the internet, and so you wouldn’t want users to miss out on any important information because an image is taking a while to load.

Have A Sitemap

A sitemap is a list of the pages on your website. If you have many pages, it can instead be a list of just the main areas of your website.

As with a search feature, a sitemap enables a user to more easily find the information they are looking for. Also make sure the sitemap link is visible, preferably on all pages. You can view our sitemap at the top and bottom of all our website pages.

With your sitemap, be sure to present the information in a list (i.e. in bullet point form). Also use nested lists (see our sitemap above, where the articles themselves are listed, as an example of this) for ‘sub-pages’. For example, if your website’s main structure was:

Homepage, About Us, Contact Us, Events

And then the events page linked to five different events (each having separate pages), your basic sitemap structure should look something like this:

• Homepage
• About Us
• Contact Us
• Events
  • Event One
  • Event Two
  • Event Three
  • Event Four
  • Event Five

To Conclude

In conclusion, usability is basically about making navigating and using your website as easy as possible for your visitors. Even simple measures like having a clear site layout, search features and a sitemap can greatly help your usability.