Optimizing your mobile experience

I love responsive design. It's a wonderful, elegant solution compared to the old days of specifically made mobile sites (that usually lacked half the content of the real site and still didn't work) or trying to navigate something that was designed for a 22 inch monitor on a device that fits in your pocket. It's great to see the long-promised future of a seamless cross-device experience finally on the horizon.

But it's not quite here yet.

While we've made great strides with responsive design in the past few years, the mobile experience of many sites still feels distinctly "meh.” An unideal, often clumsy way to visit a site that still seems like a second-fiddle experience. Sluggish menus, lots of tedious thumb scrolling, and other annoyances often leave me thinking "forget it, I'll just check it out at home” (spoiler: I never do, neither will your customers).

Fortunately, these problems are easy to fix if you know what to look for. With a few simple tweaks, you can noticeably improve your site's mobile experience overnight.

Simplify your content

While responsive design can accommodate all kinds of content, it's still best to design with the mobile experience in mind. One of the easiest ways to improve your site it to simply go through all the text and see what you can cut or shortened.

Keeping things concise will not only prevent things from becoming overcrowded and jumbled on mobile, it will improve the desktop experience as well. By trimming your content to the most essential details and cutting the cruft, your customers will spend less time scrolling and searching, and more time engaged with the content they need on every device. That's not to say you can't have long chunks of text anywhere on your site, just save them for your blogs and articles.

I always find it helpful to switch the perspective – instead of trying to treat mobile users like scaled down versions of your desktop users, treat your desktop users like gigantic mobile users. Design for the smaller format first, take advantage of extra room on desktop second.

Prioritize navigation

People use their mobile devices for goal directed behavior. They have a specific question they need answered, or want to perform a certain task. Nobody wants to use their cell phone to to lazily wander around a site and breeze through its content. When people access a site with their mobile device they want what to immediately find what they came for and get out. Make them happy - prioritize clear, simple, and easy to understand navigation that makes it a snap to find what they want.

Having a visible and easily accessible navigation menu or search bar is essential on a mobile design. You want to make it as easy as possible for customers to find what they're looking for with a minimum of fuss. The longer it takes a visitor to find something, the more likely they'll simply get frustrated and abandon the site.

Website analytics can help you further fine-tune this experience. Pay attention to what your mobile customers are accessing the most and see if there is anyway to make that trip easier. If you find a lot of traffic is heading towards the contact page for example, try putting that info on the homepage or in the header.

Be careful with overlays

Trying to use overlays and pop-ups on mobile is risky business. While they may work fine on the desktop version of your site where there is more room to breathe, they can quickly suffocate the mobile experience. Nobody, and I mean nobody, enjoys accidentally clicking on a pop-up while trying to thumb scroll through a site, no matter how good the offer is.

I'm tempted to say "don't use them at all” but I'll stop just one step short and say "be careful if you do.” Any overlays you use on a mobile site should be scaled to the mobile experience and as non-obtrusive as possible. Make sure they're easy to dismiss as well, you won't turn people into converstions by making your promo offer hard to get rid of with a microscopic X. More likely they'll close the page in disgust and not come back.

Make a site that welcomes mobile users by concentrating on speed, clarity, and simplicity. Save the fancy overlays and pop-up calls-to-action for your desktop experience.

'Web Design Help,Commentary'