blob: 58aa10885d61efabfb085c3e5048670fd701757a (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
---
title: Google Calls Out 'Mobile-Friendly' Sites
pub_date: 2015-01-15 09:30:23
slug: /blog/2015/01/google-mobile-friendly-label
metadesc: Google is now labeling mobile-friendly sites in search results and mobile-unfriendliness may soon hurt your search engine rankings
---
Google has started adding a "mobile-friendly" label next to search results on mobile devices.
<img src="/media/images/2015/google-mobile-friendly.png" alt="Google's new mobile friendly label">
As a user I love this [^1], and I'll be honest, I'd be pretty unlikely to click through to a site that doesn't get this label -- what's the point? Even if the site is the sole source of whatever I want there's a good chance I won't be able to view it on my phone.
As a web developer I want to make sure my sites get that little "mobile-friendly" label. Here's Google's criteria for what makes a website "mobile-friendly":
>* Avoids software that is not common on mobile devices, like Flash
>* Uses text that is readable without zooming
>* Sizes content to the screen so users don't have to scroll horizontally or zoom
>* Places links far enough apart so that the correct one can be easily tapped
The first is hopefully obvious at this point. The third item is just basic responsive design 101. The others though are things that don't get nearly enough attention in responsive web design. Text big enough to read and links you can tap *should* be key elements of any good responsive design, but sadly, at least in my mobile browsing experience, they aren't.
I'm happy to see Google start to label sites that fail on these counts and I hope it motivates developers to start taking the smaller, but still very important aspects of responsive design -- like typography and white space -- more seriously.
I'm also happy that the mobile-friendliness of a site may become a factor in how it ranks in search results. According [the Google Webmaster Blog](http://googlewebmastercentral.blogspot.com/2014/11/helping-users-find-mobile-friendly-pages.html), Google sees the "mobile-friendly" labels as "a first step in helping mobile users to have a better mobile web experience. ***We are also experimenting with using the mobile-friendly criteria as a ranking signal***. (emphasis mine).
<img src="/media/images/2015/google-mobile-friendly-lhp.jpg" alt="Longhandpixels gets the mobile friendly label">
There's a [test page](https://www.google.com/webmasters/tools/mobile-friendly/) where you can see how your sites do. This one gets the mobile-friendly label, natch.
<div class="callout"><h3>Need help getting to "mobile-friendly"?</h3> <img src="/media/rwd-cover.png" alt="book cover" />The book <a href="https://longhandpixels.net/books/responsive-web-design">Build a Better Web with Responsive Web Design</a> is the fastest way to get from here to responsive. You'll learn the best ways to scale fonts with screen size and make sure your tap targets are big enough for comfortable browsing. Read the book, follow the suggestions and your site will be "mobile-friendly".</div>
[^1]: I really wish DuckDuckGo would do this as well since I use it quite a bit more than Google these days.
|
