WOFF

WOFF 1.0 был разработан совместно Mozilla, Opera и Microsoft как первый формат шрифтов, созданный с нуля для веба. Он стал рекомендацией W3C в декабре 2012 года, ознаменовав важный этап в веб-типографике.

По существу, WOFF — это обёртка вокруг существующих данных шрифтов TrueType или OpenType. Он применяет сжатие zlib для уменьшения размера файла и включает необязательные поля метаданных для лицензирования и атрибуции. До WOFF веб-разработчикам приходилось отдавать необработанные файлы TTF или OTF — большие, несжатые и лишённые какого-либо стандартного способа встраивания лицензионной информации.

Ключевым новшеством стало создание специализированного контейнера веб-шрифтов, решившего три проблемы одновременно: уменьшение размера файлов через сжатие, стандартный блок метаданных для лицензирования шрифтов и формат, который браузеры могут легко проверять и изолировать в целях безопасности.

Контейнер WOFF оборачивает существующие таблицы шрифтов (из исходных файлов TTF или OTF) с сжатием zlib на уровне каждой таблицы. Каждая таблица исходного шрифта — контуры глифов, данные кернинга, именованные записи — сжимается независимо, что позволяет браузеру распаковывать только нужные таблицы.

Заголовок WOFF начинается с четырёхбайтовой сигнатуры (wOFF), за которой следует «вкус» шрифта (указывающий, является ли упакованные данные TrueType или CFF), общий сжатый размер и указатель на необязательный блок метаданных. Браузер считывает этот заголовок, распаковывает отдельные таблицы до их исходного вида и передаёт реконструированные данные шрифта движку рендеринга текста.

С точки зрения движка рендеринга распакованный WOFF-файл идентичен исходному TTF или OTF — сжатие полностью прозрачно.

@font-face {
  font-family: 'MyIcons';
  src: url('icons.woff2') format('woff2'),
       url('icons.woff') format('woff');
}

Браузер перебирает каждый элемент src по порядку. Современные браузеры загрузят файл WOFF2 (меньший, более быстрый); старые браузеры, не поддерживающие WOFF2, откатятся к файлу WOFF. Такой каскадный подход обеспечивает оптимальную производительность при максимальной совместимости.

WOFF поддерживается всеми основными браузерами с начала 2010-х годов, что делает его наиболее надёжным запасным форматом для веб-шрифтов. Он охватывает ещё более широкий спектр браузеров, чем WOFF2, поскольку включает поддержку старых версий Internet Explorer.

При 98%+ глобального охвата браузеров WOFF понимается практически каждым браузером, находящимся в активном использовании. Единственным заметным исключением является IE 6-8, который вместо него требует EOT.

WOFF2 является преемником WOFF, и на практике он представляет собой строгое улучшение. Вот как они соотносятся:

WOFF2 обеспечивает примерно на 30% лучшее сжатие, чем WOFF, благодаря Brotli и специализированному шагу предобработки, который делает данные глифов более пригодными для сжатия. Декомпрессия также выполняется быстрее. Поддержка WOFF2 в современных браузерах столь же широка — единственным пробелом является Internet Explorer 9-11, который поддерживает WOFF, но не WOFF2.

Для большинства проектов, ориентированных на браузеры с 2024 года и позднее, одного WOFF2 достаточно. Единственное оставшееся преимущество WOFF — охват IE 9-11.

Несмотря на то что WOFF вытеснен WOFF2, всё ещё есть веские основания включать его в стек шрифтов:

• В качестве запасного варианта рядом с WOFF2 — укажите WOFF2 первым в объявлении @font-face, а WOFF — вторым, обеспечивая современным браузерам меньший файл, а старым — получение шрифта.
• Когда требуется поддержка IE 11 — IE 11 поддерживает WOFF, но не WOFF2, поэтому WOFF — лучший доступный сжатый формат для этого браузера.
• В средах без Brotli — некоторые старые инструменты сборки, прокси или CDN могут некорректно обрабатывать сжатие Brotli в WOFF2; сжатие zlib в WOFF поддерживается повсеместно.

Если ни одно из этих условий не применимо к вашему проекту, вы можете смело пропустить WOFF и использовать только WOFF2.