Google Fonts Options?

  • Resolved multimastery

    (@multimastery)


    6 years, 4 months ago

    Hi, so far seems like a very helpful plugin, but I’m confused on the best option to load Google fonts.

    These are the choices I see under the ‘Extras’ tab:

    – Leave as is
    – Remove Google Fonts
    – Combine and link in head (fonts load fast but are render-blocking)
    – Combine and preload in head (fonts load late, but are not render-blocking)
    – Combine and load fonts asynchronously with webfont.js

    Please advise on the best option to use. And what exactly is the “leave as is” option doing?

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    I removed them myself, but if you’re into fonts then “Combine and preload in head (fonts load late, but are not render-blocking)” is the best option in my opinion.

    hope this helps,
    frank

    Thread Starter multimastery

    (@multimastery)

    6 years, 4 months ago

    Well what happens when you remove them? I guess that’s the deciding question.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    a browser-native font is used instead, most often also specified as fallback in the theme’s CSS.

    Thread Starter multimastery

    (@multimastery)

    6 years, 4 months ago

    Ok well I’m wondering how these “browswer-native” fonts look? Kinda hard to make a descision whether to use them or not if I don’t even know how they’ll make my site/page look.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    tick the option and check out how it looks? 🙂

    Thread Starter multimastery

    (@multimastery)

    6 years, 4 months ago

    Okay I checked ‘remove Google fonts’ and although it was ok I just really didn’t like the way it looked on my site.

    So I set it to the other option that you’ve suggested: “Combine and preload in head (fonts load late, but are not render-blocking)”, but now I’m wondering how to avoid the whole FOIT issue that’s reported in Google Pagespeed Insights (it also reports that issue even when I used the setting “Leave as is” so I’m kinda confused on this.
    https://web.dev/font-display/?utm_source=lighthouse&utm_medium=unknown

    • This reply was modified 6 years, 4 months ago by multimastery.
    Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    AO 2.6 (out later today) adds display:swap which should help.

    Thread Starter multimastery

    (@multimastery)

    6 years, 4 months ago

    Well I’m still getting reports under “Ensure text remains visible during webfont load” so unfortunately doesn’t seem like that change helped.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    Can you click on that recommendation to see which fonts are mentioned there?

    Thread Starter multimastery

    (@multimastery)

    6 years, 4 months ago

    Ensure text remains visible during webfont load
    Leverage the font-display CSS feature to ensure text is user-visible while webfonts are loading. Learn more.
    URL
    Potential Savings
    …fonts/slider.woff?8p86w5(bulkcomments.net)
    260 ms
    …fonts/feature-background.woff(bulkcomments.net)
    50 ms
    …font/elegantline.woff?map0iz(bulkcomments.net)
    50 ms
    …fonts/fontawesome-webfont.woff2?v=4.7.0(bulkcomments.net)
    260 ms
    …v17/mem8YaGs1….woff2(fonts.gstatic.com)
    20 ms

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    6 years, 4 months ago

    well, of those five only the last one is a google font one, and based on your site’s HTML it’s not from the autoptimize optimized google fonts call either but from fonts called from javascript in your pricing table.

    so for the non-google font files you’ll have to ask the plugin (or theem) developers for display:swap support, for the opensans google font ones supsystic might be able to help.

    hope this clarifies,
    frank

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Google Fonts Options?’ is closed to new replies.