Left and right
I always have this problem, and I'm not even one of those folk who get left and right confused in everyday life.
Whenever I look at those funny screenshots on Imgur - or trawl through my own history when I'm trying to remember who I lent a book to - I have no idea which person is on the left and which is on the right unless there's a name or avatar attached to it.
I'm not even sure if there's a convention. Is it different between WhatsApp and Teams? Who knows?
I have to take extra seconds to figure it out every single time.
What's the solution?
Add avatars or names, or add column headings.
Up and down
They've been around forever, but sometime earlier this century, a certain popular microblogging site popularised the reverse-chronological timeline.
It's hell. I used to use bitlbee to read posts using an IRC client running in a screen session on a VPS, because programmer. It might seem like a lot of hassle, but it meant that I could read what people were saying from top to bottom.
You know what makes the reverse-chronological timeline worse? Threads1. They suddenly flip to "regular" chronological in the middle of your feed.
What is going on?
So at least things are the right way up in threads. Except, except in quoted posts...
My brain is full.
What's the solution?
Be consistent, and allow users to set a preference for reading order. And make the option clear, don't bury it in a settings page three menus deep; this is fundamental to how people understand your product.
Above and below
In my Internet middle-ages, I got chastised for top-posting on email threads a few times, and I remember thinking people were over-reacting. It was because my email client defaulted to top-posting and I didn't pay enough attention to it.
Top-posting is ok for quick replies to quick things. For threads, it's terrible. You have to scroll to the bottom of the thread and then keep scrolling back up a bit, reading down, then repeat. If the email client collapses replies, then it's even worse, and you have to click to open each section, making the entire document move around. Why people put up with this is beyond me.
How does this manifest in modern times?
Let me tell you about a development example. At work we use Jira as our ticketing system. I have comments set to be displayed in chronological order, because I'm a human.
Now, since Jira collapses comments this makes it difficult to find your place, but people expect things to be the way they're used to them. So a lot of comments say things like, "See my comment below", when for me, their comment is actually above.
What's the solution?
I wrote a Jira comment-uncollapsing Chrome extension to fix this anti-feature2. But tbh, it probably doesn't even work any more because they changed their UI a while back and someone's probably made a better one by now. I'm including it for completeness or full disclosure or something.
This time I think the issue is more down to us as users than the developers.
How could we fix this? Well, we have better words to use. "See my earlier comment" is less ambiguous, isn't it? It narrows things down to half the thread at least, without me having to work out whether the other user is a top- or bottom-poster3.
Parallel worlds
UI designers like tabs. Browsers are the most popular place to find them, they've been a feature for years... and yet there are still people who don't understand them.
I visited my mother a few years ago and used Chrome on her tablet. I thought it was weird that it didn't show a new tab when I tried to open one, and then I realised that I was wrong. The tabs existed, they were just not being shown as such. It was because so many sites she visited opened pages in a new tab and she had never noticed.
She didn't use the browser's "back" button because "it never works". Of course it never works if people keep spinning off new tabs!
I started closing them and after a few minutes I started counting. I manually closed over 400 tabs before the display started working properly, and that's not counting the ones I'd closed already.
What's the solution?
Don't open stuff in tabs unless there's a reason to do so. Your client telling you to isn't a good reason to add target="_blank" all over the place. Explain to them the principle of least astonishment. Explain to them that they can't carry a pint of logic in a collander.
Idolatry
Icons, emoji, meaning-through-colours, that sort of thing? It's difficult to understand. I see a bunch of icons and I have no idea what they mean. It gets worse when different devices display different icon sets. Remember when Apple changed their gun into a water pistol?
Does the flame icon mean something's good or something's about to be destroyed? Is it important that the tiny picture of a mammal is a beaver or a bear?
You see, what happens with icons generally goes something like this:
- Designer makes the 5 icons for 5 parts of your site.
- Designer gets a new job
- New site area gets built
- New designer tries to make something that fits in
Alternatively:
- Developer gets an icon pack and uses it for the main navigation
- New feature gets commissioned
- Developer can't find anything in the icon pack that matches the new functionality
- Developer chooses between switching packs and picking something neutral
- Site ends up with another star- or document- looking icon for something
Either way, I, as a user, have to rely on the alt text or title of the icon to figure out what it does. On a mobile device, I don't even get that affordance.
Last year, I got myself some varifocal glasses. They mean that in order to decipher the meaning of these arcane pictograms, I have to raise and lower my head all the time. Emoji are much more condensed than text, and a comfortable reading distance for text is much more relaxed than a comfortable interpreting distance for a picture.
You might say it tells a thousand words, but that's only useful if you can read those thousand words without zooming in all the time.
Otherwise, you're serving me mystery meat navigation.
What's the solution?
Don't rely on images to convey meaning. They might not even render on your users' devices, and if they do, they might not look like you expected. Use text. And while you're at it, respect people's choice of language.
Top comments (5)
Love this. I really struggle with icons being used without a text label. I have cumulative wasted hours trying to discern the difference between "attach file" (paper clip) and "add link" (chain links). They look 85% identical and are usually right beside each other.
Sorry but I love target_blank. Especially for links with extra info in articles.
Also, when using the back button your scroll position is often not remembered. (Maybe something to add to your list)
Your mom not knowing tabs exist is not a valid argument 🙂
Why not let the user choose if they want to open the link in a new tab or not? On a computer, they can mousewheel-click or right click and "Open in new tab". On a mobile device, they can long-tap to do the same thing.
Why would having "extra info" mean it was a good idea to open a new tab? Surely every link takes you to extra info? Otherwise there would be no need for links at all!
I think that people not understanding how to use your user interface is generally a problem, and a lot of people don't know how things like tabs work - things most of us take for granted.
As an aside, I'm not sure what you mean about the scroll position and the back button? If you use a new tab, then there is no back state except to close the tab, and by that point there might be many other tabs between you and the originating page. On the other hand, navigating using regular anchors does remember scroll position unless your page has done something to deliberately break than functionality (like implementing an infinite scroll, for example), in which case either method will need extra scripting to restore expected browser behaviour.
👴🗣️☁️