4 common pitfalls of mobile web design

Welcome to 2014 – the future we all dreamed of years ago. You might even be reading this post on your space-age smartphone or tablet. Just like you, your website's visitors might be doing a lot of their internet browsing on mobile devices. So - is your site truly mobile-friendly or is it actually costing you money and conversions due to poor design?

Here are a few problems we see come up again and again in our clients’ mobile design.

1. Ignoring mobile users

All of the other issues on this list pale in comparison to not catering to mobile users at all. This is especially true if you're using your website to sell products directly to consumers. Danyl Bosomworth of Smart Insights reported that 35% of all web traffic occurs on mobile devices; companies like Amazon have seen an 87% growth in mobile visitors since 2012. Further, buyers prefer to shop on a mobile app over a mobile site, therefore, not having an app through which consumers can purchase goods or services may be actively hurting your company.

2. Using a separate mobile site

For a while, all mobile web design relied upon separate sites. However, this created more hassles than problems solved. For users, mobile-only sites often meant outdated design and limited functionality. On your end, do you really want to update two websites every time something on your site changes? This is why the move to responsive design makes so much sense. Create one design – but create rules that will make it transform appropriately when someone views it on a mobile device. Building your layout on a fluid grid is the key to responsive web design.

3. Basing design on user agents

You're all ready to create a mobile-friendly, responsive website. You want to ensure that your website responds correctly based on the user's device. You might think you can easily do it by detecting iOS, Android or other mobile operating systems – but you'd be wrong. In 2014, the line between mobile operating systems is almost nonexistent. Just look at Windows 8. However, the method you would need to display properly according to a specific operating system -- user agent detection -- is incredibly inconsistent. There are dozens of user agents that Android devices alone might use. The better (and easier) method is to detect screen size and resize your layout accordingly.

4. Making your website difficult to use for mobile visitors

Even if you have a responsive website, you might not be doing enough to streamline the checkout and shopping process. This could be costing you real conversions. (And you know how much we like to talk about conversions !) The following are several examples of problematic website behavior and how you can fix them to increase mobile conversions.

• Your address and phone number aren't links. Turn them into anchors to allow people to call you or load your business in their GPS app.
• Your forms are too small. Increase form size on mobile resolutions. Make sure that you're using labels for text so users can select the text and not just the small box or radio circle.
• Your website requires login to check out. Groan! Don’t make your almost-customers angry at the very end of a potential buy. Enable guest checkout and/or account creation as the shopper goes through a transaction.
• Users have to click too many times to shop and checkout. Allow users to view more items per page rather than clicking through many pages. Allow users to add items to their shopping carts from the category page in addition to the product listing. Add a "Cart" button in multiple locations so that you’re making it easier for customers to convert.

Just as Kevin Costner learned, if you build it, they will come. Of course, your field of dreams may be your small business – so building it correctly is even more important!

If you need to consult the professionals on your mobile web design, contact the experts at Web Revelation. We’ll show you how to keep your site up-to-date – and your customers happy.