In this article:
- How to tell if your site is mobile-friendly
- DIY steps for making a site mobile-friendly
- Optimizing your online presence
Have you ever visited your business’s website on your smartphone, tablet, or other mobile device? If you haven’t, you should. It’s good to see what the user experience is like for your customers from a mobile device, especially since over 50% of website traffic comes from mobile devices.
When you load your webpage on your mobile browser, what is the experience like? Can you easily find important information? Or is it difficult to navigate between pages? Are there weird layout issues, missing images, or problems with navigation?
A good mobile experience on your website is important for getting new customers online. Generally speaking, the majority of your customers probably do a quick search on their phone when looking for a new service or products that you offer. And if they can’t figure out how to use your website from that first visit, they’re likely to go somewhere else.
So, how can you make your website more mobile friendly?
How to tell if your website is mobile-friendly
Before you take the steps to make your website mobile-friendly, find out if it already is. The very first thing you can do is visit your own website from a mobile device. Click through the pages of your website, scroll down each page, click on buttons, and test out forms and links to see if you come across any problems.
Make a note of any sticky places that you run into. Be sure to note your device and the web browser you are using. Some may cause issues and some may not.
There may be some items that you can fix on your own, and some things may require additional support from a web developer.
Another thing you can do is run your website, or a specific page on your website through Google’s Mobile-Friendly Test.
Visit search.google.com/test/mobile-friendly, and enter any URL from your website into the field to test it.
It may take a minute or two to return your results, and this test will then tell you if that page is mobile-friendly.
If your page is deemed not mobile-friendly by Google, they will provide you with additional resources to help make your site mobile-friendly. You can then use these tips to update your website, or hand them off to a web developer.
DIY tips for making your website mobile-friendly
Don’t think that you need to use a professional web developer to help make your site more friendly for mobile users. There are plenty of things that you can do on your own (without knowing or understanding coding) to help enhance this experience.
We’ll discuss several things that you can do here:
- Responsive content management system
- Legible fonts
- Simple navigation
- Simple design
- Optimize images
Use a responsive content management system
It all starts with the platform that your website is built on. If you did your own website through a low-cost or free website builder like Wix or Squarespace, then it’s likely that your website is already responsive.
What this means is that your website adapts to various screen sizes by resizing and adjusting placement for text and images.
Start from a website builder that already has that “responsive” or “mobile-friendly” web design built into its platform so you don’t have to worry about getting a developer’s help with this.
Use legible fonts
As much fun as scripty, swirly fonts are, they can be difficult to read, especially when they shrink down on a phone. Choose standard fonts for your website and use a font size of at least 14 px for the body content on your site.
Standard fonts usually come with your website builder, so try clicking through your font options to see which you like best, and then preview what it looks like on a mobile device. You can do this by pulling up your site on your phone or changing the size of the window that you are viewing your website in.
Keep your navigation simple
The navigation of your website is the menu that customers use to click to different pages on your website. On a desktop or laptop, the navigation generally spreads out across the top of the screen, but on mobile devices the navigation often shrinks down to what we call a “mobile menu.” This is the little hamburger menu icon that appears in the corner of your screen.
And when someone clicks on that icon, it brings up your full menu. But if this menu has tons of items on it and large dropdowns, navigating the site can quickly become overwhelming.
By keeping your navigation simple, with 4-6 items and minimal dropdowns, you can provide a more friendly experience for your visitors.
With DIY website builders and easy-to-use content management systems, you generally have control over this and can edit your menu from the dashboard of your website editor.
Keep your design clean
Along with a simple navigation, the design of your website should be fairly simple, too. That doesn’t mean that it has to be a bland page with little to nothing on it, but it should be well-organized and have a simple flow to it.
Don’t overwhelm your visitors with tons of overlapping imagery, flashy animations, and buttons all over the place. Keep it simple so that your visitors can scroll down a page on their phone without becoming overwhelmed and not knowing where to look first.
Optimize your images
One of the biggest problems that can make websites unfriendly for mobile devices is large images.
Images that have a large file size can take a long time to load, and this can leave large portions of a webpage blank, or even keep the entire page from loading for several minutes.
To avoid this problem, you can easily optimize your own images before putting them on your website. Optimizing your images simply means resizing them and compressing the file size.
You can upload your image to an online photo editor like PicMonkey or Pixlr X to resize it. You can generally resize your image down to 1920 pixels wide, and that will be large enough for any place that you add it to your website.
As soon as you upload an image to Pixlr X it will give you the option to “Pre-resize” it, and one of the options is set to 1920 px. You can choose that option and then save your image and continue to compressing it.
Once you’ve saved your resized image, you can then compress the file size of it by uploading it to a site like TinyPNG. It will compress your image within a few seconds, and then you can download your new smaller file and upload that to your website.
Each of these steps will contribute to a better mobile experience for your customers, and if you need further help or you aren’t fully satisfied with your website on a phone, there are additional steps that a web developer can help you with.
Get more visitors to your website by optimizing your online presence
When you’ve finished making your website mobile-friendly, make sure that you are taking all of the steps you need to get optimize your online presence and local SEO to drive more visitors to your website—whether on a computer or mobile device.
Solo is the easiest way for small businesses to pay and get paid.
Join our waitlist and get early access for your chance at securing the best @solotag.