4 Mobile UX Mistakes That Are Killing Your Conversions

mobile-ux-mistakes

We get it. You’ve been told that if you don’t add the latest, greatest marketing tool to your website, you’re losing conversions. You calculate those numbers into dollar signs, and panic ensues. Now your website is full of forms, pop-ups, chat widgets, and more — it’s a veritable conversion playground! But the months go by, and your revenue looks much the same. How is this possible? The truth is that many conversion tactics, while initially appearing effective, end up annoying users and driving them away.

People, preferring pleasure to pain, will gravitate towards websites that provide excellent user experiences in the long run. This is even more true for mobile devices, which connect us constantly to the digital world. But which tactics are driving users away? And does prioritizing UX mean getting rid of all of them?

4 Common Mobile UX Mistakes

1. Pop-Ups

Pop-ups are the internet’s favorite interruption-marketing technique. You can’t avoid them. We’re constantly being asked to sign up for newsletters, to save 20%, or to receive some once-in-a-lifetime offer. You’ve probably even noticed different ways these pop-ups are presented, such as:

  • When you first land on a web page
  • After a slight delay in landing on a web page
  • When you start to scroll
  • When you exhibit exit intent (those “Wait! Come back!” pop-ups)

Each option has pros and cons, but at the end of the day, they exist to interrupt your web session or your attempt to leave that session. Companies know you don’t like them, so why do they do it anyway? Because data shows they can produce a higher conversion rate than a website without them — Er, well… sort of.

Many marketers have been sold on this data, but a deeper dive into the numbers revealed that while more people were signing up for emails through pop-ups, the open rate and engagement percentage were actually lower for users who signed up through a pop-up than for those who signed up voluntarily.

While no one truly loves pop-ups, users can perhaps tolerate them on desktop devices since they only occupy a small portion of the screen. On mobile, however, they take over completely and keep you from doing what you came to the site to do. Search engines will also punish you for pop-ups that block content — as they should.

If you’re still determined to keep using pop-ups, consider a mobile treatment that causes users minimal interference or perhaps remove them from mobile altogether. Removing pop-ups also forces you to think about how users interact with the content of the website itself rather than a gimmicky interruption. While it’s tempting to rely on the form-fills gained through pop-ups, there may be more creative solutions within the website itself to increase conversion rates and grow your mailing lists.

A Case When a Pop-Up Is Good UX: Critical Actions

Any time the user is about to perform a destructive action or one with major consequences, presenting a message box in the form of a pop-up to confirm their action is not only acceptable UX — it’s preferred. It gives the user a chance to back out of a consequential decision they may not wish to make.

2. Poorly Placed Ads and Sticky Banners

Like pop-ups, the visual interference of ads and other banners is magnified on mobile. If you have ads or banners that display at the top of your screen, for instance, they could potentially block the user from accessing the navigation menu — in fact, they might not even know there is a navigation menu behind the ad. Make sure that any ads or banners you display are not preventing the user from accessing content on your website or performing the actions they came there to do in the first place.

In the examples provided, the first image shows a sticky bar that covers the top navigation. While the information presented in the banner might be important, a new visitor to the website has no idea what’s underneath. They have no knowledge of how to navigate the site, and because of banner blindness, they may simply exit the site out of frustration. The second image shows an alternative way of serving sticky banners that pushes the mobile header content down when it appears. This way, both the banner and the navigation content may be seen and accessed simultaneously.

sticky-bar-nosticky-bar-yes

3. Complex Graphics With Text

Your desktop website may have sections with beautiful text overlaying an image, or a so-called hero header. This can be a striking visual element, but you must be careful that the text is still readable on mobile. In some cases, this may involve serving an entirely different visual for mobile than you do in your desktop version.

In the example below, the hero section of the desktop works well, but translating it directly to mobile causes the text and graphic to overlap into an unreadable mess. The second mobile image shows one way to solve this problem by serving slightly different stylings.

The same goes for video content behind text. In a larger space, the human eye may be able to process the text and video without issue, but on a mobile screen, it’s too much happening in a small area. A simple solution for this is to exchange the video background for a still image on mobile.

hero-desktop-yes

hero-mobile-nomobile-hero-yes

4. Chat Widgets, Toolbars, and More

Especially in light of COVID-19, finding new ways to communicate with your audience digitally is the order of the day. However, when it comes to finding the right tools to accomplish this, choosing a solution that maximizes user experience is key for them to be effective. Otherwise, they become another source of frustration for your users and an obstacle between them and their goals on your website.

While it’s okay (and perhaps even valuable) to incorporate these elements into your site, you must be careful how they display on mobile. What can easily be tucked into a corner on desktop can take up the entire screen on mobile, blocking important features. It’s almost always a bad idea to expand widgets on mobile when a page loads — especially if it takes up any substantial room (see examples). Allow users the freedom to expand the widget themselves, rather than bombarding them with some exit-button hellscape as soon as they land on your site.

chat-widget-expanded chat-widget-collapsed

Use UX to Guide Your Conversion Goals

None of these website elements were created for the simple purpose of annoying users. They all were made to solve some business or communications problem. Still, the actual human experience of these features is often frustrating and is, at best, a necessary evil most people have come to accept — like phone trees, waiting in lines, or telling a coworker their mic is off on a Zoom call.

Solutions that prioritize business goals over user enjoyment — especially when it’s painfully obvious to the user — will eventually drive your audience to look for a better experience elsewhere. Ultimately, creating a great user experience is a simple but effective way to show your audience that you care about them as humans and not just as customers feeding your bottom line. It might even get them to sign up for your mailing list on their own.

If You’re Looking to Boost Your Conversion Rate Without Hurting Your User Experience, Allegrow Can Help

Conversion rates are important to any organization, but finding a way to delight your audience at the same time is an art. At Allegrow, we’ve built hundreds of websites that convert users and deliver an excellent digital experience. For more information about websites, improving the user experience, or other communications solutions, email your Client Experience Consultant or contact our team today.

Comments