Top navigation

How to design an efficient e-commerce website for today's 'mobile first' consumers

Laura  Barnes
How to design an efficient e-commerce website for today's 'mobile first' consumers

Ben Morgan, head of partnerships at unbiased price search engine, outlines a number of practical tips for creating the ideal e-commerce website for today’s ‘mobile first’ consumers…

Designing an efficient e-commerce website requires a good understanding of how customers will view it. Recent statistics from product search engine indicate that 78.75% of internet users were browsing on smartphones and tablets, with just 21.25% using desktop computers. This goes to show just how important it is for any e-commerce site to be mobile optimised.  With musical instrument retailer Gear4music doubling its turnover to £56.1 million within a year, there is a lot riding on a good website layout. But navigating the requirements of a mobile optimised website can be challenging, so we have listed the most practical tips we have for simplifying this stage.

Keep it Simple

Mobile-optimising a website means stripping it of unnecessary embellishments, as the format offers limited screen space, so you must prioritise the most important content. Small, unimportant details should be removed to allow for the most user-friendly experience.
Article continues below


Function over Fashion

Of course your site should still be visually appealing enough to grab the interest of your audience, but it needs to be practical to use - it is, after all, being viewed on a mobile device for convenience, so don’t complicate things. Tools for more functionality include product searches, search filters and nearest store locations.

Touch and Tap

Don’t forget that when visitors are on your website, they will be navigating by swiping and clicking with their fingertips, which loses the precision that a computer mouse cursor offers. This means that your site should have larger buttons that can be easily selected. Take care not place them anywhere awkward where they are likely to be hit accidentally, as this will frustrate users and quickly see them alienating your site. Users are also likely to want to zoom in on product images, so ensure that they are able to adjust the size of the page with ease.

No Pop-Ups

Navigating between multiple screens and pop-ups is not only a huge annoyance on mobile devices, but slows loading speeds and causes a generally bad user experience. Sites with a lot of pop-ups tend to have very high bounce rates, so if you absolutely have to use one, make sure it is as discreet as possible and provides a notification of how to navigate back to the main site.

Give Thought to Fonts

All imagery needs to be thought about when mobile-optimising, but fonts need particular attention. Remember that everything is much smaller on a mobile screen, so stick to standard fonts that are easy to decipher, and make sure you select colours that contrast well with the text background and makes the words stand out. Again, not being able to read or figure out what does what is a major cause of high bounce rate, so make sure it all looks good.

Check it First

The mobile device market is already flooded, and more devices are being released all the time, which can make it difficult to project exactly how your site will look on each. It’s a challenge to make a site completely mobile-optimised (there may well be some devices that don’t handle it well, regardless of best efforts), but you can strengthen your site by putting it through a tool like BrowserStack, which provides simulations of your site through a wide range of phones and tablets. This way, any formatting problems will be easy to spot, and much quicker to fix.

Ben Morgan is Head of Partnerships at, an unbiased price search engine that retailers can access for free. For more information visit

Tags: Retail , online retail , ecommerce , Opinion , , ben morgan

Follow us on