Google Mobile Usability Issues
by John Vincent
Posted on March 26, 2019
How to resolve Google Mobile Usability Issues
Discussion about Google Mobile Usability Issues and how to resolve them.
To view the Mobile Usability, go to the Google Search Console, see Mobile Usability (middle of left nav).
Google Mobile Usability Issues
Received email from Google
Search Console has identified that your site is affected by 3 new issues of type Mobile Usability.
Top Issues (5 maximum)
The following issues were found on your site:
Text too small to read
Content wider than screen
Clickable elements too close together
To view the problem, go to the Google Search Console, see Mobile Usability (middle of left nav).
3 Issues are shown.
Content wider than screen
There are 4 URLs affected.
Study
The subpage-header.scss
was using a letter-spacing: 10px
for all screen widths. This causes some content to run beyond the width.
Solution
Add to subpage-header.scss
@media only screen and (max-width: 500px) {
#subpage-header {
.block {
padding-left: 0px;
p {
font-size: 16px;
}
h1 {
font-size: 30px;
letter-spacing: 1px;
}
}
}
}
@media only screen and (min-width: 501px) and (max-width: 767px) {
#subpage-header {
.block {
padding-left: 0px;
p {
font-size: 20px;
}
h1 {
font-size: 36px;
letter-spacing: 3px;
}
}
}
}
Too small to read
The font size for <p>
was 13px
, the probable cause of the trouble.
Solution
style.scss
p {
- font-size: 13px;
+ font-size: 14px;
}
Clickable elements too close together
4 URLs are affected.
This could be partially caused by the use of a too small font size, as noted above.
Solution
1 URL had consecutive links that were list items. They were very close. Added some space between them.
Google Search Console
From the console
- choose Mobile Usability
For each error type
- select error type
- for each URL, select URL
- Test Live Page
- Ensure Page is mobile friendly
When completed, for each error type
- select error type
- Validate Fix
For each error type, Received email from Google
We're validating your Mobile Usability issue fixes for site johnvincent.io
To owner of johnvincent.io,
Google has started validating your fix of Mobile Usability issues on your site. Specifically, we are checking for ‘Text too small to read’, which currently affects 1 pages.
Validation can take a few days; we will send you a message when the process is complete. You can monitor the progress of the test by following the link below.
In time, received emails from Google stating the problems had been resolved.
With the resolution of these issues, it is entirely likely Google will search more pages and thus find more issues.