Beyond Responsive: How to Make your Website Mobile Friendly

Although a responsive website is a great sign that things are working well, many business owners make the mistake of assuming their work is done. But when it comes to marketing your site, the truth is that your work is never done. In fact, if you haven’t considered the mobile space for marketing your business, your work may have only just begun.

Today’s businesses require both a website and a mobile site in order to claim total presence on the web. Indeed, more and more consumers are accessing websites using their mobile devices. Those sites which do not offer mobile access are poised to lose a large portion of their visitors.

Mobile First

This is a way of thinking that begins by building the best consumer experience possible on mobile devices first, and then working out ways to duplicate that experience on a computer screen. Many businesses have tried this in the opposite direction, only to find that it didn’t work as they had initially hoped.

However, this doesn’t mean that your focus should primarily be on the mobile space all of the time. Check first to see whether or not you are still realising significant gains in the large screen space, as these may outweigh the benefits of marketing on mobile devices first.

One exception to the rule is creative content; if you are sharing your creative content via social media channels, chances are that a large part of your visitors are consuming that content on their mobile device.

Identifying What Is and Isn’t Mobile First Content

Does mobile content look like website content? The answer is yes, and no. The issue lies in the presentation of a mobile site vs. the presentation of its web counterpart. Mobile content needs to be presented entirely differently than content intended for promotion on larger screens. This doesn’t mean republishing the content using a different template, however.

Analytics Can Lie

You may have looked at the analytics for your business, and noticed that mobile makes up only a small percentage of your traffic. However, this number doesn’t mean that mobile isn’t worth creating content for; what it really means is that the mobile experience you are offering isn’t attracting attention.

Seven Elements of Effective Mobile Sites

1) Format

The format of your mobile site will need to be far simpler than the one you use on your website. Simplifying means presenting all of your site’s content in an easy-to-read format. A linear, single-column format works best.  If using a mobile style sheet, it is important to ensure that all frames, columns and the like have been removed. It is these elements that are at the root of most viewing issues for mobile users. And, instead of using pixels that can cause a site to appear too large, consider creating a site for several screen sizes with <em> and percentages instead.

2) Images

You might also consider resizing or compressing your site’s images so that they can be viewed properly on smaller mobile screens. Resizing or compressing your images will also mean that the devices loading them consume far less bandwidth and will take much less time to load. This will mean less stress and more convenience for your mobile visitors.

3) Navigation

Just as with your regular website, navigation on your mobile site must be clear. This means keeping in mind that mobile internet users want to use as few clicks as possible to get to the content they want. Take a look at your site links, removing those which mobile users might consider to be less of a priority. To ensure that mobile users see the most important elements of your site before any other, consider placing your navigation menus at the bottom of your mobile site.

4) Add a Style Sheet for Mobile Users

If you created your site yourself and are familiar with the code used to create it, add a style sheet for mobile devices. This can be done by navigating to the media attribute and declaring the ‘handheld’ option. Adding an alternate style sheet will override all other style sheets that a regular computer would render. Doing this will also give you more freedom to style your mobile site differently for a range of platforms and mobile browsers.

5) Testing

Finally, the most important thing you can do is to test the ‘friendliness’ of your new mobile site. Otherwise, how can you tell whether or not it will work for your visitors? To accomplish this as thoroughly as possible, test your mobile site on devices from several companies, such as Android, iPhone and Blackberry. To take this a step further, include older devices in your testing. If you do not have access to different devices to test your mobile site, there is an alternative; the Opera browser allows for viewing in smaller screens so that the mobile rendering of a page can be previewed.

6) Validation

While testing may have been enough for your website, a mobile site must be both tested and validated. Validating your mobile site is as easy as visiting an online mobile validation tool like the MobileOK Checker, which will gauge your site’s overall mobile friendliness.

7) Compatibility

Browser compatibility remains a significant issue for mobile sites. It is true that not all mobile browsers are the same. As well, each mobile browser functions differently. Thankfully, there are many online resources available to test a mobile site’s compatibility across several browsers.

Making a mobile website is one thing. However, ensuring that it will conform to the standards of the mobile web is entirely another. As the number of consumers using their mobile devices to access online content continues to grow, it becomes even more crucial for businesses to understand how their websites look and function on those devices.  Consulting analytical data for the device types most often used to access a company’s web site can allow for the development of a mobile site that functions seamlessly.