Shift4Shop eCommerce Blog

7 Tips for Mobile-Friendliness

Written by Shift4Shop | Nov 16, 2015 1:00:14 PM

With the incredible rise of mobile internet usage, it’s more important than ever that your website is mobile-friendly. Not only are your competitors updating their sites and consequently attracting more customers, all major search engines will soon reward mobile-friendly online stores with higher search rankings. If you’re not looking to be left behind, check out the few steps you can take to update your online store for mobile-friendliness.

  1. Use a Responsive Design. With a responsive design, the same information is relayed to every customer, regardless of the device they may be using, with CSS automatically translating and presenting information in a way that is mobile friendly. This allows customers to easily make a purchase whether they’re sitting in a waiting room, in line at the grocery store, riding the bus to work – virtually everywhere.

In most cases, adding the necessary code to make a site responsive is fairly simple. For 3dcart customers, this transition simply involves the selection of one of our 100+ responsive, mobile friendly themes. Choose a theme – download – apply; it’s really that easy.

  1. One of the more problematic aspects of making a website mobile friendly is optimizing the images. While pictures and videos may look great on desktop, they may appear distorted and fuzzy when viewed on a phone or tablet. Optimizing your images may involve a certain amount of trial and error as you test out what looks good on a smartphone and which images lose their integrity. Here are some tips to follow that will help you get the most out of your images:
  • Compress your image files. Try to use the smallest file possible. This will speed up load times while making sure that everything still looks sharp.
  • Beware of certain programs. Not all programs translate to mobile designs. For instance, if you are using Flash Player on your site, it won’t play videos on a mobile device. Do some research and testing to ensure that everything works properly across all devices.
  • Resize images. Mobile designs tend to create long websites that require visitors to scroll through. If your site has a lot of wide, header sized photos, you may need to crop or resize them so that they are more vertical and look better on mobile devices.
  • Use high quality images. This should be a no-brainer, but be sure that you’re using only the highest quality images available. Starting with the best possible material will make things easier down the road.
  1. Cater your website design to the most common mobile devices. You may not be able to accommodate every mobile device on the market, but if you target the most popular brands and models, then you’re sure to reach the largest sector of your intended audience.
  1. Follow established standards for mobile design. Make sure that there is enough space between links so that users don’t end up tapping on two links at once or hitting the wrong one altogether. This can create a frustrating user experience. Mobile friendly sites should also be as streamlined as possible. Keep it simple so that people can easily scroll through your site. Dropdown menus should be limited to three items. Reserve more complex design elements for your main site and keep your mobile design simple.
  1. Carefully design the “view cart” and checkout pages in order to create conversions. This is an important area where simplicity is key. Make sure that it is easy to verify an order and enter payment information. Getting bogged down on these pages will significantly affect your sales.
  1. Improve load times. This applies to all your content and not just images. As you focus on making design adjustments, it can be easy to forget how all these changes may be affect how well your site operates. Simplifying the design, compressing files and updating programs can help speed up load times and ensure that customers stay on your website.
  1. Take advantage of mobile friendly testing tools. Major search engines are pushing websites to move toward mobile friendly designs, but that doesn’t mean that they’ve left developers in the lurch. You can quickly have your site analyzed and receive feedback about where and how you can make improvements. These tools provide a handy way to gauge the strengths and weaknesses of your mobile design.

The idea of having to update your website for mobile-friendliness may seem overwhelming, especially as you continue to juggle the day-to-day business of running your online store. Fortunately, it doesn’t have to happen all at once. You can continue to follow these tips and make adjustments at your own pace. Just be careful – don’t’ drag your feet too much, or you’ll risk losing business to competitors who’ve already embraced a mobile friendly design.