How and why to make your website 'Mobile-Friendly'

It’s a fact, that there are now more mobile devices than there are people in the world!
A few years ago the Internet was shaken by what digital marketers dubbed ‘Mobilegeddon’. This term arose when Google announced it would be modifying its algorithm to favour mobile-friendly sites.

Sites that previously had performed well in search completely fell off Google search engine results page (SERP) because their sites were not mobile-friendly. Basically, Mobilegeddon was Google’s way of acknowledging that Internet users are unequivocally going mobile.

After all, in the past five years, mobile use has grown nearly 400%, and nearly 20% of users between the ages of 18-34 spend all of their online time on a mobile device. In 2012, 67% of people said they are more likely to purchase when visiting the mobile-friendly site, but 61% said they would bounce right off a site if the mobile experience was poor.

Being able to provide potential customers with a positive mobile experience could be the difference between making the sale or not. The reality of all this mobile activity is that today’s businesses must not only have a professional, user-friendly website, but also one that looks good and functions well across a large range of mobile devices.

How do I know if my website is mobile friendly?

Well, firstly test your website on a mobile device! If you need to “pinch and zoom” to use the website or if buttons / clickable elements are too small or too close together then the chances are your website will not be listed as ‘mobile friendly’. Users find this a frustrating experience and are likely to abandon the site and as a result Google will demote your website in the listings if it feels another website will offer a better experience.

Can I test if my website is mobile friendly?

Yes – Google, Bing and other search engines have developed tools which allow you to enter your website URL to check (in real time) how well your website performs on a mobile device.

Google Check:
Bing Check:

The example above shows how the website we built previously didn't pass the mobile friendly test, but it has now been rebuilt to ensure it will pass and as a result will now be included in the results on mobile searches. I.e. the menu / navigation collapses and the content re-shuffles on the page to accommodate the new view port. This particular website is responsive, but there are two choices: responsive or adaptive web design.

Responsive vs. Adaptive Web Design

Responsive web design is pretty much what it sounds like - a website design that responds to the device and size of the screen it’s being viewed on.
Adaptive web design, on the other hand, is literally the creation of different website designs for each type of device. Adaptive websites identify the user’sdevice and adjust the website to provide the best outcome for the user. This graphic below provides a visual representation:

Adaptive designs are technically more complex, and thus tend to be more expensive than responsive designs. However, adaptive sites are known for their ability to offer the optimal experience for each individual with the optimal design for each device.

How do I start?

The work involved in making a mobile-friendly site can depend on your developer resources, business model, and expertise. For an example of how a desktop site might be redesigned to work on mobile, see the following diagram displays how the "wheels page" (on displays on both a computer and a mobile device.

On a very basic implementation level, transitioning an existing desktop site to mobile entails using existing sections of content from the desktop site and organizing them in a mobile-friendly design pattern.
For more information on the technical implementation of a mobile site we recommend heading over to the Google Mobile SEO page here: - however our team are happy to provide a quote to convert a website to a mobile-friendly website. Don’t look at creating a mobile-friendly site as a challenge - see it as the opportunity it is for your business.

Further reading

Google Developers - Building a site for mobile devices:

Google Developers - Google Mobile SEO Overview:

Bing Mobile Friendliness Test Tool:
This also covers details surrounding: Zoom Configuration, Viewport Configuation, Factors that Determine Mobile Friendliness, Readability of Text, Content Width and Link Spacing.