Tag Archives: responsive

Google’s Mobile-Friendly Website Warning

example of a mobile-friendly websiteOn this page you can read about:

  • Google’s warning, and what it means for website owners;
  • What makes a website mobile-friendly;
  • Ways to check your website;
  • Three methods of mobile-friendly implementation;
  • Google’s mobile-friendly web page testing tool;
  • What to do next.

Google’s Warning

Google has announced a change in its search algorithms. From April 21st, 2015, websites that are not mobile-friendly may appear lower in mobile search results than those that are.

Google thinks mobile-friendliness is important, and rightly so. Searches on mobile devices outstripped those on desktops and laptops last year. See the stats here. We monitor clients with nearly 70% of website visits from mobile devices.

They send webmasters an email when their web crawler, “googlebot”, finds pages that don’t comply. The mails arrive from the Webmaster Tools Team, with subject, “Fix mobile usability issues found on [website name].”

What Makes a Website Mobile-Friendly?

Mobile-friendly websites change their display to suit the user’s device. The same content will look different on a laptop, tablet or smartphone. It should be easy to use on any of them.

Is Your Website Mobile-Friendly?

Easy Ways to Check

You can check your website by looking at pages, first on your laptop or desktop, then on a tablet and smartphone. They should respond well to the mouse on your static devices, and equally well to taps on touch-screens.

For a more thorough check, use just your lapfloating pane controltop by changing the width of your browser window. If you’re viewing full screen, click this button next to the Close button, top right.

This makes a smaller window that you can re-size by dragging the corners, sides, top or bottom. Hover your mouse over the right-hand edge of the change-window-widthwindow until you see a double-headed arrow, like this. Hold down the left mouse button and move it slowly to the left. See how (if at all) your web page changes its appearance as the width reduces.

If it isn’t mobile-friendly, and the right-hand side disappears, then you have work to do.

mobileAdGraphic480x240

Methods of Mobile-Friendly Implementation

For an example, try squeezing your browser window with this web page. As the device gets smaller, the browser gets narrower. See how:

  • three images re-size and drop one below the other;
  • then the images shrink to fit;
  • the width of the text reduces;
  • the menu, contact and user log in buttons change position;
  • the get in touch button remains visible always.

This is what’s known as a “Responsive” website. Word on the Digital Marketing block suggests that responsive sites will appear higher in search results than those using other methods. Google defines two more methods:

  1. “Dynamic serving”, where the server sends different HTML depending on the user’s device;
  2. “Separate URLs”, which requires owners to maintain two separate websites, one called www.example.com and the other, say, mob.example.com.

If you’re into the detail, see Google’s guide to mobile-friendly websites.

Mobile-friendly Web Page Tester

You can check any web page using Google’s Mobile-Friendly Testing tool. Just copy and paste any web address into it.

Google’s Webmaster Tools now have a Mobile Usability section. It tells you which pages on your site fail the test, and why.

example of a false positive result from Google's mobile-friendly testBeware of False Positives

Google’s tool can make mistakes. Here’s an example, the owner of which will remain nameless :-). Google thinks this home page “awesome” but actually isn’t.

You see their cookie policy warning; nothing else. This obviously works for googlebot, but isn’t much use to human visitors.

The web page uses a third-party cookie policy script that googlebot thinks is a whole page.

What to Do Next

There’s no need to panic. It’ll take a while for googlebot to crawl the entire world-wide web. And if your business doesn’t rely on Google searches, you can relax for longer. However, with more than half of all searches done from mobile devices, you’ll still want to make this change.

NB: this only affects mobile searches, your website should still look OK – and retain its position in search results – on static computers.

  1. Check your website using Google’s Mobile-Friendly Testing tool.
  2. Keep checking your position in search results on your mobile phone. Make sure you’re not logged into your Google account when you do this, as Google shows you what it thinks you want to see, not what a new visitor would see.
  3. Ask your web designer to make your website fully responsive. Make sure they fix the whole site, not just a few pages.

If they’re busy, there are some things you may be able to do yourself, using your own CMS, to tide you over. NB: you’ll still need to get the job done properly, as soon as you can.

  • make sure your fonts are big enough to be read easily on a smartphone;
  • don’t put touchable buttons or phone numbers too close together;
  • remove Flash animations, which are not supported on all mobile platforms.

If you want some help, give BlueTree a call. 0117 339 0095.