...

четверг, 25 июля 2013 г.

Конверторы шрифтов на javascript: svg2ttf, ttf2woff, ttf2eot


сегодня в 10:54


Многим из вас знаком сайт fontello.com, который помогает делать иконочные шрифты для вебсайтов. Сегодня хочется вас познакомить с некоторыми полезными штуками, которые у него поместились под капотом. А именно — с конверторами шрифтов:

Вы можете найти «в интернетах» много проектов, которые предлагают конвертировать форматы шрифтов, но все они так или иначе завязаны на FontForge. Он конечно работает, но не всегда так как хочется, и не всегда удобeн. Со временем накопились и другие причины для своих лисапедов:




  • У фонтфоржа, при импорте картинок и конвертации форматов, с изображениями и фонтами бывают странности. Например, покоцанная ширина глифов у WOFF, недописанные хедеры у SVG и скейлинг импортированных картинок по высоте

  • Не для всех платформ фонтфорж есть в виде готовых пакетов, а собирать из исходников муторно

  • Есть планы добавить импорт кастомных иконок и фонтов. Через сервер это делать накладно, а отображать через костыли вроде рафаэля/куфона — путь в никуда. Да и покажут такие костыли не точно тоже самое, что вы получите в конечном результате.




В общем, захотелось все сделать на яваскрипте, с перспективой погонять код прямо в браузере. Конверторы в WOFF и EOT получились довольно быстро, т.к. файлы являются простыми контейнерами TTF/OpenType. А вот с генерацией TTF пришлось повозиться. Но вчера квест закончился, и код поехал в продакшен.

Возможно, эти конверторы окажутся полезными в ваших собственных проектах. Код на гитхабе, лицензия MIT. Удачи!





Developers, stick with Russians – work in London




Переводы с

карты на карту


Переводы

через QR-Код


Новая функция

«Мой контроль»



Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.


This entry passed through the Full-Text RSS service — if this is your content and you're reading it on someone else's site, please read the FAQ at fivefilters.org/content-only/faq.php#publishers. Five Filters recommends: 'You Say What You Like, Because They Like What You Say' - http://www.medialens.org/index.php/alerts/alert-archive/alerts-2013/731-you-say-what-you-like-because-they-like-what-you-say.html


Комментариев нет:

Отправить комментарий