Stay organized with collections
Save and categorize content based on your preferences.
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.