Responsive web design has become increasingly important with the rise of mobile technology and in recognition of that fact, Google has included mobile friendliness as part of its mobile search engine. Mobile-friendly websites are getting higher marks on Google since they are easily visited and navigated on both desktop and mobile devices. Mobile devices are continuing to grow and develop which means that users will escalate their Internet browsing time from them.
With these facts in mind, recent error messages from Google Webmaster Tools asking webmasters to "Fix mobile usability issues found on [Website URL]" are concerning. What does this message mean and what can be done to remedy this situation?
What does the "fix mobile usability" warning message mean?
If you've received this error message from Google, you're not alone. Google sent a long list of notifications to websites in January. Intended for mobile-friendly sites, the message indicates that your site is not easily browsed by smartphone users. Messages were sent to sites that are not mobile friendly as well, raising the question as to how much mobile friendliness will go into the Google ranking algorithm going forward. A recent Search Engine Land article proposes that webmasters can expect large changes in rankings for mobile devices. Therefore, it's clear that to be ranked well on Google for mobile devices, websites must be completely mobile friendly.
While some webmasters have created alternate mobile sites, many are now using mobile-responsive architecture on their main site. Mobile-responsive websites not only reconfigure for mobile devices, they also reconfigure for all size desktops and laptops, making them present better to a user on any device.
So with all that in mind, what is the best way to get past this Google error message and improve your website? We'll break it down for you.
Fixing the error message
The best practice to remove the error message and show Google your site is mobile friendly is implement a mobile-site audit as explained here on Moz. A mobile-site audit examines the various functions of your site and how well it responds to mobile technology. The audit includes the following areas:
- Connections between the mobile and desktop site (assuming they are different)
- Are redirects set up properly between the sites?
- Can mobile visitors get to the main site easily?
- Is your site dynamically serviced with a vary-HTTP header?
- Have you implemented rel=alternate/canonical tags?
- Technical issues that affect mobile friendliness
- Use Google Webmaster Tools to see if it can crawl your site without issues
- Check the mobile XML map
- Review the entire mobile site
- Check site speed for mobile devices
- Implement server-side redirects
- Web design
- How does your site look on a variety of mobile devices, including tablets and phones?
- Are links the right size and space to be clicked with a finger?
- Does your site use Flash? (Flash is not rendered well or at all on many phones)
- Do your mobile and desktop sites match in design and color?
- Add a viewport tag for users to resize pages that don't fit
- Remove pop ups
- For responsive sites, review where elements of the pages end up
- Navigation
- Can users reach all parts of the site on mobile?
- For separate sites, can users navigate to all parts of both sites from mobile?
- Content
- For separate sites, do you have matching pages on both sites?
- Streamline content for the mobile site
- Remove images you don't need
- Video
- Watch videos on mobile to make sure they render well
- Use an HTML5 video player for better video on mobile
- Make videos responsive if your site is not
- SERPs
- How does the page title look on mobile?
- Is your meta description still okay with only 120 characters?
- Maximize your mobile URL with keywords
Tips for Responsive WordPress sites
If your WordPress site is mobile responsive, Google offers several tips for developers. Knowing how your WordPress theme operates will help you as you implement mobile responsiveness.
Update WordPress
First, check the WordPress version and theme version that you are using and if necessary, update to the most current version.
Test Your Mobile Friendliness
Second, use Google's Mobile-Friendly Test to check your site. It will tell you how you are doing and identify potential mobile-friendly problem areas.
Make Corrections as Needed
If your WordPress site is not mobile responsive, you may need to switch to a new mobile-responsive theme or have a custom theme created for you. Ready made themes generally have demo pages for you to see them in action and take a test drive.
Another option is add a plugin to your current theme that creates a mobile-friendly version to your current theme. Jetpack is one such plugin.
At ProFromGo we always recommend the "custom theme" approach. There's two ways to go about a custom theme and the only consideration is do you redesign and start from scratch as it pertains to content, site architecture, and look/feel?
Or, do we use your existing site as inspiration and make it look exactly the same aesthetically but add mobile responsive capabilities through advanced coding so that it renders great on mobile devices?
Re-test Your Mobile Friendliness
Once your site has been converted, check the Mobile-Friendly Test again and see how it performs.
For more information about mobile friendliness and the importance of responsive design, here are a few informed recommendations from a prominent Australian web design agency that I enjoyed reading: Best Practices For Designing a Mobile Friendly Site. There might be more crocodiles, but the importance of mobile-friendly websites remains the same across the globe.
Once you follow these best practices, you will be assured of a mobile-friendly site that Google and your users will approve of. I hope these tips will help you get well on your way of correcting the error message and down the road to mobile friendliness.
