In 2013, we all know how important it is to have a nice looking website and to make sure that we rank well in search engines to generate a steady flow of visitors. But it’s also important to make sure that your visitors have a positive user experience across multiple devices. If your business isn’t using a mobile-friendly web design, then you could be missing out on a lot of potential revenue. Each day, more and more consumers are using mobile devices such as smartphones and tablets to surf the web and make online purchases. In fact, according to Trintity Digital Marketing, 1.2 billion people currently access the web from mobile devices. And some studies have shown that tablet users spend 20% more per purchase with online retailers, when compared to traditional laptop and desktop users.
Here are 5 tips for adapting your site for mobile devices
Create a mobile version of your site – I listed this one first because it’s by far the most important. I’m personally partial to responsive design, because it doesn’t involve any redirects or sub-domains, so it helps to eliminate the need for maintaining two separate versions of your website. That being said, there are pros and cons for both options. With a mobile website, you have the opportunity to custom tailor the content, images, layout and design specifically for mobile users, but you will need to host your mobile site on a sub-domain and implement a redirect for when users access your site on a mobile device. Whereas with a responsive design, you are essentially providing the user with a mirror image of your main site, and using the same domain, but it’s just re-formatted to fit the mobile device. Although responsive websites are much more complex than creating stand-alone mobile sites, the responsive design is much better for search engine optimization (SEO, since you’re only indexing one domain, as opposed to two.
Screen resolution diversity – Screen resolutions vary depending on the device. In fact, there are so many different dimensions that no one screen resolution has more than a 20% market share. That’s why it’s a good idea to go with either a responsive design or implement a redirect to a mobile-friendly version of your site so that it’s compatible with a wider range of devices. Device usage varies depending on the industry and target demographic, but you can get a pretty nice overview by looking under the “Audience >>> Mobile” tab within your Google Analytics dashboard. Here you can get a complete breakdown of all mobile devices that accessed you site and see how each device is performing independently in terms of conversions, bounce rate, average time on site, pages per visit and several other core metrics. Here you can also see the device overview that breaks down users into three main categories: desktop, mobile and tablet visitors.
Scale back content/images – When it comes to mobile devices, page load time is a big concern. You can use Google Analytics to help you analyze page load time on mobile devices, and by cross-referencing average page load time and average bounce rate or abandonment rate, you can see which pages and content aren’t performing optimally among mobile users. One good place to start is by using scalable images. Not only should images be capable being scaled down for smaller screen resolutions, but images should also be able to scale up for larger retina displays with higher pixel density. Although retina displays aren’t an issue for mobile users, you can hit two birds with one stone and make sure that big or small, your images are displaying properly. If you’re not using a responsive design, you can scale back on content in some sections and in some cases it might even be necessary to remove full sections to provide a thinner, more consolidated version of your website. Depending on your niche, it might be a good idea to retrofit your content so that mobile users can access the most relevant information pertaining to what they’re looking for and not have to sift through a bunch of other content to find it. When it comes to mobile, simpler is always better.
Reduce http requests, page load time and bloated files – In addtion to making sure that your content and images are scalable, it’s also a good idea to make sure the technical aspects of your site are mobile-friendly as well. There’s a lot of stuff going on in the background that can negatively impact the mobile user experience on your website. Minification helps remove unnecessary bits of code from your CSS, JavaScript, libraries and tracking scripts which means faster page loading time and fewer http requests. You can also combine your CSS and JavaScript into single files to consolidate the code and increase request response time. Other minification tools allow you compress images to reduce file size without compromising image quality and resolution. There are many online services to help with the minification process, but I’m prefer SquishIt. Another common issue on mobile devices is embedding video. Flash-based video players are a bad idea, since they aren’t compatible on many newer iOS and Android devices. If you’re looking for a mobile-friendly alternative, you can either use html5 embed codes or simply use an iframe embed. Videos can be a very powerful marketing tool, but it’s important to make sure that users can access them on their mobile devices.
Optimize for conversions – If you have a contact or subscription form on your website, you may want to consider scaling back on the required fields or simplifying them for mobile users. When it comes to online users filling out forms, less is always more. HubSpot’s Dan Zarella conducted a study and found that removing one single form field resulted in a 50% spike in overall conversions. Obviously you can’t eliminate all of the fields and sometimes it’s hard to even remove just one. But if you can afford to drop a field or two, you should see a nice lift in form submissions, especially on mobile devices. Captchas are another big deterrent. If spam is an issue for your business, you may have no choice but to include a captcha. But if you have the option do without it, you’ll significantly improve the overall user experience. There are also other ways of collecting the data you need, while minimizing the burden on users. If possible, try substituting form fields with check-boxes and drop-down menus. For form submissions, you can also incorporate social login plugins, so users can signup using a Gmail or Facebook account instead of filling out several fields of personal information.
