Iterating the global navigation of a university website

Information Archiecture, Upgrades, Usability, Website.

I’m pleased to announce that we’ve released a new version of our global navigation for the University website. We will be rolling-out bespoke versions to Moodle, Library Services and the Intranets, shortly.

These changes make it easier for our two major types of user — loosely internal and global — to find information and complete tasks in a simple, predicable, efficient and consistent manner.

Key Features

New Header and Footer navigation

  1. Cross-domain navigation — (mostly) for internal users like staff and current students who need rapid access to different resources like Email, Moodle, and the Intranets, often within the same browsing session. Exposing these links will help channel users quickly to the applications and content they need.
  2. Global navigation — consistent clarity about the major sections in any domain, mega menu access to important and popular content.
  3. Utility navigation — exposes often searched for indices and resources in proximity to the search box.
  4. Footer navigation — simplified by reducing the number of links and unified by excluding links that aren’t globally relevant.
  5. Accessibility — we’ve endeavoured to make the mega menus keyboard controllable and used WAI-ARIA to improve the experience of modern screen reader users. If you have any suggestions for improving the accessibility of the navigation we would love to hear from you in the comments below.

What was wrong with the old navigation?

Old Header and Footer navigation

There were mission critical issues with our old header and footer navigation that included…

  • confusion — fundamentally different content types (indexes, sections/units, specific pages, duplicate links) jumbled in the same menu.
  • completeness — partial and/or divorced site sections; “About City” in the footer, major sections like “Alumni” missing from the header.
  • labeling — links like “Explore City” and “People” had a very poor information scent which deterred or confused new and infrequent users.
  • learnability — the “Explore City” menu was too unique. If noticed it required all new users to take a risk when foraging for information by learning what it did.

…which severely impaired the usability and accessibility of the structured navigation we provide for the ~6 million visits to city.ac.uk per annum.

What we did

We adopted a user-centred approach that included qualitative and quantitative methods to understand and triangulate issues with our navigation. We tested this solution with representative users during its development. Our methods included:

User Testing

Information Scent

I don’t know what would be in the “Explore City”. It could be everything and nothing.

— Prospective PG Law student.

Risk Aversion

Unless you know, or you click on [Explore City] to see what it does, you wouldn’t think that it’d open all [these links].

— Prospective UG Nursing student.

Duplication

Duplicated links increased the load on users and confused them. This occurred because of inappropriate audience-centred menus and the need to fill negative space when menus didn’t scale to their content.

International Student Advice is in two different locations so I’m kind of going back and forward between the two [identical links].

— Prospective PG Journalism student.

Traffic Analysis

Site Search Analytics

Site Search Analytics data set

We rigorously inspected our search engine logs — which record what users are looking for — to understand what’s important (the long neck or zipf distribution as a source of killer tasks), whether users are succeeding and what might be blocking them.

Click and Scroll Tracking

Click Tracking Results

We monitored behaviour for instances of 20,000 visits on some of our major templates and site sections. This indicated that “Explore City” wasn’t being used by external audiences in general and specifically from any of our 225 course pages where it constituted the primary structured bridge to content about applying and studying at City.

Competitor Review

London School of Economics Header

Higher education websites wrestle with similar information design issues for reasonably analogous user types. Consequently we sought inspiration from other institutions; specifically: The LSE, Boston and MSU.

Future iterations

We will continue to monitor and test the new navigation and make improvements where necessary. For instance – user testing was inconclusive about the usefulness of the utility navigation concept. We’ll monitor its performance in the wild and possibly remove it from production if it underperforms.

Tell us what you think

I hope that you find the changes useful. Do let me know what you think by commenting in this post or by emailing the Web Team directly. We can’t always reply directly but we do read and consider all feedback.

One Response to Iterating the global navigation of a university website

  1. Pingback: Unifying a University’s user experienceCity University London Web Team | City University London Web Team