WOFF2 vs WOFF vs TTF vs OTF
Для большинства сайтов ответ короткий: используйте WOFF2. Ниже описано, для чего нужен каждый формат и когда может понадобиться что-то другое.
Форматы в общих чертах
| Формат | Назначение | Использовать в вебе? |
|---|---|---|
| WOFF2 | Сайты, с лучшим сжатием | Да, всегда |
| WOFF | Сайты, со старым сжатием | Только для очень старых браузеров |
| TTF | Настольные приложения | Нет, слишком большой |
| OTF | Настольные приложения и печать | Нет, слишком большой |
| EOT | Старый Internet Explorer | Нет, устарел |
| SVG-шрифты | Ранние iPhone | Нет, устарел |
Почему выигрывает WOFF2
WOFF2 оборачивает обычный шрифт в сжатие Brotli с дополнительными шагами, созданными специально для данных шрифтов. Он работает во всех современных браузерах, поэтому одного файла обычно достаточно. Преобразуйте свой шрифт с помощью конвертера TTF в WOFF2 или конвертера OTF в WOFF2.
Нужен ли мне всё ещё запасной формат WOFF?
Скорее всего, нет. Добавляйте его, только если ваша аналитика показывает посетителей на очень старых браузерах. Это почти ничего не стоит, так как браузеры загружают только первый поддерживаемый формат:
src: url("brand.woff2") format("woff2"),
url("brand.woff") format("woff");
TTF или OTF?
Это важно в первую очередь для исходных файлов. TTF использует контуры TrueType, а OTF обычно использует контуры в стиле PostScript. После конвертации в WOFF2 оба формата подходят для веба. Если вы потеряли исходный файл шрифта, на использование которого у вас есть лицензия, конвертер WOFF2 в TTF поможет его восстановить.