preloading font with rel preload

Question

I am preloading a font using the HTML tag with the rel attribute set to preload as captured in the snippet below;

<         


        

Answer 1

Your preload-Tag takes the argument "crossorigin", which must be given for Webfonts, even if they are on the same host as your website.

See https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content#Cross-origin_fetches or https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/#early-loading-of-fonts .