Using Google Analytics and other tools to visualise how our global navigation gets used

One of the big challenges of a responsive design, especially for a large site like ours, is how to tackle navigation.

When you're designing for large screens there's a lot of horizontal space available, so you can include quite a lot of links without feeling that you're overcrowding the page.

Our header navigation is fairly typical of other university websites, with links to all the major areas of our site and links for our main audiences.

Our header contains 15 links and a search box

Counting the links, there are 15 in total, plus a search box. Here's the full list:

1. Homepage (via logo)
2. Study
3. Research
4. Business
5. Departments
6. International
7. About 
8. News
9. Events
10. Contact
11. Jobs
12. Visitors
13. Alumni
14. Current students
15. Staff

So, how do we fit all of these links in to a design that's going to work on small screens? Actually, let's take a step back and look at a different question: do we need all of these links in the first place?

Looking at the numbers

Taking inspiration from the GDS post on 7 ways we’ve used Google Analytics ‘outside the box’, I wanted to get an idea of how our users are moving between the main parts of our website, and whether they were using the global navigation links that we provide in our headers.

Google Analytics isn't great at answering this type of question directly, so first of all I exported a load of data using Supermetrics Data Grabber for Excel, looking at what the sources of traffic were to all of the pages that are available in our global navigation. 

Configuring a report in Supermetrics Data Grabber

I grabbed the data for the whole of last year so that any seasonal variations were taken into account. Supermetrics Data Grabber can handily download unsampled data, which is another problem that Google Analytics has when you try to look at big picture problems over a long time period.

Some of the raw data - not pretty (yet)

I then started to clean up the data, replacing the path names with plain English labels and adding values to show what level in the hierarchy we were looking at.

This is already quite useful, and allows me to quickly answer questions that would be time consuming in Analytics.

For example, if I wanted to see how many pageviews the staff homepage gets that come from either the Study or Research branches, I just need to tick a few boxes and Excel's filters take care of the rest. (If you're interested, the answer is 4,450).

Excel's filters are a quick way of segmenting traffic

Pivoting

We can then go a step further and put this data into a pivot table.

The table below shows branches of our site along the top, and the pages that are available from our global navigation down the side, so we can see how much traffic is going from one area of the site to another.

Expressing these numbers as percentages and applying some conditional formatting lets us see some patterns. Right away we can see how the homepage is acting as a major jumping-off point to the other areas of the site (which shouldn't come as a surprise).

Patterns begin to emerge

We can also see which parts of the site have strong linkages between them, and where the links are weaker.

What next?

We're still making sense of this data, and are looking at other sources such as CrazyEgg and search logs, but we're getting the strong feeling that we don't need to provide as many global navigation options as we do currently, and certainly not as prominently. The homepage is the exception to this as it's a starting point for a diverse range of users, but most of the time it's more important to present users with links related to the content that they're looking it rather than links to completely different areas of the site.