Have you received a warning from Google saying
You can’t ignore this as it may cause mobile usability issue and you may lose ranking. If you have an eCommerce website then this is even more important, to ensure you have one transaction, the user generally visits a number of pages. Any mobile usability issue leads to conversion reduction, higher bounce rate and overall poor website and business performance.
Let’s learn how to fix these issues.
Clickable Elements Too Close Together
You will get this warning when you have a real usability issue, especially on the mobile device where if links or actionable items may be too close which can make it difficult to use your website.
How to fix clickable elements too close together in WordPress or other website platforms?
Now, if you see the links in the above image, you will are very close together. Here is how you can fix this.
Step 1: Right-click on the link and click on Inspect in Google Chrome as shown in the image below:
Step 2: Increase the line height and see if that is good enough.
Step 3: Apply changes in the CSS file.
WordPress Back-end >> Appearance >> Theme Editor >> Load style.css
Search for the line and apply changes.
Warning: You should always take a backup if things don’t go as planned to change back.
Content Wider Than Screen
You will receive the warning “Content wider than screen” when some of your content may not fit within the screen of mobile and user may need to scroll left to right to view the content.
It can happen due to a YouTube video embed where you may not have set the correct CSS style to fit the video within the screen. The simplest way to fix it by setting the width to 100%. See examples below.
It can also happen when you may upload an image that might be crossing the mobile width, you must apply the right CSS coding to fit the image correctly.
How to fix the image going wider than the screen on mobile?
Either set the image width to 100% or apply an appropriate CSS style to fit within the screen.
<img src=”image-path” alt=”” width=”100%” />
It can also happen with tabular data when you may have too many columns which may not fit on the mobile screen.
Text Too Small To Read
Your content should be designed to be read by all ages. The current trend to be nice and bold.
If your text is too small then increase the font size and re-submit to Google.
