Table of Contents
After saving your changes and running the optimization (
Save & Optimize) the Optimize Local Fonts section will be populated with detected Google Fonts:
Font Family and Stylesheet handle
The first row of every section contains the stylesheet handle, which is stated by the theme and/or plugin developer.
On the next row, the first column contains the name of the Font Family (e.g. Jost, Martel, Roboto, etc.) followed by a few mass actions. These will help you to configure the stylesheet quicker.
Style
Displays the style for a font variation, e.g. italic or normal.
Weight
Displays the weight of a font variation, e.g. 300, 500 or 700.
Load Early (one of OMGF’s most important features)
Check this box to
preload this font variation. Preloading a font file will result in the file being loaded before everything else is loaded and will remove the Preload key requests optimization suggestion on Google PageSpeed Insights, effectively increasing your score.
Properly configuring font preloads will reduce Cumulative Layout Shifting by removing FOUT (Flash Of Unstyled Text) and will help eliminate render blocking resources.
Don’t Load
Check this box to not load this font variation. If the font variation is not used anywhere, but still loaded (by e.g. a plugin) it is advised to not load (unload) the font using this option. When all boxes of one stylesheet handle are checked, the stylesheet will not be loaded at all.
Fallback Font Stack (Only available in OMGF Pro — default: none)
OMGF Pro features 31 available fallback system font stacks to reduce Cumulative Layout Shifting caused by Google Fonts.
(List with visual examples, coming soon…)
Use the
Font Style Matcher to find a system font which matches closely with your Google Font. This will improve User Experience (UX) and reduce CLS when configured correctly.
Replace (Only available in OMGF Pro — default: off)
In addition to configuring a
Fallback Font Stack to “back up” your Google Fonts, you can replace Google Fonts with system fonts entirely! Besides completely eliminating CLS caused by fonts, this will reduce your page size and effectively, page loading time.