Mobile Friendly Web Design - Google Search Ranking Impact

With more searches on phones than ever before, you need to be mobile-friendly.

The time for floating by with a non-responsive website is coming to an end. Your web visitors are using a multitude of devices with varying screen sizes to access your website and it needs to instantly adapt for every user. Beginning April 21, Google will be placing significantly more emphasis on mobile-friendliness when determining search rank.

So start your transition to a mobile-friendly web design right now. Plenty of your competitors have already implemented great websites that will immediately get a boost in search ranking when the Google update goes into effect.

What Does it Mean to be 'Mobile-Friendly'?

Mobile-friendly, means your website looks good on a small phone screen. In search engine ranking terms, it means that:

  • your text dynamically adjusts to be legible at all sizes,
  • you only need to scroll up and down (no side-to-side panning),
  • zooming in and out isn't necessary and
  • 'touch points' (buttons/links) that require clicking have enough space between them to reduce the chance of accidentally clicking an unintended link.

That's pretty much the core of what search engines look at when determining how mobile-friendly your website is. And making the search engine robots happy is all fine and dandy, but your primary focus should always be the end user.

When you're designing a new mobile website you should consider:

  • avoiding lengthy blocks of text (it may look fine on a desktop, but can appear overwhelming on a phone screen)
  • maintaining easy access to the most frequently visited portions of your site
  • making connecting with your company simple: click to call/email buttons
  • collapsing the menu (slide out menu area or drop-down from a 'menu' link)
  • hiding images that look great on a desktop but become an obstacle on a mobile screen
  • using heading (h2, h3, h4, etc) formatting to make skimming easier.

By no means are these exhaustive lists, but they are some of the biggest points you should keep in mind when designing a mobile website. I'd encourage you to whip out your phone right now and visit some websites you most frequently visit on your desktop. Is it still simple and intuitive to get where you would normally go? Does it feel comfortable, familiar?

Remember, that above all else, mobile-friendly means simple, intuitive web design that end-users appreciate.

Responsive - The Best Approach for Mobile-Friendliness

I talked about the choice between using a responsive design vs a mobile subdomain when making the transition to phone friendly web design in a previous article and I want to reiterate that point: do NOT create another version of your website on a sub domain and call it good.

Subdomains are meant to serve as extensions of your brand: e.g. forums, member-specific access levels, ecommerce stores (small, not primary focus), etc.

Subdomains should never be used as a work around to mobile-design. If your site isn't responsive, it's time for an update.

It's not just me, Google says no to mobile subdomains too.

Who Does the Update Affect?

Everyone. The update to Google's search algorithm affects search ranking on mobile devices only, BUT don't get caught thinking you're unaffected. There's a trickle down effect that comes into play. Mobile-friendly sites have less search rank competition, thereby increasing exposure, increasing the likelihood that people visit, share, and link back to the mobile-friendly site, further increasing their search rank.

Your non-mobile site loses visitors, falls further down the search pages and continues to do so until you update your web design to get the same edge as your mobile-friendly competitors.

You'll also start noticing more 'mobile friendly' tags within search results on Google. Just one more thing to help you stand out and steal clicks from your competition.

Simple, Cheap Ways to Get a Mobile-Friendly Website

Responsive Wordpress Theme

If you're already using the Wordpress platform, upgrading to a responsive theme is the best route to go. I prefer to go through Theme Forest by envato, but you can also search for free themes in the Wordpress directory.

Check out my top 10 paid responsive Wordpress themes and top 10 free responsive Wordpress themes. I've hand picked these based on my own personal experience, user ratings, update frequency, and overall style. If you know of some other great responsive themes, I'd love to hear about them (always nice to offer my clients an extended range of options).

Hire a Freelancer to Update Your Existing Website

Not too long ago, getting online work done involved lots of money and retaining a large web design company. In the past several years, things have changed dramatically. Now, there are plenty of incredible freelancers who you can hire on a project by project basis at considerably reduced rates when compared to retaining a firm.

Sometimes it takes a bit of weeding through the junk candidates to find the perfect freelancer, but they're there. I'd recommend ElanceoDesk, or Freelancer. All of them are fairly similar and boast a huge community of excellent web designers.

If you're going with something extremely basic, and just need a web presence, there's also Fiverr. There are people on there who promise to make you a website for just $5. I can't vouch for them personally, but at $5, it's not the end of the world if they don't work out. I presume, you'll need to provide all of the content, have an understanding of web hosting, and be able to make adjustments after they get you up and running.

Use an Online Website Builder

Personally, I'm not a fan of the online website builders because they're extremely limiting and can quickly get expensive when you attempt to do anything beyond their most basic design layouts.

However, if you're only looking to get something online as a launching point before going bigger in the future, you can certainly test out the likes of Wix or Weebly.

Tools and Resources for Mobile Web Design

Here are some great tools to use throughout the process of designing your mobile-friendly website:

Webmaster Tools - Mobile Usability Errors (requires a Google Webmaster Tools account)

Within Webmaster Tools, there is a section under "Search Traffic" called "Mobile Usability." Here, you'll find any URLs that Google considers unfriendly on mobile devices and a list of reasons why each particular page was flagged.

Mobile-Friendly Test

Use Google's online tool too see how the search robots view your webpages on a mobile device and get feedback for improving the design and layout. You'll get an immediate, clear answer; either, Google thinks your site is mobile-friendly and you'll be good to go on their search rank update, or you'll see something along the lines of "not mobile-friendly," get to work improving.

Google Analytics

It'd also be a good idea to keep track of how many visitors are reaching your site on a mobile device and watch the "behavior flow" of those phone users from landing page to exit. Figure out what the top landing pages are, the most clicked on content, and determine what can be done to improve their experience, keeping them on the site longer and driving sales/contact.

Know Someone Who Should Read This Entry?

No Salesy Spam. Just Great Articles Like This One Delivered To Your Inbox.