L
L
Lici2014-08-29 06:28:12
PHP
Lici, 2014-08-29 06:28:12

How to reduce the weight of fonts during layout?

How to reduce the weight of fonts during layout? Those that I throw into the font folder. A couple of fonts are already megabytes.
@font-face {font-family: Calibri; src: url(fonts/Calibri.ttf);}
@font-face {font-family: Calibri Bold; src: url(font/Calibri_Bold.ttf);}

Answer the question

In order to leave comments, you need to log in

4 answer(s)
D
Dima Pautov, 2014-08-29
@bootd

It all depends on how you connect them!
There are several factors:
1) Cross-browser compatibility. Now, for modern browsers, just a couple of formats are enough. Google gives their fonts that way. There are only a couple of formats. (But for some reason I don't understand, I don't connect them there. Well, I don't like it)
2) What kind of generator do you use? www.fontsquirrel.com/tools/webfont-generator - Gives you tons of customization options. The more settings, the greater the weight of the font. There are also modes for weight compression.
3) Number of styles. Bold, italic, light, etc. The more of them, the heavier the site.

K
Konstantin Omelyan, 2014-08-29
@Sipatyj

Use google fonts.

M
My joy, 2014-08-29
@t-alexashka

Supporting @bootd , fontsquirrel.com gives you the ability to strip unwanted characters from a font to reduce its weight. for example, you can pull out all the Cyrillic characters, or Latin, or punctuation marks, or even if these are large fonts, they have a lot of Chinese alphabet characters, and other things.

I
Igor Vorotnev, 2014-08-30
@HeadOnFire

1. Throwing ordinary ttf into a folder is generally completely wrong. These are desktop versions of the fonts, they are heavy.
2. Must use a webfonts generator, FontSquirrel is a great option. Generate only required languages ​​and symbols, strip metadata.
3. If you need support for IE9+ (well, all normal browsers) - generate only woff ( see support ). This is the easiest format.
4. If you need support for IE8 and below, you will have to use the EOT format.
or use Google Fonts, which allows you to customize the whole thing too. In addition, there are 2 bonuses:
1. These are requests to an external domain, which means that your files will load faster during the page load (the download will go in parallel from two domains)
2. Many users will already have their fonts in the cache.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question