Why does this matter?
Mobile-friendly websites are one of the most important things you can do for your website. So many visitors look at your website on their phone at some point. And search engines give preference to websites that work well and look good on mobile devices.
#1: Keep your images small
When someone goes to your website, they load the website’s resources. Desktops and laptops tend to be connected to faster internet (WiFi), while phones tend to be connected to the cellphone provider’s service. It’s important to keep your images small because it’s the easiest thing you can do to optimize your website and minimize the resources loaded.
There are tons of things you can do to help with optimizing websites for quick loading, but keeping images small is the easiest thing to do and is the most often updated and added to websites. You add content more often than you edit the CSS or JavaScript.
And the problem with images is that they get big. Really big. The images you take on your phone, for example, are gigantic. It doesn’t seem that way because of the screen size you’re viewing them on, but the dimensions and file sizes are huge, which can be draining on data and load time.
Learn how to keep your images optimized in this free guide.
#2: Don’t load anything that isn’t needed
This item, like number one, falls under the blanket of quick loading. And while things can get techy when it comes to this item, there are things that you can do without having to deal with anything super complicated.
Not loading things fall under two categories: keeping resources light and making the most of the limited real estate. You don’t just take your website and smush it. There are things that are great on desktop that just don’t look right on mobile.
A lot of page builders and website builders have come a long way. It’s become much easier to hide things that aren’t necessary on mobile devices. And if it’s a really good builder, it won’t just hide the elements, it won’t load them at all. But at the very least, hiding those items prevent the page from jumping around while loading.
For maps, unless the map serves some kind of functional purpose, you shouldn’t need to embed the map when a screenshot and link will serve the same purpose with much less to be loaded. For videos, embedding isn’t as much of a concern. In fact, it’s much better to embed a video from somewhere like YouTube or Vimeo, since they already take considerations for mobile.
#3: Make your contact info easily accessible
Visitors on mobile usually have something specific they’re looking for. It’s usually contact info, your hours, or some kind of specific service. They want it right then and there.
And on a phone, if you link to a phone number or email, it opens directly in their chosen default app. These things can sometimes be a little clunky on desktop, especially email, since many people access their email in a browser rather than in an application.
Your main call to action should be a specific and straightforward way to contact you. On mobile, you’re going to want to use the real estate wisely, so give the visitor what they’re looking for (an easy way to contact you). And utilize mobile features to do it.
#4: Minimize distractions
Popups are effective even though my personal opinion is that they’re a nuisance. But on mobile devices, you have to be completely sure about them. There’s enough space on desktop. You’re drawing attention to this thing you’re getting the visitor to do or know about. On mobile, the popup takes up mostly the whole screen. Knowing where to close or click is really awkward.
You should have multiple places on your website that brings in leads. Whether that’s something at the top of the page or on certain pages or at the middle or end of a blog post, or even in the footer. So if you hide the popup on mobile, it doesn’t mean you’re not collecting leads at all. And popups should have ways to prevent them from showing every time a visitor goes to any page on your website all the time. So if someone has closed the popup, there should be other opportunities to remind them of your opt-in or other popup content.
If the popup is necessary or you feel strongly about it, you should make it clear and easy to dismiss it. So if you have a ton of content in your popup, try to minimize that content as much as possible to get it all to display on that initial screen to minimize scrolling inside the popup.
#5: Test your website on your phone
Do you have a bunch of icons with no content under them? Do you have a nice zig-zag layout on desktop that doesn’t resize correctly? Are your images scaling correctly and not popping out of the side of the screen? If you can move your finger left to right, something is pushing the page too wide. Do your headings resize or do they stay huge and cut off words or split them in half?
There are ways to check the mobile layout of your website in your browser. The most common way is to make your browser window as narrow as possible to test the responsiveness of the website. This can be a great way to do any initial testing or to try things out while you’re working on the site or adding content.
But nothing can replace testing on an actual device. Send it to your mom. Send it to your cousin. Send it to your best friend. Maybe they even have a different phone that you – bonus! Another set of eyes will help you see things you don’t.
Make sure you’re checking things like form fields (email, phone, number, and text all bring up a different type of keyboard on mobile devices) and making sure click areas are large enough (for things like buttons, slideshow arrows, and other clickable things).
You can always ask for help or search for answers when something needs to be adjusted, but if you don’t know it’s broken, you can’t fix it.
Finishing Up
Everything in this list should be easily fixable on whatever platform you’re using. It should be easy to address and shouldn’t take you very long. If it does seem to be taking forever, it might be a sign that you need a different theme, or that it’s a bigger issue that someone might need to help with.
You’re not building the next award-winning website, you’re just trying to make sure that it looks good and professional. Because no matter what industry you’re in, attention to detail is important in some way. You can do this using builders, themes, or with custom code.
And as you change things or add content and pages to your website, make sure you go back and look. Sometimes things change and you don’t realize it. The most important thing is to not just make your website mobile-friendly but to keep it that way.