The last session of the day was Gerry McGovern, who is always a treat to listen to. In this session he was specifically targeting the navigational aspects of websites from both an information architecture and content strategy lens.
Our final speaker: @gerrymcgovern on designing an intuitive navigation.
His opening slide has Santa Clause on it. #AEADC
— anne gibson (@kirabug) August 1, 2018
When he was young he wanted an airport for Christmas. He wanted a real airport. Recently, he was on London Gatwick’s homepage and it says “Your London Airport”. Finally! But now all he wanted to do was get wifi. #AEADC
— anne gibson (@kirabug) August 1, 2018
“Get Online Now” never means “now”, it means “you know, at some point.” Get online now, then get online now on another page, get online now, and then sign up, then try to log in, then just get online, then you’re online.
That’s the cost of free online access#AEADC— anne gibson (@kirabug) August 1, 2018
Gerry refers to some of the stock photos as “Department of useless images”. What are these images doing?
“How can we make things easier for you?” If you ever have to say that, you’re not making it easier. If you tell me it’s simple, it’s not. #AEADC
— anne gibson (@kirabug) August 1, 2018
Dublin Airport – “Free wifi” button, you click and you’re online. That’s all you want. Nobody’s buying the newsletter or discounted products. #AEADC
— anne gibson (@kirabug) August 1, 2018
A link is a promise, a commitment to deliver. You don’t want to break your promises. A core rule of navigation design is fidelity. You promise to take someone somewhere and then you do it. #AEADC
— anne gibson (@kirabug) August 1, 2018
If navigation was road signs, we’d be convincing people with six extra signs to make other decisions. “Do you really want to go to Ottawa?”
The biggest point of failure is confusing navigation and links. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Digital is do-land. People know what we want, at least we think we do. “My doctor says do two google searches a day” is not what people wake up and think. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The vast reason why people are on a page is because they want to be on the page. Help them create momentum, and help them continue that momentum. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Navigation should immediately tell you where you are. It should immediately say yes, you got to the right section. eBay shows you where you are and where you’re going, creating momentum. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Unity is a principle of navigation design. You don’t want the navigation spread all over the page. The more it can be consistently in the same place the better it is for people to know where to look and what to do. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The core principle of navigation is to move users forward. Not back, or try to change their mind. #AEADC @gerrymcgovern pic.twitter.com/KdlrrjFYZU
— Erin Fike (@erin_fike) August 1, 2018
One of the biggest problems in digital is people add but they never remove. – @gerrymcgovern #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
First you have navigation on the left, then the most popular (so the other stuff isn’t popular?) then do it online (well duh, I’m online) and then “my neighborhood” which isn’t your neighborhood….
The more navigation you add, the more you confuse#AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Icons (by themselves) are a horrible way to present navigation. “Search for a beardy man” means “personalize” apparently. At a minimum you have to add word labels to icons, otherwise you’ll have serious problem. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Usage in Outlook grew when Microsoft put the words back on the icons.
If you use icons you must have words associated with them. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Labeled icons have an 88% success rate. Unlabeled icons are 60%. Unusual unlabeled icons are 34% useful. Icons are very poor navigation by themselves. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
What about the hamburger menu? One of the worst forms of navigation we’ve invented. Apple has dropped it because it sucked.
The whole purpose of navigation is to help you see stuff and make a decision. Forcing users to click first is bad. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
So @lukew did a study on this and showed that getting rid of hamburgers and exposing decisions drives engagement downward. Never hide your navigation. It’s like hiding road signs behind a curtain. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
There’s always an exception. The hamburger approach works on a super task when there’s a hugely dominant task you immediately want to do — like Google Maps. Searching the map is 100x more important than all the others. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The core purpose of a Norwegian hospital’s website is treatment so everything except that task is stripped away everything else — but it needs to be based on your data about what users are actually doing #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
2 mental models in how we approach problems: object and subject way.
If I have a battery problem with my phone…
40% of people will start with iPhone then troubleshooting.
40% of people will start with Support then iPhone.
20% are weird and go all over the place#AEADC— Anne Gibson (@perpendicularme) August 1, 2018
Design for both twins – the support journey and the product journey, so that 80% of your users are successful. Don’t design for one or the other because then 60% of your users will be *unsuccessful*#AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
“Browse” and “Find” on a site then “Resources” and “Online Services” and “Don’t Miss” – which is in the right-hand column where nobody looks.
Replaced all of it with “Countries” and “Topics” as the dominant navigational topics #AEADC— Anne Gibson (@perpendicularme) August 1, 2018
If you want to sell the maximum number of guitars, strip away everything that doesn’t take someone to buying the guitar. Move all the other navigation back. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
https://t.co/XljLZs4Tw9 – when you click on Benefits, now the entire page is all about “care to learn” so you can totally focus on this benefit. If you do that, there’s a much higher chance that someone will understand what they’re doing. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The core problem with a lot of navigation is the tiny task. Everyone wants to go to Ottawa, but you let stittsville on, and then you have to add a dozen other cities. That’s not good navigation.
“Ottawa”, “Capital cities of Canada” and “Frequently visited cities” is worse#AEADC— Anne Gibson (@perpendicularme) August 1, 2018
Why do we have Frequently Asked Questions? How does a customer know if their question is frequently asked or not? FAQs is a classical internal logic of navigation. Most FAQs aren’t even frequently asked, they’re marketing mumbo-jumbo#AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
If you have Quick Links, you must have Slow Links right? Tools, FAQs and Stuff and Content and the Hamburger Menu. Definite car crash if we did roads this way #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
If someone’s looking at your navigation a lot that’s a bad thing. They’re there to look at something that matters, like the cliffs, not the sign for the cliffs. Quick glance, click. Faster, in the right direction, is better. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
We read really quickly on the web. When you’ve gotten off a plane to catch a train, there are 3 things you’re looking for:
Trains
Tickets
Toiletsthis is good navigation design, and it’s how we read on the web too#AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Magnetism – a link has an attractiveness to click on it. Clean magnetism, it says “Ottawa” and goes there. Dirty magnetism takes you to Vancouver — it’s marketing, or it’s vague. “Knowledge Base” – what’s the rest of the website, idiot hub?#AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
A great link tells you what it is, but equally tells you what it’s not. Nouns are better forms of link construction than vague statements. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The best design today is to design with customers, not for customers. The European Commission had 35 options they asked users to do a card sort to figure out navigation. At about 15 people you get consistent groups. (1500 people are the same patterns as 15.) #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Once 15 people sort the topics into groups. People are really good at grouping but really hard at naming groups. Never force people to name the groups in the card sort. They hate naming and will quit the study #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
A similarity matrix – 87% of people put “climate change” with “environmental protection” were in the same groups. “Find a job” and “working” are together. Etc. The web gives us the tools to gather this data. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
You might have orphans that don’t group with anything else. If it’s a tiny task, then it’s tough to find. But if it’s a top task, it needs to be at the top level of the structure because it doesn’t fit anywhere else logically. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
You never go straight from the sort to a finished classification, you just have a good hypothesis. Then you come up with a bunch of instructions connected with the top tasks. Group everything based on the hypothesis. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Generally speaking, A to Z is not a good navigational structure. If you have very important things, it’s better to put them at the top of the navigation structure. You can use this data based on how people voted. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
To test the hypothesis, build a task set for users to do and ask them “which menu would you click on to solve this task?” You need 15-35 instructions for this, because you need to be able to test the hypothesis from multiple different angles. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
The hypothesis is that users will click on Funding, for example. Success is that a minimum of 80% of the time the user clicks on the right area. If >80% they click on funding that’s extremely high performance. Success is “they go the right direction” #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
You only need 15 people to do the tree testing. In the example, the hypothesis didn’t work well, because it turned out to be a twins scenario. For this important task you need to design two journeys for it. “You’re going to have a 50% success rate” #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
You need to do a minimum of 3 rounds of tree testing, both to weed out oddities and confirm your findings and adjustments #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
People love to choose words that are much bigger than their actual scope. Calling something “Jobs” when you mean “Jobs at this government offfice” can be confusing for people looking for jobs in the country #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
“Find a job at the European Union” tested really well. “Find a job in another EU country” showed the flaw in the navigation element named “Jobs”. So you need lots of test questions. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Your “junk drawer” classification might need to be broken up so that it doesn’t create more confusion. Look for failures that drive breaking things up. (But don’t break them up too much or you’ll have too many elements.) #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
A test with Toyota in both Norway and the UK – people think broadly the same. Everyone buys cars the same way everywhere (they tell you they do it differently). #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Sometimes it’s a linguistic problem. Like Norwegian uses the word kupé for both “space” and “an area” (I might have caught that wrong) so people were looking for air conditioning in the “how much space do you have” area. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Don’t just test links for tasks that do work, also test for links that should fail. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
If your labels are bad in English and then you translate them to Norwegian, they’ll be even worse if there are linguistic issues in Norwegian with your translation #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Anything over 80% is a very good score in navigation design. @gerrymcgovern has never seen 100%, because there’s always 10% of people are weird. #AEADC
— Anne Gibson (@perpendicularme) August 1, 2018
Navigation design principles:
1. Momentum
2. Unity
3. Twins
4. Minimalism
5. Clarity
6. Fidelity
7. Magnetism#AEADC— Anne Gibson (@perpendicularme) August 1, 2018