Сжатие иконочных шрифтов

• Мгновенное сжатие иконочных шрифтов в браузере: сжимайте иконочные шрифты Font Awesome, Material Icons и Bootstrap Icons прямо в браузере — без отправки на сервер и облачной обработки. Наш инструмент мгновенно пересобирает таблицу символов на чистом JavaScript.
• Безопасное онлайн-сжатие иконочных шрифтов: файлы шрифтов никогда не покидают ваше устройство при сжатии. Обработка на 100 % на стороне клиента означает полную приватность — без облачного хранилища, без серверных логов и без раскрытия данных шрифта.
• Сжатие иконочных шрифтов без установки: сжимайте иконочные шрифты прямо в браузере без скачивания ПО, без плагинов и без аккаунта. Работает в любом современном браузере на любой ОС — без регистрации.
• Поддержка Font Awesome, Material Icons и других: встроенные пресеты для Font Awesome 5/6, Material Icons и Bootstrap Icons — или вставьте любые свои кодовые точки Unicode. Принимает входные форматы TTF, OTF и WOFF и выдаёт сжатый файл WOFF.

• Core Web Vitals и скорость загрузки страницы: Font Awesome 6 Free занимает более 800 КБ, а большинство сайтов используют менее 50 иконок. Сожмите иконочный шрифт до используемых иконок, чтобы убрать предупреждения PageSpeed «Reduce unused CSS» и «Avoid large network payloads».
• Оптимизация приложений React, Vue и Angular: сжимайте иконочные шрифты в одностраничных приложениях, чтобы уменьшить размер начального пакета. Меньшие иконочные шрифты загружаются быстрее и улучшают показатели Time to Interactive (TTI) и Largest Contentful Paint (LCP).
• Иконочные шрифты в шаблонах писем: сжимайте иконочные шрифты, используемые в HTML-шаблонах писем, оставляя только иконки, указанные в шаблоне. Меньшие файлы быстрее загружаются в почтовых клиентах с поддержкой @font-face и ускоряют отображение.
• Производительность e-commerce и лендингов: сжимайте иконочные шрифты на страницах товаров и лендингах, чтобы уменьшить вес страницы. Сжатый иконочный шрифт с 20 иконками обычно на 95 % меньше полной библиотеки Font Awesome.
• Производительность мобильного веба: сжимайте иконочные шрифты для мобильной выдачи, чтобы сократить расход данных в сетях 3G/4G. Меньшие иконочные шрифты критичны для Core Web Vitals на мобильных, где загрузка шрифтов часто ограничивает LCP.
• Распространение собственных иконочных шрифтов: сжимайте свои иконочные шрифты перед распространением в дизайн-системах и библиотеках компонентов. Отправка только используемых в дизайн-системе иконок снижает вес шрифта для каждого использующего приложения.

Иконочные шрифты, такие как Font Awesome, Material Icons и Bootstrap Icons, содержат тысячи глифов, но большинство сайтов используют менее 50. Сжатие иконочных шрифтов (также называемое созданием подмножества) удаляет неиспользуемые глифы из файла, создавая гораздо меньший файл только с теми иконками, которые вы реально используете. Наш инструмент работает путём пересборки таблицы cmap шрифта — таблицы символов, которая сопоставляет кодовые точки Unicode с идентификаторами глифов, — чтобы включить только указанные вами кодовые точки. Это безопасный для браузера подход, дающий корректный файл WOFF без серверных инструментов.

1. 1 Загрузите иконочный шрифт: перетащите файл иконочного шрифта TTF, OTF или WOFF. Шрифт читается как бинарный ArrayBuffer в браузере — никакие данные не отправляются на сервер. Инструмент разбирает каталог таблиц sfnt и таблицу cmap, чтобы построить полное сопоставление кодовых точек и глифов.
2. 2 Введите кодовые точки для сохранения: вставьте кодовые точки Unicode используемых иконок (например, f000, f001, f002). Используйте встроенные пресеты Font Awesome, Material Icons или Bootstrap Icons как отправную точку. Инструмент покажет, сколько кодовых точек обнаружено до обработки.
3. 3 Скачайте сжатый WOFF: инструмент пересобирает таблицу cmap только с запрошенными кодовыми точками и упаковывает результат как файл WOFF. Панель результатов показывает исходный размер, размер результата, процент уменьшения и кодовые точки, не найденные в шрифте.

• Таблица cmap (таблица символов): пересобирается, чтобы включить только запрошенные кодовые точки, — это основной источник уменьшения размера. Полная cmap Font Awesome сопоставляет более 2000 кодовых точек; подмножество из 30 иконок — только 30.
• Контейнер WOFF: результат упаковывается как WOFF (Web Open Font Format) с компактным заголовком и каталогом таблиц — меньше исходного контейнера TTF независимо от подмножества.
• Контуры глифов (частично): все контуры глифов сохраняются в результате — браузеры не отображают недостижимые глифы, но таблицы glyf/loca не перезаписываются. Для максимального уменьшения используйте pyftsubset после этого инструмента.
• Метаданные и неиспользуемые таблицы: все таблицы sfnt сохраняются для совместимости. Пересборка cmap — безопасный, совместимый с браузерами подход к созданию подмножества, работающий без WASM и серверной обработки.

Инструмент пересобирает таблицу cmap, чтобы отображать только запрошенные кодовые точки, — он не удаляет контуры глифов из таблиц glyf и loca. Поэтому итоговый файл меньше исходного (за счёт сокращённой cmap и накладных расходов WOFF), но не настолько мал, как полноценное подмножество на уровне глифов. Для максимального сжатия используйте серверный инструмент, например pyftsubset (из fonttools) или glyphhanger, после скачивания WOFF из этого инструмента. Входные файлы WOFF поддерживаются, но должны использовать несжатое хранение таблиц (compLength = origLength).