Whilst it might not seem like the most exciting part of web design, website information architecture is essential to making your website navigable and easy for your visitors to use. Guiding users intuitively through the often large amounts of information available on a website needs careful thought, forward planning and attention to detail.
In this article, we will identify and discuss one method of ensuring clearly structured and easily accessible web content, broken down into six steps. It is assumed that you will already have a clear understanding of who your target audience is and their motivation, their needs and their expectations in visiting your website.
Step 1 – Collect and categorise metadata
Before you begin to structure your site content, you will need to put yourself in the position of your users. By understanding what information your visitors are likely to be looking for, which keywords they may use and how they will go about searching for this information, you will be able to structure and position your content appropriately. It is important to remember that your users might not always know exactly what they are looking for or the name of the item. Categorising content information using metadata (and using simple, universally-understood language) is therefore crucial.
How you choose to categorise and group your information is, of course, entirely dependent upon your business and website. If you are designing a clothing shop site, for example, your categories might include ‘menswear’, ‘womenswear’, ‘footwear’ and so on. If your site provides recipes, categories such as ‘course’, ‘main ingredient’ or ‘cooking time’ will be more relevant.
At the initial planning stage, it is advisable to brainstorm all possible categories and ways of searching – is ‘menswear’ and ‘womenswear’ more useful than ‘spring/summer’ and ‘autumn/winter’, for example? The answers will depend upon your users and their preferences.
Step 2 – Group your categories as primary, secondary or irrelevant to targeted users
Once you have your content categorised, you will need to determine which metadata categories are the most important to your users. Group your categories as either:
- Primary (important to all targeted users)
- Secondary (important to some targeted users) or
- Irrelevant (important to no targeted users)
For the purposes of this article, we will focus on the first two groups, although the latter might be important in terms of indexing functions and so on.
Step 3 – Present a single primary category on the first level
If your navigation design is to be effective and easy to use, you will need to select just one primary category to use on the first level of your menu bar or other type of navigation system. A primary category is one that is of central importance to all users of your website and should therefore be the first category presented to them.
In terms of a recipe site, the obvious choice would be ‘courses’ (because whilst categories such as ‘cooking time’ or ‘main ingredient’ might be important to some of your users, everybody tends to sort their meals into starter, main course and dessert).
Choosing just one primary category helps to keep your website navigation clean and simple for your users, so don’t be tempted to include more than one here. Including too many choices on the top level only serves to confuse your visitors and prompt them to find another, simpler website.
Sometimes your choice of first-level primary category will be obvious, but this is not always the case. If you are unsure, try out a couple of options and once you have drilled down further, any problems with usage will become apparent.
Step 4 – Present secondary categories all on the same level
Secondary categories might be options such as ‘skirts’, ‘trousers’, ‘shirts’ under the primary category of ‘womenswear’. In the simplest types of menus, these items can be shown together on the second level of navigation.
Where there are only a few items in a category, it might be necessary to group items together (into ‘accessories’, for example, rather than ‘belts’, ‘bags’ and ‘hats’), and it can also be helpful to include the number of items in each category in brackets after the category name. Don’t forget also to give users a choice to ‘see all items’ and therefore shortcut secondary navigation altogether.
It’s important not to go further than secondary categories. There is an oft-cited rule for web design that no information on a website should ever be more than three clicks away. Making things easy and quick for your users is paramount.
Step 5 – Present a page that lists all items that match the user’s selection
Your visitor should quickly arrive at the information they require. When testing, ensure that there are no duplications or omissions and that the user has relevant viewing options available to them.
Step 6 – Implement dynamic filters if appropriate
If your website is particular large, your users may need to narrow down the content further than primary and secondary metadata categories. This is where dynamic filters can be particularly helpful.
Often shown in a vertical side panel on product websites, to create a distinction from primary and secondary horizontal and dropdown menus, dynamic filters allow users to select and change multiple values, applying these changes directly to the existing content selection.
So when looking for a skirt, you might give users the option to select a price bracket, a particular brand, a hem length, a fabric, colour or season. By checking ‘winter’, ‘red’ and ‘under £20’, your visitor can find exactly what they are looking for very quickly. Where these categories are mutually exclusive or unavailable for particular items, they can be greyed out or unable to be selected. Although not all users will use these filters, they can prove invaluable to some visitors.
As with all elements of website design, paying attention to the needs of your user and not losing site of your overall site goals are crucial to success.
Once you have designed and created your navigation structure, be sure to carry out some usability testing and get feedback from your site visitors, as well as using your analytics data, so that you can tweak and adjust where necessary. By putting the above into practice, your website design should be fluid, intuitive and user-friendly, encouraging flow through your site and plenty of return visitors.