Starting today, mobile users of Google Search are presented results that are not only relevant to their search query, but also optimized for their device. Hence, your website needs to be mobile friendly.
Why is Google doing this? Because nowadays, people are not only using phones and tablets next to a desktop or laptop, but also instead of. And whether you search the web with your mobile device for work or pleasure, you expect a decent user experience.
This is not only relevant for large corporations and big e-commerce sites. According to SearchEngineWatch even retailers can benefit from the mobile searcher:
- 20% of all searches, have a local intent
- 94% of searches on mobiles have a local intent
- 51% visited a store
- 48% called a store
- 29% made a purchase
And according to SearchEngineLand even 78 percent of local-mobile searches result in offline purchases. Having a mobile friendly website is not a luxury, but a critical success factor.
Google makes most of its money with advertising. However, first and foremost, Google is in the search business. Google wants you to serve the best search results and sites with the best users experience. Because this will motivate you to use Google again next time.
That is why Google gives preference to mobile friendly sites, when a user is searching mobile.
What is mobile friendly?
Okay, so not only content matters, but the website needs to be mobile friendly too. But what is that? Mobile friendly?
Well, last November, Google informed us about their yard stick. According to Google, a mobile friendly website:
- avoids software that is not common for mobile devices
- makes sure that text is readable without zooming
- adapts content to the screen of the device, so that users do not have to scroll sideways
- offers links clickable by tapping with a fingertip
Software not common on mobile devices includes technologies like Flash, and Silverlight. Does this mean you are no longer allowed to include video? No, of course not. But it does mean that you should only use a tool like Flash to display videos.
Do not build pages, and definitely not entire websites with Flash. This is bad for search engine optimization (SEO), and even worse for web accessibility. And for future video projects you might want to consider HTML5 video as alternative for Flash.
Text has to be readable. Letters should not be too big, since it requires zooming, or otherwise additional scrolling. Copy should not be too small either, since readers would have to zoom in to enlarge the text.
Visitors should not have to scroll left or right to examine a web page. The only scrolling allowed, is up and down a web page. Not sideways.
Some people use a stylus pen with their smartphone or tablet. However most people use their fingers to point and click on mobile devices. Clicking a link will only be successful when there is enough free space around that link. Otherwise people might click two or more links instead of just one. So, make sure it is possible to click individual links.
March 19th, Google Webmaster Tools urged me to fix mobile usability issues found on one of my websites. On WPfy.me to be precise. That site was not mobile friendly according to Google. My first response was: “Impossible!”. For more than two years, I exclusively opt for responsive themes and frameworks.
Investigating the matter, I discovered that for their judgment – whether a website is mobile friendly or not – Google depends the Googlebot.
Well, some time ago I read an article that hiding certain web folders, would increase the security of the website. This was achieved by disallowing directories in the robots.txt. To put this the test, I applied the instructions on one of my websites. And after a while, I completely forgot about. Indeed, that was WPfy.me.
One of the disallowed folders was the themes directory in the wp-content folder. Since I denied Googlebot access to that folder, it was not able to check the theme files, including the theme’s style.css. The media queries in that stylesheet proof that the site is responsive.
Only the Googlebot was not able to verify this. So, do not block the themes folder for Googlebot in the robots.txt.
Making a site mobile friendly
You have three options when you currently have a (WordPress) website that is not mobile friendly:
- adapt the existing design the website
- switch to a responsive template, theme or website
- install a WordPress plugin
Adapt the design
Making a non-responsive website, built with HTML or PHP and Cascadling Style Sheet, responsive can be done. It is a matter of adding the proper media queries to the CSS.
However, the degree in which this is possible, depends on the state of the website. For example, whether the design leans heavily on graphics or not. In this case – the lesser, the better.
Although upgrading a non-responsive website design to a responsive design is an option, it might not be the most cost-effective solution.
Responsive theme or template
Your best bet for a mobile friendly website, is a responsive website. A responsive websites is a kind of mobile friendly website, where pages and content adapt to the screen of the device used by the reader. This is achieved without the need of additional software.
In case of a WordPress website, switching to a responsive design is as simple as switching to a responsive theme. Content and presentation are separated. The time and money involved is acceptable.
The required investment? From $25 to $100. How much time will be involved? You probably have to rearrange some widgets, but that is about it.
The first responsive WordPress themes were released in 2012. And to make it easy for you, all themes reviewed here on Theming WP are responsive. It is a prerequisite for a review here.
When the theme you are using is not responsive, and you are not able to switch to a responsive theme, because of time or budget constrains – install a plugin. There are several free and premium options available:
- ElegantThemes HandHeld Mobile Plugin
- JetPack by WordPress.com
- Obox Mobile
- WP Mobile Detector Mobile Plugin
- WPtouch Mobile Plugin
When these plugins detect a mobile device, they transform the default, non-responsive presentation in an alternate design. That is how they increase the mobile experience of the visitor with a smartphone or tablet.
These plugins do not turn a non-responsive website into a responsive one, but they do make website mobile friendly.
Mobile Friendly Tests
Google offers two tools to test the mobile friendliness of websites.
A website can only pass or fail the Mobile-Friendly Test. The Mobile Usability Report of Google Webmaster Tools on the other hand, help you identifying the cause in case of a fail.
Is building websites your job? Then check out Google Developer’s Mobile-Friendly Websites.
Are you managing of a WordPress website? Have a look at the WordPress page of that website.
How about you?
Is your website already mobile friendly? What do you think about this latest move of Google.
When you have any questions, do not hesitate to leave a comment. It will be my pleasure to get back to you.