In Nublue Blog

10 Mobile UX Nightmares to Avoid

Stefan Posted by

It’s now been 6 months since the much feared Mobilegeddon update was rolled out by Google back in April. With 1.2 billion people worldwide now accessing the world wide web on mobile devices, this clearly marks the importance of mobile as a something to bear in mind when establishing your online presence. Yet still, many sites continue to subject us to mobile UX nightmares that could be easily avoided.

With Halloween on the approach, we went around the office to find out what mobile UX nightmares most haunt the Nublue team, finding out their biggest responsive bugbears.  We’ve also created a handy infographic on how to lay these nasty nightmares to rest.

Mobile UX Nightmares

Nightmare 1

Touchpoints and buttons too small to press.

It’s that age old problem (at least dating back to the times of the first responsive websites!)  You want to buy a product, you want to find out more, but the calls to action to click are just too small and fiddly for your fumbling fingers.

According to Google Developers, it is suggested that tap targets be at least 48 pixels tall/wide.  For those links which are less likely to be clicked, the recommendations state that you can make these as small as 32 pixels.  However, bear in mind that the average index finger measures 7mm (48 pixels) wide.

Consider wider click buttons to ensure ease when customers are trying to navigate your site and complete your goals.


Nightmare 2

Inconsistency in content across devices

Let’s say you’re booking a holiday.  You do a bit of research at work on your desktop (at lunch time *ahem*) and find a resort you like.  Later that evening, on the sofa, you decide to check it out in more detail and browse the agent’s site on your mobile.  But the thing you read on the desktop site is different to the thing you’re reading now.

According to a YouGov survey reported in the Guardian back in April, the average British household has access to 7.4 different digital devices, so cross device browsing is becoming increasingly popular.

Many sites try to keep their mobile site content to a minimum and as such, some can edit their content dramatically from their desktop version.  Consider the affect this could have on your customers.  If you have to cut your content, try to condense it rather than changing it completely.  Making sure the key points are still available for mobile users to access.  Ensure you get a good balance between too much content and not enough information…


Nightmare 3

Large and fiddly text forms

How many times have you abandoned a purchase or a sign up because the mobile forms were just too frustrating to fill in?  You may have even decided to come back to it later on a desktop… but did you….?

Whether forms are too long, you experience scrolling issues, you’re required to swap your keyboard to numbers, or the field boxes are simply too small, forms that take too long to fill out will inevitably put your customers off and could lose you conversions.

Try using dropdowns or checkbox choices where possible; shorten your forms to only request essential details; and set input type to be field appropriate.  For example use input type ‘number’ for fields that require a phone number, so the numerical keyboard is automatically selected for the user.  Bear in mind this may not supported by all devices.


Nightmare 4

Alien icons

There’s a fine line between innovation and not reinventing the wheel.  As much as we all want our mobile sites to stand out against the rest, there are a few elements that have come to be commonplace in the mobile design sphere.  As such, customers are familiar with these and understand exactly how to navigate with them.

Take the hamburger menu icon.  Its constant use has become a staple for mobile design (even making its way into some desktop designs of late), and consumers have become comfortably familiar with it and its use.

Introducing new, innovative and alien icons to the mix may confuse your customers and make it harder for them to navigate your site.  By all means implement fresh design ideas, but stick to the familiar when it comes to key navigation points.


Nightmare 5

Mandatory sign up before checkout

Mobile accounts for half of all e commerce traffic according to Shopify, and with Christmas slowly creeping up, many of us will want to make quick purchases to get through our list.  Having to sign up to every ecommerce site we visit before we can check out could become an unwanted burden, especially when trying to contend with a mobile device.

Consider allowing guest check out for ease of purchase, with a follow up email to ask for registration at a time convenient to the user.  Alternatively, if sign up is essential to your customer journey, try to incorporate auto sign ups with Facebook or Google accounts.


Nightmare 6

Long scroll back to the top menu

Long scroll pages are not uncommon.  But when you have to scroll back all the way up to the top to access the main navigation, this can make the user experience frustrating.

Consider a sticky menu that follows the user as they scroll.  You can make it transparent so as not to distract from your main content.


Nightmare 7

Pages taking too long to load

According to KISSmetrics, 47% of consumers expect pages to load in 2 seconds or less.

Part of Google’s Mobilegeddon threatened to penalise mobile sites that take too long to load, so keeping your mobile site speed nimble is crucial.  Reducing the number of files needed to download, ensuring images are at a lower resolution, and keeping the use of javascript to a minimum, will all help to deliver faster loading times for your mobile users.


Nightmare 8

Distracting pop ups

It’s no secret that popups are generally thought of as a nuisance despite there being some cases where they can add value to the online experience.  The main frustration comes when popups appear during a mobile interaction.

On a desktop, the popup is usually easy to close, and you can still see much of the main site behind it.  On smaller mobile devices the popup can take up the entire screen, and smaller close tabs can be difficult to click to close.

Make the close button easy to click on all popups (remember the average index finger is 48 pixels wide), or avoid using them altogether on mobile devices.


Nightmare 9

Sliders that aren’t scrollable

A feature which is becoming less popular in recent web design trends, the slider does however continue to crop up.  If choosing to make your desktop slider responsive for your mobile site, ensure that you incorporate scroll to slide functionality, something which mobile users will expect this feature can do.


Nightmare 10

Sites that are not optimised at all for mobile

Even following Mobileggedon there are still mountains of sites that have made no effort to cater for their mobile users.

With 1.2 billion people now accessing the web on a mobile device, and more and more sites catering to these unique user needs, sites that are not optimised to offer the best performance for their mobile users will only get left behind.




Author Stefan

More posts by Stefan

Talk with one of our hosting experts today

Or call 0800 033 7074