Mobile Unfriendly Websites Beware
Latest posts by Silke Jager (see all)
- 5 Topic Ideas For Small Business Bloggers - December 2, 2015
- Is Negative SEO Bad For Small Business - November 20, 2015
- 3 Effective, Easy Website Tips For Higher Google Rankings - August 13, 2015
Did you receive a message from Google saying that your pages have mobile usability issues?
I hope not, but if you’re one of the millions of website owners that did, then you better do something about it, and quick! You don’t want your site to get de-ranked for smartphone users. Luckily Google is just sending out warnings so far, but pretty soon they will probably start to penalized sites that are not mobile friendly. Refresh your knowledge of what makes for a mobile-friendly website and get your mobile site up and running before Google gets serious.
The very first thing you need to do is check if your website is truly mobile friendly!
Using Google’s Mobile-Friendly Test tool only takes a few seconds.
If you’re site fails the test you will receive a message on the screen. The most common errors are:
- The text is too small
- Links are too close together
- Mobile viewport is not set
By default, smartphone browsers lay out a page as if you were viewing it on a desktop monitor. For your site users, this means that font sizes may appear inconsistently and they have to double-tap or pinch-to-zoom in order to be able to see and interact with the content. You can learn more about setting a sites viewport here.
Online marketers and web professionals have been predicting the increase of mobile web traffic for the past several years now (the image above clearly proves this). Having a mobile friendly website isn’t just important to Google, but should be important to you as well.
Google says they are ready to downgrade sites mis-configured for smartphones.
Three different ways to create a mobile friendly site:
Responsive Web Design
The best and Google recommended way to ensure a mobile friendly web presence is to create and implement a responsive web design. The same website is served on all devices, but the page adapts its layout to each device. A responsive website is easy to implement and maintain. Pages optimized for a variety of devices must include a meta viewport element in the head of the document.
If you have a WordPress website like mine, this can be accomplished pretty easily by installing a responsive theme. Implementing responsive web design means a major re-design of a site’s layout and structure though, which may not be an option for some website owners especially if it is an older site.
A Mobile Website
With this approach you will be creating a separate version of your site to show to your mobile visitors. A mobile website has generally less content than the original site and offers navigation that is better suited for mobile browsing and smart phone users, i.e. large buttons, no header, clickable phone number, etc.
A mobile version of your website will redirect your visitors to a mobile-specific URL (m.domainnamedotcom) while tablet users are shown the desktop site. This is a great solution if you want your webpages designed specifically for mobile users. You can fill the pages with substantially different information than one would expect to see on a non-mobile site. The downside is you will have to maintain and update two different sites.
A Mobile App
A well developed mobile app can take mobile user engagement to a whole new level. Jakob Nielsen from the Nielsen Norman Group states, “A dedicated mobile site is a must, and apps get even higher usability scores.” The trick is to create an app your visitors want to download to their phones and then use again and again.
An app can be a great branding tool but unless you know how to create a mobile app this option can be quite costly. Plus getting your visitors to install and then use said app on a regular basis is easier said than done.
Best Practices For Mobile Sites
- Back up your site before making any changes or updates
- Avoid software like Flash that is not common on mobile
- Place your links far enough apart to aid tapping (fat fingers)
- Use large text that is readable without having to zoom
- Create content that flows so your visitors don’t have to scroll horizontally
- Check for irrelevant cross-links
- Make sure your pages don’t load too slow
For websites that run on WordPress, Joomla, Drupal, Blogger, vBulletin, Tumblr, DataLife Engine, Magento, Prestashop, Bitrix and Google Sites check out these mobile optimization recommendations from Google.
Is your website mobile friendly? Please share your experiences or questions in the comment section below.
Before you move on… sign up for my Newsletter, simply click here!
You will never miss another web design article again. Rest assured, I respect your privacy and will never spam or give your email address to anyone.