Have you ever wished for a tap to call button on a mobile site? Or struggled to tap a tiny link? Have you ever wondered what would happen after you clicked a button on a site? Or, worse, wondered what to do next on a site?
If you answered yes to any of those questions, you’ve experienced a UX mistake. They’re more common than most people realize. Why? Perhaps it’s the curse of knowledge, ego or laziness. Whatever it is, it’s paramount that you learn to avoid (or fix) these mistakes.
Because a bad UX means fewer conversions. Undeniably. [Tweet It!]
What Is UX, Really?
If you’re reading this article, chances are you know that UX stands for user experience. According to Google Trends, interest in user experience has been steadily increasing for years…
Knowing you should be optimizing your user experience is one thing. It’s another to know how to optimize your user experience.
The first step is to understand the key principles of UX. Unfortunately, there’s some debate around what those principles are. Here are the five UX principles Jordan Julien of Hostile Sheep Digital Experience Lab swears by…
Leo Frishberg of Phase II, on the other hand, describes three principles of UX, as originally explained by a Roman engineer, who was alive during the 1st century BC…
While different experts use different words to define UX, most are saying the same thing…
- Conduct UX research to identify points of friction.
- Look for opportunities to reduce distractions.
- Look for opportunities to add clarity.
- Look for opportunities to improve relevancy.
- Look for opportunities to make the experience more intuitive.
What’s the Difference Between UX and UI?
Often, I see UX and UI (user interface) being used interchangeably. It’s a shame because they are two very different terms.
Here’s how Don Norman and Jakob Nielsen of Norman Nielsen Group describe the difference…
It’s important to distinguish the total user experience from the user interface (UI), even though the UI is obviously an extremely important part of the design. As an example, consider a website with movie reviews. Even if the UI for finding a film is perfect, the UX will be poor for a user who wants information about a small independent release if the underlying database only contains movies from the major studios.
So, UI is only a small part of the overall UX.
Mistake #1: Designing For Yourself
This mistake defies the principle of conducting research.
Too often, you design for yourself. Just as you have to write the copy your audience needs, you have to design a user experience your audience needs. Always design for the people who actually use your site. Chances are, they don’t want or need the same things you do.
Jerry Cao of UXPin explains the problem with this “genius mentality”…
Without usability testing and other forms of conversion research, you’re leaving money on the table. At best, you’re making educated guesses about your UX. Here’s how Adam Fairhead of Fairhead Creative puts it…
Start early, continue forever. No UX is perfect.
- Conduct quantitative research to identify problem areas. Where are users dropping off? What are they spending a lot of time on? What pages are they pressing “back” on?
- Conduct qualitative research to define the why. Why are users dropping off? Why are they getting hung up on the page? Why do they need the “back” button?
- Prioritize the issues you’ve identified based on impact and ease of fix. Does it need to be tested (e.g. improving search results) or just fixed right away (e.g. making a button more contrasting)?
- Create hypotheses for issues that need to be tested and begin testing.
Mistake #2: Clever at the Expense of Clear
This mistake defies the principle of clarity.
You want your site to be beautiful, to be innovative. Unfortunately, that’s not always what’s best for conversions. Why? Because many designers (and optimizers) sacrifice clarity for cleverness.
As Adam confirms, clarity should be prioritized above creativity…
The expectation-reality gap is real. Your users click on a button expecting one thing only to receive another. They expect your site to work one way, but it works in another. They expect an icon to do X, but it does Y.
Clarity closes that gap.
- Using the ResearchXL model, you’ll conduct heuristic analysis. Take an objective look at your site and decide what is unclear.
- When conducting user testing, ask users to perform the key tasks within your conversion funnel (e.g. login, find product X, add product X to cart). What path do they take? How different is it from the intended path? Why?
- Where are users hesitating? This indicates there may be clarity issues. There’s comfort in knowing exactly what will happen when an action is taken. If users aren’t sure, they will likely hestitate.
Mistake #3: Click and Scroll Jails
This mistake defies the principle of being intuitive.
Have you ever visited a site and found it nearly impossible to navigate or even leave? Ad over ad over ad. Ok, how about in the last 10 years?
It’s more common than you’d think. In an effort to get users to take their most wanted action, optimizers are bombarding them with calls to action.
Here’s a screenshot I just took from Neil Patel’s Quick Sprout…
That’s my entire screen. There’s nothing else in view. And I’m in the middle of an article.
Something similar happens when sites use auto or smooth scroll. Is it really making it easier for the user to navigate your site or does it just seem cool? Does it work as well in practice as it does in theory?
- If you’re looking to build your brand and a long-term relationship with leads (and you should be), don’t sacrifice experience to capture an email or implement something “cool”.
- A good UX means the user is well aware of the most wanted action without you overwhelming them.
- If you go too far in the opposite direction, you won’t be much better off. Make your most wanted action clear, make the ability to scroll obvious… just don’t throw user experience out the window to do so.
Mistake #4: Ignoring Prototypes
This mistake defies the principle of being intuitive.
It’s likely that you’ve become familiar with certain prototypes. For example, here are three random sites from Landingfolio…
The prototype is clear. Navigation at the top (featuring a call to action in a contrasting color), one to two (with one more muted than the other) calls to action above the fold, a headline and a subheadline (featuring a value proposition), etc.
While the designs are very different, all three sites follow a very specific prototype.
If they were eCommerce sites, you’d expect to see the Cart in the top, right-hand corner. If they were mobile apps, you’d expect four navigation options along the bottom of the screen.
Sometimes people want to break away from these prototypes. Adam explains why that isn’t necessarily a good idea…
Prototypes make the user experience simple. Things are where the user expects them to be based on past experiences with similar sites.
Why does that matter? Well, as Heydon Pickering of The Paciello Group explains, complexity is the ultimate enemy of UX…
If you find that you’re relying heavily on text to explain, it’s likely that you’re not capitalizing on an existing prototype.
Example: The Norman Door
The Norman Door is defined as “a door where the design tells you to do the opposite of what you’re actually supposed to do; a door gives the wrong signal and needs a sign to correct it.”
Whenever you embarrass yourself by slamming into a door you’re supposed to pull or yanking on a door you’re supposed to push, you’ve run into a Norman Door.
Vox recently took to YouTube to explain in more detail…
In the video, Don talks a bit about discoverability…
Discoverability has a lot to do with simplicity. Prototypes make discoverability easier. For example, do you think you should push or pull this door?
There are clues that tell your brain the door should be pushed. When those clues (or prototypes) are missing, you end up with a Norman Door.
Why Is Simplicity So Complex?
Luke Wroblewski of Google offers an explanation for why “keep it simple, stupid” can be such difficult advice…
- Don’s process looks something like this: observe people using it, prototype it, test it, repeat. You can do something similar with user testing.
- You can also look to other sites in your industry (or other sites that your users frequent) for existing prototypes.
- No one is saying you should copy your competitors blindly. But you should be aware of frameworks that exist within your users’ brains.
Mistake #5: Assuming the Rules Are the Same on Mobile
This mistake defies the principle of relevancy.
I shouldn’t have to tell you that mobile media consumption is on the rise…
You also don’t need another article to tell you that mobile traffic behaves differently than desktop traffic or that long forms are a bad idea or that tiny links / buttons are a conversion killer.
There are, however, a few things you should know about mobile…
- Cross device testing is a must. Make sure your site works properly and loads quickly on all devices. You might not have an Android, but I’m willing to bet one of your users does. Quality assurance is highly necessary.
- Test mobile and desktop separately. Your mobile UX and your desktop UX are completely different. Thus, they should be tested as such.
- The fewer taps, the better. As Luke points out, sometimes the best UI is no UI. The fewer taps you require from users, the better. Why take users through multiple screens (e.g. an onboarding flow) if you can condense it to one?
It’s also important to consider legibility on mobile. With a smaller device comes more readability issues. Bojan Janjanin of Yesterdayishere explains why thin font may be sabotaging your mobile UX…
In summary, your mobile UX is different than your desktop UX. Hell, your iPhone UX might be different than your Android UX. Don’t assume research and test results can be generalized across devices.
- Treat each device’s user experience separately. That means separate research, separate analysis, separate issues, separate prioritization, separate tests, etc.
- Focus on optimizing the UX for the specific device. Your goal is to deliver the most relevant experience for each device. That means the call to action might change, the checkout flow might change, etc.
- Quality assurance is key. Test your UX on all devices. Where’s the friction? Does the page load slowly? Does anything load improperly? Are images missing? Are images too big? Are links easy to click? Is the call to action relevant? For best results, don’t just test the most recent operating systems… not everyone is quick to upgrade.
Mistake #6: Forgetting About Performance
This mistake defies the principle of conducting research.
When you think of UX, I’m willing to bet one of the last things you think of is the performance of your site. That’s unfortunate because, as Brad Frost of Brad Frost Web explains, it can have a big impact…
Speed, specifically, can heavily impact conversions. We’ve written on that extensively before, so for more information, check out 11 Low-Hanging Fruits for Increasing Website Speed (and Conversions).
Another site performance measure to consider is errors. If users are receiving errors, something is broken on your end. Either the site itself (e.g. server issues) or the UX (e.g. people are ending up where they shouldn’t).
You have to fix even what you can’t see because in UX, what you can’t see is certainly felt.
- Check your analytics tool to identify the errors that your users are triggering. Start with the errors that are triggered most often. Why are they being triggered? What can you change to ensure they’re being triggered less? User testing and qualitative conversion research can answer these questions for you.
- Now check your analytics tool to identify pages with slow load times. Start with the pages furthest down the funnel. Why are they loading slowly? Are your images or videos too large? Are third-party apps slowing down your site overall?
While this increased interest in UX is positive overall, it means that mistakes are even more likely to occur. An understanding of the core principles of UX will help guide your analysis and optimization efforts.
But here are some specific guidelines to follow…
- Design for your actual users, not yourself or ideal users.
- Don’t sacrifice clarity in the name of being clever or creative.
- Don’t bombard users with calls to action or implement a “cool new thing” without testing its usability.
- Embrace existing industry prototypes and use them to your advantage. Simplicity is king.
- Mobile is a different beast. Your mobile UX is different than your desktop UX. Your iPhone UX might even be different from your Android UX. Act accordingly.
- Don’t ignore site speed or error reports. If your site is slow or your users are encountering a lot of errors, it’s your responsibility to be aware and fix the problem(s) quickly.