Space48 Logo
google-mobile
April 17, 2015

Google mobile-friendly fixes

Not ready for the Google changes?

Testing your site on Google Mobile Friendly and then finding a big red ERROR! Uh oh…

Our recent blog post ‘Google Mobile-Friendly Changes‘ covered Google’s latest announcement; two important changes to help users discover more mobile-friendly content. We also provided a URL test so that you could determine whether or not your site was ready.

Despite our site being fully mobile responsive, an error occurred when we used the test for ourselves. Fridays are generally calmer, happier days at Space 48 (especially the day after a major client’s site went live) therefore I had time to investigate; the culprit was the Robot.txt – Naughty!

mobile-friendly1

Other Google mobile-friendly errors that may appear include;

  • Content is too wide
  • Links are too close together
  • Text is too small to read
  • Mobile viewport is not set

The errors above are very plausible finds and are reasons to re-evaluate your design.

Take your design into consideration and carry out small changes.

  • Increase the spacing between links; in particular the pagination buttons on the category page toolbar. White Space is good, especially for those chubby fingers!
  • Make sure that your font size is 12px or more.
  • Ensure that all images are optimised for mobile and that no content is breaking your site container width.
  • To optimise your page for mobile device you should include a meta viewport in the head specifying width=device-width, initial-scale=1.

When making design changes to an existing or new site it’s generally best to consider some CRO (or A/B) testing. Testing can help you decide the best way forward to improve conversion and visitor experience‚Ķ but for now back to the quick mobile-friendliness fix 🙂

Fixing the robots.txt

My first indication of the culprit was that the ‘How Googlebot sees this page’ screenshot was not showing any CSS from our theme. This suggested to me that the robots.txt file was blocking the stylesheet from Google. On further inspection my thoughts were confirmed – this was preventing our site from passing the Google mobile-friendly test.

By using Webmaster Tools you can double check this issue for yourself; Go to Robots Testing Tool and enter your URL to your theme files. This tool will highlight the line in your robots.txt which is blocking the stylesheet.

Voilà!

After removing the offending line of text from the robots.txt, which was Disallow: /wp-content/themes/. I did the test again and received the response we were hoping for, “Awesome! This page is mobile-friendly.”.

Mobile Friendly Test - 2

Preceding the Google Mobile-Friendly Test it was best practice to disallow Google bots from snooping around your theme files. However, commencing April 21st this is no longer best practice and therefore requires a fix – We hope this post helps you and your site!

Related Articles