Mobile Website Design That Doesn't Frustrate Users

· 2 min read
Mobile Website Design That Doesn't Frustrate Users

Mobile websites design begins with an uncomfortable reality. Most of your visitors are holding a phone, probably in a queue, possibly while a toddler demands their attention. They won't squint. They won't zoom in and out sf website design. They'll simply leave.



My aunt learned this the hard way. She tried to order a pizza from a local shop's site, missed a tiny button, and ended up with three pizzas. "Well," she said, "the neighbors were thrilled." The shop was thrilled too, but that's luck rather than good design.

Give Thumbs Some Space

Screens got bigger. Hands didn't. Put the main actions where a thumb naturally rests, near the lower middle of the display. Buttons need plenty of room, roughly the size of a fingertip pad, with gaps around them.

If two links sit so close that a tap might hit either one, you've built a digital coin flip.

Fast Beats Fancy

A gorgeous page that takes six seconds to load is a gorgeous page nobody sees. Compress your images. Remove the giant background video. Cut the scripts you added "for good measure" three redesigns ago.

Test on a reasonably priced phone on an average connection, because that's how many people actually browse. The office Wi-Fi is a luxury.

Words Should Be Readable Without Effort

Set body text at around 16 pixels or larger. Keep lines short. Split up long blocks of text. A wall of text on a small screen feels like an actual wall, and nobody wants to climb one for entertainment.

Contrast matters as well. Pale gray text on a white background looks elegant on a designer's monitor and vanishes on a phone in bright sunlight.

Cut Unnecessary Form Fields

Every extra field creates another chance for someone to quit. Ask for an email, maybe a first name, and leave it at that. Skip the fax number—yes, somebody out there still asks.

Use the right keyboard for each field, so a phone number box opens the number pad instead of making people hunt for digits. Small kindness, big lift in completed forms.

Tame the Pop-Ups

A full-screen pop-up on a phone is a digital ambush. Search engines dislike them, and so do humans.

If you really need one, use a slim banner with an obvious close button, and give visitors a few seconds to read before you get in their way.

Test on Actual Phones

Emulators lie a little. Grab three actual phones, including an older and a newer model, and try to finish your main task on each.

Hand one to a friend who isn't techy and keep your mouth shut. Watch where their finger pauses. That hesitation is your next set of improvements, written in fingerprints.