On The Hill: Radar Hill Blog

Developing a website involves juggling a wide range of design elements, trying to build something that not only reflects what a business offers and embodies, but also provides a satisfactory customer experience. 

Here we take a deep dive into the idea of interaction cost, how it impacts something as fundamental as menu navigation, and the potential design solutions. 

What Is Interaction Cost?

Think back to the last time you visited a website — were you able to get to the page you wanted to visit with one click? Or was it a more elaborate journey, going through multiple windows, loading times, reading different pages to find the information you were looking for? 

Well, that process is what we describe as interaction cost. It’s the amount of cognitive effort, and just as importantly time, people spend navigating a website to reach their goal.

There are a variety of actions that contribute to a user’s interaction cost including:

• Scrolling pages 

• Reading content 

• Scanning a page to find the relevant details 

• Making sense of the information in front of you 

• Clicking on links 

• Typing, i.e filling out forms 

• Waiting for pages to load

If you want to get some idea of what we’re talking about, just imagine how much time you spend doing all of these things on every website you visit.

In an ideal world, you want the one-click scenario, but even if that’s impossible you still should be looking to reduce your interaction cost wherever possible. 

Why It’s Important To Reduce Your Interaction Cost 

In order to understand why reducing your interaction cost is important, we need to break down the different kinds of interaction costs and understand exactly what that means for visitors to your website. 

Firstly, we have cognitive interaction costs. This is the amount of thinking and analyzing customers have to do to find what they need. 

As you can imagine, this is incredibly important. 

Whether they’ve arrived looking for a specific product or just to browse or research, no customer wants to have to work hard to find what they’re looking for. This can be a huge factor when it comes to customers leaving your site without getting closer to making a purchase. 

Secondly, we have visual interaction cost. This is something we’ve no doubt all experienced: when visiting a website that is overloaded with bright colours, flashing buttons, and a host of visual clutter, it’s too much, and it can make it harder for users to find what they’re looking for. Especially for neuro-divergent people or those with disabilities. 

Overload isn’t just the only example of visual interaction cost though, it’s also having too small fonts, unclear imagery, or sub menus that are difficult to locate. 

The goal in minimizing visual interaction is to guide your customer gently to where they need to go. It’s a common mistake companies make in going for something that looks bright and exciting, but because of the high visual interaction cost, is actually counterproductive. 

Finally, there is the physical interaction cost. This is how much mouse movement, typing, and back and forth window navigation your customers have to do. 

And once again, this is vital to minimize, because customers will be put off by having to say, click through too many different windows to get where they need to go, or with having to fill out too many search forms, labouriously. 

As you can see, interaction costs build up and accumulate, and this can lead to very high bounce rates (people going on a web page but leaving without doing anything on it) and customers leaving your site or choosing a different company. 

As these numbers from a recent study illustrate:

• 88% of online consumers are less likely to return to a site if they’ve had a negative experience 

• 47% of users expect a load time of below 2 seconds 

• 75% of consumers admit to making judgments on a company based on their website design 

• 94% of consumers first impressions are design-related 

How To Organise Your Website Menu 

Now, let’s take this information and apply it to something specific that every website needs: a menu of pages. 

There are a lot of different aspects of a website that contribute to usability — which is why building one is best left to the professionals! But for now, let’s focus on menu navigation. 

Now, you’ve probably browsed a lot of websites, and you might think this is a pretty standard and simple task. 

But, when designing websites you’re always going to encounter edge cases that don’t fit easily into the menu categories, and as we’ve alluded to before — if you have a menu with too many pages, or a confusingly vague selection, you’re unnecessarily adding to your customers' interaction cost. 

The solution comes down to a few things where it’s all about guiding the customer in an intuitive way, and also understanding what you’re customers are looking for. This second point helps you develop a hierarchy. 

The most common approach is to add subcategories for all of the outlier cases to the navigation menu, meaning that people looking for specific items could filter down from larger categories.

However, this runs into a couple of problems when done on a large scale. 

Firstly the creation of too vague parent categories that have what is known as a “low information scent”. This means they don’t have strong associations with the information the customer is looking for, increasing the cognitive interaction cost. The second problem is that it requires a lot of scrolling and menu navigation, with a high physical interaction cost. 

This is why, any subcategories in the navigation menu should be things that are strongly associated with the parent category, and that a high number of your visitors will be searching for. This will also leave a number of outliers still remaining, which is where we come to the second solution. 

Another approach is to leave the outliers within a larger category that they are most closely associated with and use metadata and design elements to make them easier to find through other seeking behaviours. This covers a range of design elements, such as search options, filters, and more. 

The advantage of this is that customers will often make intuitive associations that will lead them to the right category, and then look for things within that category. This design choice reflects that, while also keeping the physical and visual interaction cost low.  

If you want a website that’s easy for your customers to use, one that will be designed with their experience in mind, and most importantly — ensure they are able to purchase the products and services they’re looking for! You need Radar Hill. Contact us today to find out more about how we can help you. 

For more web design info or tips, see our small business mini guide.