This must-have checklist will help you to make your website mobile friendly so it rocks for ALL visitors, including those on their phones.
Sure, your website looks extra awesome when you view it on your desktop or laptop computer … but have you looked at it on your phone?
Like, really looked?
If you haven’t – fear not – for that’s exactly what today’s blog post is all about.
Depending on your industry and your audience, a large percentage of your users may be checking you out from their “pocket computer” – and if this is the case, you want to make absolutely sure their user experience is JUST as amazing as the one you’ve set up for your desktop users.
Let’s make your website mobile friendly once and for all.
Below are ten questions to ask yourself as you look over your website from your mobile device.
And the cool thing? You can do this right now, from wherever you are.
1) What’s “above the fold”?
In the web design world, we call content that appears on your homepage right away without having to scroll down “above the fold.” Ideally, you want to have your site title, navigation, primary message, and a call-to-action all visible in this area. Check out my post What Does Above the Fold Mean in Web Design? 5 Tips to Rock it for more on this topic.
2) Is it easy to navigate from page to page?
If you’re finding you have to manually scroll all the way back up to the top of each page every time you want to access the main menu, you’ve got a problem. Solve this with either a “sticky menu icon” that stays floating in the upper right corner or a “jump to top” upward arrow in the lower right corner that takes a user to the top of the page from any point. Three Navigation Quick Tips will give you even more ideas.
3) Is the body text large enough to read?
Your font should be large enough to see and read easily for eyes of all ages (especially if you know your audience falls into a higher age demographic). My opost Fonts 101 is the ultimate guide if you feel like digging in deeper.
4) Are the headings an appropriate font size?
A common mobile experience pitfall is headings being COMPLETELY GIANT, making them overwhelming and less effective. You want your headings on the mobile view to be proportionately larger than your body text, but not so big that they contain words that can’t complete on one single line.
5) Are there any annoying popups?
While popups can sometimes work well on desktop versions of websites, I generally advise against using them in the mobile view. The reason for this is that on the desktop view, a popup might only take up 20% of the screen, whereas on the mobile view, the popup most likely takes up 100% of the screen, in essence completely interrupting and taking over the user’s experience. In short, it’s annoying.
6) Do you have to pinch to zoom at any point?
If you have to pinch and zoom at any point to read a piece of text or view an image that’s impertinent to the overall message, you need to adjust your sizing. Make it easy for people.
7) Does your website load within a few seconds?
Pop quiz: how many seconds is your audience’s attention – sorry, what was the question? 😉 If your website takes more than a few seconds to load, try reducing your image sizes, your number of plugins, or talk to a website person for assistance. (If you’re feeling brave, enter your URL in Google Page Speed Insights and find out your official score!)
8) Does the content flow down the page in an order that makes sense?
If your desktop version of your website includes two- or three-column layouts at any point, those columns most likely turn into one single column on mobile view, and as such you need to make sure that those single columns appear in the order that makes the most sense.
9) Are phone numbers linked to click and call?
Any phone numbers listed on your website need to be linked so that if someone clicks that phone number while they’re on their phone, they are taken to their phone app and are calling you right away. Make it easy for people!
10) Are your buttons large enough?
On the desktop view, people are typically using a mouse which makes it easy to click buttons. On the mobile view, they’re using their thumb or forefinger to navigate, so buttons need to be extra wide. Ideally, make any call-to-action buttons on your mobile view 100% width so they’re easy to see and easy to click.
I hope these 10 tips will help you to make your website mobile friendly and create an awesome user experience for your audience, whether they’re checking you out from their computer, from their tablet, or from their phone.
