Menu
the last time i was building a website was back in 2007 and using custom fonts was a pretty ugly thing. Back then the most people went with some flash applets or PHP scripts that generated images.
Well, its 2012 now and i am sure people are using other techniques now. I found a lot of different stuff online, from "Google web fonts" to "CSS3 font-face" - but i am not sure what best method is.
So tell me, what is the best way to go when using custom fonts?
251
There are a variety of ways in which web fonts impact performance: Delayed text rendering: If a web font has not loaded, browsers typically delay text rendering. In many situations, this delays First Contentful Paint (FCP). In some situations, this delays Largest Contentful Paint (LCP).
Thus, best practices for font loading generally focus on making sure that fonts get loaded as early as possible. Particular care should be given to fonts loaded from third-party sites as downloading these font files requires separate connection setups.
A system font is the default font used by the user interface of a user's device. System fonts typically vary by operating system and version. Because the font is already installed, the font does not need to be downloaded. System fonts can work particularly well for body text.
A system font is the default font used by the user interface of a user's device. System fonts typically vary by operating system and version. Because the font is already installed, the font does not need to be downloaded. System fonts can work particularly well for body text. To use the system font in your CSS, list system-ui as the font-family:
"...the quality and variety of the typefaces that you’ll find on premium services like Typekit are understandably much better than what you can get for free, but if they’re just not in the budget then Google Web Fonts is absolutely your best bet ... Google Web Fonts is a completely free and super easy way to implement non-standard fonts on your website in a properly licensed and widely supported fashion."
-- from "A Beginner’s Guide to Using Google Web Fonts" written by Joshua Johnson, published 8/1/2012.
153
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
