The first time I heard the concept of designing a website for “mobile first” it sounded like a gong in my head…
Yeah! Mobile is where the web is going…
There are so many people reading blogs, checking email, and even buying products on their phones and tables every single day.
But even though mobile-friendliness is kind of old news now (the big roll-out from Google happened in April, 2015), the mobile friendly-ness of your website is still largely left up to you as a website owner.
You can design a website any way you’d like, but if it doesn’t resize well to fit the various screen sizes of your mobile visitors, Google is taking note…and your organic reach is being jeopardized.
With the May 2016 update (details from Google here), mobile friendliness continues to maintain a high priority status for all of us online business owners.
Why? Because a significant portion of our audiences are visiting on their phone or tablets.
So, of course, we place a huge priority on the mobile-friendliness of each website component – from sidebars and membership sites to a mobile popup plugin.
Fortunately, there are a few different tools (free ones, too!) that can really help to pinpoint the areas that need improvement in a website.
Webmaster Tools
If you’re signed up for Google’s Webmaster Tools account (now called “Google Search Console”), you might already be receiving Google’s helpful “warnings” for your site…
Here’s one I received for one of my older websites:
Fix mobile usability issues found on Your Website
Google systems have tested 288 pages from your site and found that 100% of them have critical mobile usability errors. The errors on these 287 pages severely affect how mobile users are able to experience your website. These pages will not be seen as mobile-friendly by Google Search, and will therefore be displayed and ranked appropriately for smartphone users.
So what does this warning mean … and what should you do about it if you received one?
First, if your site isn’t registered with Google’s Webmaster Tools, you might want to do that now. It’s a way of playing with with Google and making sure there aren’t any errors with your site.
Mobile Friendly Check Tool
But whether or not you received this message from the Big G, you’ll want to run your website through this Mobile Friendly checkup tool.
Click here to run it on your website now.
From doing this quick mobile diagnostic, you’ll be able to see at a glance if Google considers your website to be mobile friendly or not.
This is a great tool because it also specifies what portion of your site is lacking in mobile responsiveness, so you can address the issues right away.
How Having a Mobile Friendly Website Helps Your Search Engine Rankings
Why is making sure your site is mobile friendly suddenly such a high priority? Because Google now ranks mobile responsive websites (those that resize automatically to different sized devices used by visitors) higher than non-responsive sites.
Think about this way:
You’re searching for a quick answer to an argument you’re having with your spouse about something geeky… (admit it, I’m not the only one!) and you’re using your phone or tablet.
You don’t want to click over to a search result, then have to pinch the screen and turn your device every which way, squinting just to see who’s right and who’s wrong.
As a simple step towards making things more user-friendly, Google is unprioritizing sites that are not mobile friendly in their search results… and ranking mobile friendly sites higher.
This is good news if your site is already mobile responsive, and it’s a good motivator to get your site mobile friendly if it isn’t yet.
Not only will it help your site show up more in the search results on Google, but it will also make your visitors’ time on your site more enjoyable when they’re browsing on the go.
How To Make Your Site Mobile Responsive
I’ve written in the past about checking how your site looks on different browsers and mobile devices, but the big question is how do you make your site responsive to different screen sizes?
There are a few WordPress plugins that claim to make your site into a mobile version of itself… but they tend not to be the prettiest looking.
Use A Responsive Theme
The way that we’ve been handling mobile website building is to use a mobile responsive option. It’s just a matter of checking off this setting, and making a few adjustments and you’re good to go.
Or you can pick any truly responsive WordPress theme, keeping in mind that there are a few that claim to be responsive but aren’t, so definitely do your research before picking one!
Employ Web Designers Who Know What They’re Doing
At AccessAlly, we also sometimes write custom CSS code for more complicated pages on our sites, where we know we either want the sidebar to be removed on mobile device, or if we want resized boxes to stack a certain way, for example. This is a little more tech-y, of course, but it’s totally doable for a web designer who knows what they’re doing!
Use A Mobile Friendly Popup
One thing that we’ve learned about mobile web design is that it’s important to be proactive… and the same goes for when you’re designing things like opt-ins and mobile popups.
This might sound like a tiny detail, but…one of the things I’ve noticed while browsing websites on my phone is that most of the time when your site resizes for mobile the text is readable, without too much work.
But the thing that tends to degrade quickly on a mobile responsive website is the ability to have people opt-in to your email list. And if you’re trying to grow your email list, a missing opt-in is NOT going to be good!
So don’t let your opt-ins get too hard to read, or simply removed on the mobile version of your website. (Or even worse, a non-responsive popup can annoy your visitors because the pop-up can be too large to close and can block your site’s content entirely. Yikes!)
That’s why in our latest release of PopupAlly Pro, we’ve introduced fluid templates – with the ability to design different popups and opt-ins for different screen sizes.
We do all the heavy lifting for you, so all you need to do is polish up the resized versions of your opt-in or popup so it looks awesome on a smaller screen.
Take a look at the quick demo video of this mobile friendly popup feature in action below:
After that, with all the traffic you’ll be getting from the search engines (who are really digging your mobile friendly popup), your priority is to keep collecting those emails so you can follow up with these new fans and visitors.
Over To You Now
I’d love to know if your site passed the mobile friendly test or not? Do you have a quick solution for making a website more mobile responsive?
I’m happy to have the website designers and developers in the house leave a comment below too, so people who are looking to hire can find them.
