
This also adds extra HTTP requests to external resources. Typekit had an outage just this last month. If you are using a third party such as Google or Typekit, then you also have no control if their services go down. The biggest disadvantage of using web fonts is that it instantly affects the overall rendering speed of your pages. Ilya Grigorik, Web Performance Engineer at Google Disadvantages of web fonts Webfonts are critical to good design, UX, and performance. Other advantages of using web fonts are design, readability, and accessibility. Web Fonts are scalable, zoomable, and high-DPI friendly, meaning they can be easily shown across desktops, tablets, and mobile phones no matter what the resolution. One of the biggest reasons that companies use web fonts is so that they can achieve consistent branding across different mediums. There are many advantages to using web fonts. Source: W3Schools Advantages of web fonts Here is a list of browser support for TTF, WOFF, WOFF2, and EOT. This does, however, require more resources. If you want to provide a certain font to all of the browsers, you would need to include TTF, WOFF, WOFF2, and EOT. If you need to support older browser versions, fall back to a web-safe font, such as Arial, for the rest, which we will cover more about below.įor Intel's ClearSans, WOFF2 saves 25% in file size over WOFF.
Css font kit generator download#
Also, WOFF2 compresses about 30% better than WOFF, resulting in fewer data to download and, thus, faster performance. WOFF 2 is the newest of the modern fonts and currently has the most browser support. Unless you need to support old browsers, it's best to use WOFF2.

So which one should you use? According to Can I Use, 97% of browsers support the WOFF2 format. Embedded Open Type (EOT): Compact form of OpenType fonts designed by Microsoft for use as embedded fonts on web pages.


The are four primary font formats that are used on the web today. They are downloaded by using the CSS3 declaration and must be supported by the web browser. Web fonts are those not installed on a person's computer, thereby having to load from a web server. Today we will compare some of the top web fonts and see how different delivery methods, such as serving from Google Fonts, hosting locally, and third parties, affect the overall load times. The number of websites using custom web fonts continues to grow at a rapid pace and this, in turn, affects the rendering speed of pages.
