Menu
In the fonts folder of Bootstrap 3, we can see those files:
Are they all the same files converted in different formats? Are they all necessary? What is the role/usage of each file?
294
Choose WOFF: If you're using a modern browser, WOFF wraps both TTF and OTF into a single compressed file. Lighter for loading! Choose WOFF 2.0: The newest version developed by Google. The best format to choose because of its smaller file size and better performance for loading on modern browsers.
Importing Your Web Font After you extract the zip file you generated above (or if you already have a webfont), right click the Fonts group in Bootstrap Studio and choose Import Webfont . In the file browser, navigate to the webfont and select the css file in the folder.
Modern TTF files are also called TrueType OpenType fonts. TTF can be useful for extending support to some older browsers, especially on mobile, if you need it. Web Open Font Format (WOFF): WOFF was developed in 2009 as a wrapper format for TrueType and OpenType fonts.
WOFF2 is a font format that provides, on average, a 30% reduction in file size, thus helping Web fonts load more quickly in compatible browsers. WOFF2 fonts are automatically included when publishing new Fonts.com Web Fonts projects.
They are included because each font was created to solve different problems. Woff and woff2 are the newest formats which were designed to stop font piracy. Svg is also a newer format which is a vector file and used on iOS mobile devices. Tff and eot are old school formats used by old browsers, but they allow anyone to download and use the font for free.
Short answer: They are all included for multi-version cross-browser compatibility.
See: Why should we include ttf, eot, woff, svg,... in a font-face
158
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
