Document doesn't use legible font sizes
Many search engines rank pages based on how mobile-friendly they are. Font sizes smaller than 12 px are often difficult to read on mobile devices and may require users to zoom in to display text at a comfortable reading size.
How the Lighthouse font size audit fails #
Lighthouse flags pages with font sizes that are too small to read easily on mobile:
Lighthouse flags pages on which 40% or more of the text has a font size smaller than 12 px. When a page fails the audit, Lighthouse lists the results in a table with four columns:
| Source | The source location of the CSS ruleset that is causing the illegible text. |
| Selector | The selector of the ruleset. |
| % of Page Text | The percentage of text on the page that is affected by the ruleset. |
| Font Size | The computed size of the text. |
How to fix illegible fonts #
Check font sizes in your CSS. Aim to have a font size of at least 12 px on at least 60% of the text on your page.
How to fix a missing viewport config #
If Lighthouse reports Text is illegible because of a missing viewport config, add a <meta name="viewport" content="width=device-width, initial-scale=1"> tag to the <head> of your document.
See the Does not have a <meta name="viewport"> tag with width or initial-scale post for more information.
Resources #
Source code for Document does not use legible font sizes audit