How to get Mobile Friendly label for your website on Google

Google finally decided to show “mobile-friendly” label on SERPs. Websites that are responsive, easy to navigate and read on mobile devices will be labeled “mobile friendly” automatically  from 19th November 2014. Unfortunately, if your site is not yet labeled so, this article will help on how to get mobile friendly label for your website on Google search results.

Before proceeding let’s use the official Mobile-Friendly test tool provided by Google in Webmaster tools to test your website for mobile friendliness. You should also note that the mobile friendly tag is shown only when you search on Google using mobile devices.

How to make your website mobile friendly, really

Google has already provided a exhaustive list of steps and detailed documentation of how you can make your responsive or mobile friendly. But I have compiled a list of simplest of actions that will make your website responsive, which in-turn will get you the mobile friendly label.

How to get Mobile Friendly label for your website on Google

  1. Set the viewport tag
    <meta name=”viewport” content=”width=device-width, initial-scale=1″>  The width attribute when set to device-width matches the websites’ maximum width with that of the device. Inital-scale=1 sets the default zoom level and it means 1 pixel is equal to 1 viewport (device’s) pixel.
  2. Define a mobile CSS and specify readable font sizes for mobile devices.
  3. Allow proper spacing between clickable links.
    Google considers this aspect highly to decide mobile friendliness of your web pages. You can use a responsive web framework like Bootstrap, foundation API, Zimit, YUI, etc. This will make your navigation adopt to mobile devices seamlessly.
  4. Specify max-width for images. This will make your images fluid, not overflowing outside the device’s screen width.
     img {max-width:100%}
  5. Do not use Javascript or CSS code that are incompatible with mobile browsers. For example: if you are using a javascript the creates sub-menus from a <li></li> structure, test it with mobile devices before you put it on web.
  6. Alert the visitor with best suited orientation to view your site. Like the “This site is viewed best with Internet explorer at 102x768px” message you used to see on website in 90s, let the visitor know whether the page can be best viewed in portrait or landscape orientation.
ALSO READ  8 Must Have Sublime Text Editor Plugins for programmers

Google had test authorship on SERPs. This impacted the CTR of different websites irrespective of their position in top 10 – 30 results on SERPs. Later Google withdrew authorship. But mobile responsiveness is something that you should have considered implementing a while ago. This could turn an important ranking factor in future. May be, the results in deskop browser version of Google search and mobile version may vary based on mobile friendliness of sites that qualify to appear on result pages. So if you have tried the above steps and still not sure of how to make your website Mobile Friendly, you should consider hiring a web developer and probably redesign your website responsively.  Because making your website mobile friendly is not only important for getting labeled so in Google but also for enabling better user experience.

One Response

  1. ijaz July 12, 2015

Leave a Reply