Качаем шрифты с Google Fonts

Качаем шрифты с Google Fonts

Обзоры

У статьи, которую Вы сейчас читаете, очень интересная история появления.

В момент написания на территории РФ мы поимели небольшие проблемы с работой некоторых сервисов от Google благодаря известному в широких кругах процессу. Поэтому вопрос переноса библиотек и файлов из облака (из различных библиотек CDN и иже с ними) стало весьма актуальным. Да и в целом, лично мне нравится, когда запросы к сторонним ресурсам и серверам минимизированы — не дай бог что упадёт или прекратит существование, а у тебя на этом работают важные компоненты. Fail неисбежен.

Я давно не писал в блог ничего дельного, поскольку сейчас достаточно плотно занят + нахожусь в поисках синей птицы в плане подхода к разработки тем для WordPress и прочих вещей для него. На днях у меня встал вопрос качественной упаковки и удобного использования шрифтов, ещё более оптимального, чем пользуюсь в настоящее время. Часто мы подключаем шрифты с Google Fonts, но в последнее время появилась вероятность его (полной / временной — нужное подчеркнуть) недоступности, из-за чего вопрос переноса шрифтов к себе на сервер стало весьма актуальным.

Кроме того, многие шрифты — например Roboto, который я весьма люблю и уважаю (почти как PT Sans) — распространяются бесплатно. Поэтому особенных проблем в плане соблюдения авторских прав нет. Проблем в том, чтобы скачать шрифты со специализированных сайтов, нет совсем. Беда в том, что большинство шрифтов распространяется в формате ttf или otf, а вот найти более кошерные woff или woff2 — более сложная задача.

И вот буквально сегодня в постах Веб-cтандартов мне попалась ссылка на классный инструмент — google-webfonts-helper, суть которого в том, что он помогает взять и сохранить нужные Вам шрифты с сервиса Google Fonts.

Он устроен очень легко: в списке слева ищем нужный шрифт, выбираем нужный алфавит, насыщенность шрифта (если у этого шрифта есть версии), и настраиваем CSS — либо оставляем стандартную версию для лучшей совместимости или делаем поддержку только современных браузеров (в таком случае у нас останутся только форматы woff и woff2).

Сайт Google-Font-Downloader
Для примера (и себя) я взял шрифт PT Sans и выбрал поддержку новых браузеров

Под самый конец мы можем указать папку, из которой будут грузится файлы в нашем проекте (по умолчанию ../fonts/), что весьма удобно для создания готового пака. После этого останется только взять и скачать готовые файлы.

По итогу мы получим zip-архив, готовый к использованию. И это хорошо.

Надеюсь, мой небольшой обзорчик был для Вас полезен также, как и для меня.

Всем добра и до встречи на Веб-Островах!

Анатолий Куликов

Анатолий Куликов

Автор блога, дизайнер, веб-разработчик
  • at sign
  • vk logo