This post may contain affiliate links, I receive a small commission if you make a purchase with this link.

Fix Mobile Usability issues on your website

This article explains how and why to fix mobile usability issues on your website. The why is simple, google will penalize your website if you don’t.

You could have content that’s amazing – sparkling text, comprehensively researched, stunning images and well formatted text. Unfortunately, if you haven’t optimized for mobile devices, you ranking position could be much lower than you expected.

Prioritise finding and fixing mobile usability issues before writing more content. I’ll explain how in a second…

Table of Contents

Why do you need a mobile website for your business?

mobile phone outside

Everyone uses mobile phones today, you see people on mobile devices all the time. Wherever you go, walking, waiting for the lift, public transport even behind the wheel of a car!

Mobile devices are the main way people access the internet. That’s why Google uses the mobile version of your page for ranking and indexing purposes.


54%

of all website traffic worldwide is from mobile devices

Source: Blogging Statistics 2023


When people want information on a product or service or want to research a topic the first place they go is the internet – and specifically Google.

If your website is not showing up for relevant queries from potential customers you are losing business.

Having a mobile friendly website will improve your ranking position with Google and other search engines.

Reasons your website doesn’t work on mobile devices

Not getting the organic traffic to your site you expected? It could be your site just doesn’t work on mobile devices properly.

Common issues found on non-mobile friendly websites

Large Popups

Text too small

Images too large

Site too slow

Buttons/links too close to each other

You need to find and fix all these issues to improve your rankings. The next section we will get into how to solve these problems.

Okay, my page is not mobile friendly. What should I do?

The good news is fixing your mobile issues isn’t difficult. The first thing you need to do is test your website using the Google mobile usability test. This will provide a report on mobile issues found on your website.

You need to test not only the home page but specific article pages to find all the mobile issues you have. More on how to do a comprehensive check of your website later.

Take the Google mobile usability test

Take the test here: https://search.google.com/test/mobile-friendly

If the page doesn’t have any mobile issues you will see this result below:

Page is usable on mobile screenshot
Successful mobile usability test using the Google Mobility Test website

Only one page is tested, it’s possible you could have mobile issues on other pages even if you get the all clear from this test. Let me explain the possible errors you will get from the report.

Error #1: Uses incompatible plugins

Some technologies are old fashioned and not used in modern web browsers. A common technology that is incompatible with mobile devices is Flash. It should not be used on your website. If you need to animate parts of your website there are modern ways that are supported by mobile web browsers.

→ Use a modern, responsive, mobile friendly theme for your website

This site uses GeneratePress, read my review here: GeneratePress review: Fast WordPress theme in free and premium versions

Error #2: Content wider than screen

This error occurs when the user has to horizontally scroll to see your content. This provides a poor user experience and quickly becomes annoying to users.

Read more about size content from Google here: https://web.dev/responsive-web-design-basics/#size-content

→ Avoid using fixed width and position values on your page. Ensure images can scale to page size.

Error #3: Text too small to read

The font size on your website is too small to easily read. This will causes visitors to squint or have difficulty reading your content. Many users will abandon your page than try to continue reading.

You need to set a minimum font size across your website.

My website had this error. I fixed it by setting a minimum size of 16px for all elements.

→ Set minimum font size on all elements to 16px

Error #4: Clickable elements too close together

I also got this error for my website, specifically the social media sharing buttons were too close together.

The solution to this error is to add padding to all blocks that have clickable elements. Typically this will be navigation bars, footer links, sharing buttons etc.

You may need to make several adjustments and keep retesting to fix this completely (I know I did).

→ Add padding to clickable elements (navigation links, sharing button etc)

Error #5: Viewport not set

The page tested does not contain a viewport property that tells browsers how to scale a page for the screen size of the device.

This problem is caused by your theme. Most modern themes should set this property for your automatically. You should not need to set this property manually.

→ Change your theme – all popular themes will be mobile friendly by design

Error: Viewport not set to “device-width”

Similar to previous error. Again this problem will not occur with a modern mobile friendly theme. As above the fix is to change your theme.

Bing mobile friendly test

Check your page is mobile friendly according to Bing, important for ranking well in the Bing search engine:

https://www.bing.com/webmaster/tools/mobile-friendliness

Monitor mobile usability using Google Search Console

Use Google Search Console to monitor your mobile usability for free. From the left hand sidebar there is a Mobile Usability link. This page has two panels. The first panel shows the number of usable and not usable pages on mobile devices:

usable and not usable pages on Google Search Console
Usable and Not Usable pages according to Google Search Console

It’s very important when Google indicates that one or more pages are not usable that you find the issues and fix them. Mobile usability is a ranking factor and you will very likely see a drop in your ranking position until you have fixed and verified the issue.

As you can see from the image about I had mobile issues, once I fixed the issues I immediately verified the fix using Google Search Console again.

The second panel shows what mobile issues you have on your site. You can click on the issues to see exactly what pages have each issue.

mobile usability on Google Search Console
Mobile Usability page on Google Search Console

Once you have fixed the issue on your website verify the fix on Google Search Console.

If you have pending issues you will see each web page on your website with this issue listed. You can click on the “VALIDATE FIX” button. Google will then schedule a re-test of that page to verify you have fixed the issue.

You can click on “SEE DETAILS” button to see the status of any pages Google found issue with. The details page is shown below:

verify mobile issue is fixed on Google Search Console
Verify mobile issue has been fixed on Google Search Console

From the other tabs you can see PASSED, FAILED and OTHER.

It’s good to keep monitoring Google Search Console to ensure all your pages are mobile friendly.

Final Thoughts

What’s the bottom line?

→ Validate all your content for mobile friendliness. Fix any issues you find.

If you found this article helpful, please consider sharing it with your network by using the social media sharing buttons below. Thank you for your support!

Leave a Comment