When you perform a mobile-friendly test on your web page, it shows “your page is mobile-friendly“. But when you validate affected URLs, It may result as “your page is not mobile-friendly“. This article will discuss how to resolve mobile-friendly test issues.
Initially, I got the same error with my mobile pages and checked many solutions on the internet, but I found that the current mobile test is not working properly. But this is not the truth; the tool is working properly. Let’s understand the reason for the issue and how to fix it.
Your page is not mobile-friendly in the mobile usability test.
This error occurs when you check your webpage for mobile-friendliness. And it is all because your page may not use a mobile-friendly theme, or your page content is wider than the screen.
If it is the first case, please use a mobile-friendly theme, and for the second case, please review your content by visiting the site from your mobile device. Check whether it is wider than the screen or not. If there is no such issue, then follow the guide below.
In case if you’re using pop-up windows, then it may be possible that the pop-up window you’re using is of fixed size for both mobile and desktop versions. In this case, your page is not responsive due to that pop-up only.
If you are not using a responsive theme or missing the viewport meta tag, this could be why. You’ve to implement the following code in between
<meta content='width=device-width, initial-scale=1, minimum-scale=1' name='viewport'/>
The robots.txt file blocks resources.
This error occurs when your page is mobile-friendly for all the devices but not for google bot. Unfortunately may lead to a loss of mobile users of the website. In other words, it affects the organic traffic of your website.
This is all due to the robots.txt file of your website. The functions of the robots.txt file are to control the web crawler to allow or disallow the section and provide the sitemap path. The current robots.txt file blocks the web crawler from accessing the page resources like JS or CSS files. That is responsible for a responsive website, and robots.txt prevents the resources, resulting in the page not being mobile-friendly.
How to fix this issue?
For this, you’ve to make changes in the robots.txt file of your website or blog. In WordPress, the robots.txt file may not permit the crawler to crawl JS or CSS or even the wp-content page. If you recently made changes with WordPress’s default robots.txt file, please revert all the changes. You can also apply the default robots.txt file.
The Default robots.txt file for the WordPress
User-agent: * Disallow: /wp-admin/ Allow: /wp-admin/admin-ajax.php Allow: / Sitemap: https://example.com/sitemap_index.xml
After changing the robots.txt file, please validate the mobile-friendly page error. Then, you’ll get a message of a successful operation.
In the above robots.txt file, you allow the crawler to visit all the sections of the blog or website. That may cause duplicate content issues. To avoid this and boost the SEO of WordPress, install and set up Yoast SEO Plugin or Rank Math SEO plugin.
The page is Mobile-Friendly initially, but after validation shows the same error.
If this is the case, when you check your page for Mobile-Friendly Test, the results show Your Page is mobile-friendly, and when you start validation of the page for errors in the Google Search Console. But still, after a few times, you receive an email states that the problem is not solved.
Now first, we’ve to understand the problem. Which section is wider than the screen after the validation result? Is your webpage support AMP? Then you’ve to check whether your AMP page has issues?
Perform Mobile-Friendly Test for Google
In the above case, you’ve to check mobile friendly you can’t perform Mobile-Friendly Test, as that fails later. Here you can perform a live site test that will display what would be the final result. You can try it by disabling the AMP page and also after enabling AMP pages.
When you perform the above test for mobile usability in Google Search Console, it will give you the final result that you may expect. Suppose you got errors with the AMP-enabled page and no error after disabling AMP. In such a case, try changing CSS for the object, causing the AMP version’s errors or disabling the AMP for the particular page.
The resource couldn’t be loaded, other error.
If the above two methods failed for you, then this could be the reason. The website breaks the connection for Google bots.
In such a case, contact your hosting provider to increase the connection time out or request time out at least 60 seconds for your website. That means the connection can stay for 60 seconds at least for a session to load all resources.
In this tutorial guide, we understood how to solve the mobile-friendly test issue of your website. The methods we discussed are:- page is loading pop-ups that are not mobile-friendly, resources are blocked by robots.txt file, AMP issue, and server timeout error.
I hope this article helps you in fixing the mobile-friendly error for Google Search Console. In case of any doubt, feel free to ask in the comment section provided below. Thank you.