We’re closer to 2017 than 2015 right now, and at this point, it’s almost a certainty that you know your website needs to be mobile-responsive. If you’ve never heard the term before or simply haven’t had the chance to update your site since this quality became essential about three years ago, this article is for you.
What is a mobile-responsive site? Simply put, it’s a website that looks great and functions well on any device — no matter if you’re viewing it on a large computer monitor, a Samsung Galaxy S7 or an iPhone 4.
Why is having a mobile-responsive site absolutely vital to online success? Read on to make sure your business is prepared for mobile searches.
The Google Change that Sparked a Trend
Back on April 21, 2015, Google released an update to the way they generated results for search queries, giving heavy preference to mobile-friendly sites and penalizing those which did not have a responsive website. This update had such significant impact on search engine rankings that it has been referred to as “Mobilegeddon” and “Mobilepocalypse.”
Even if you don’t get the majority of your traffic from “organic” rankings (non-paid results from Google or another search engine) and you’re not worried about losing traffic from search engines, you’ll still want to ensure your site meets current standards.
The number of people utilizing mobile devices for search has climbing for several years now, and in the last year and a half, it finally beat out desktop traffic. It was predicted to surge to at least 50% of all web traffic in 2016, and as of this February, it was already up to a whopping 56% of all traffic.
Ensuring your users have a great experience on your site is easy — just make sure your site is responsive so they don’t have to utilize the cumbersome navigation techniques that were required a couple of years ago. Remember “pinch and zoom” — the way you used to have to navigate your way around a web page?
Does My Site Pass the Test?
It’s pretty easy to test out if your site is mobile-responsive — just pull it up on your cell phone and take a look around!
Is it sized for your mobile device (the particular phone or tablet you’re using)? Do you have to scroll left or right to view the whole site or must you pinch to zoom? Or is the site easily visible on your phone or tablet?
One site that’s nailed this aspect of responsive design is Swiss hotel Badrutt’s Palace:http://www.badruttspalace.com/
Does it have a mobile menu — a menu that drops down, with plenty of space between each button, rather than making you try to click a link that is too close to others?
A great example of a mobile-friendly menu can be found on https://molekule.com/
Does it pass Google’s mobile-friendly test? Go to https://www.google.com/
If you don’t have your phone to hand, you can also pull up your site on your computer and follow these quick steps:
1. If the browser (internet) window is in full-screen mode, click the middle of the three sizing buttons (between “close” and “minimize”) on a pc, or click the far right of the three sizing buttons on a Mac to make it smaller than full screen.
2. Drag the edge of the browser window to one side, making the window smaller. As this window gets smaller and smaller, a mobile-responsive site will adapt and change to fit the size of the window, whereas a non-responsive site will not.
A non-mobile site will simply begin cutting off once the window becomes smaller than the full site, and you’ll have to scroll left or right to view the entire site.
At the beginning of the mobile craze, many businesses simply built two sites — one for computers and one for mobile devices. If the smaller version of the site you’re seeing is quite (or completely) different than the desktop version (what you see on the full-size computer screen), it’s mobile-friendly, just not mobile-responsive.
Having a mobile-friendly site is extremely important but it’s usually not enough anymore. Google prefers sites that are fully mobile-responsive. That means that they were built with responsive web design so that the overall design of the site stays the same, no matter what your device or screen size, but the site smoothly adapts to fit your screen size.
Here’s the final step you can do to tell if your site is mobile-friendly or fully mobile-responsive:
3. Leaving this first window open, open a second, full-screen window with your site on it. Compare the two versions — the smaller, mobile-sized window and the full-screen window — and determine whether or not they are the same site, sized accordingly, or two separate sites.
If you are seeing two different sites, it’s time to get a mobile-responsive site.
We hope this helps you. (Reprinted with permission: Visual Edge Design)