элементная база сайтостроения

Home Элементы Разработка Использование Google Fonts при разработке сайта

Использование Google Fonts при разработке сайта

ПОДЕЛИТЬСЯ
, / 1013 0

Современные тенденции веб-дизайна сводятся к тому, что основной тон задает типографика. Много простора и воздуха, акцент на деталях, большие надписи и нестандартные шрифты — таков сегодняшний тренд сайтостроения. Для того чтобы улучшить визуальное восприятие текстов, чтобы сделать сайт более привлекательным, стандартных веб-шрифтов зачастую недостаточно. Требуется подключение сторонних шрифтов, причем иногда по дизайну требуется несколько гарнитур и стилей.


Каким же способом можно расширить перечень используемых шрифтов? Проще всего использовать удобный сервис встраиваемых шрифтов от известного поискового гиганта Google https://www.google.com/fonts. Сервис сделан максимально просто и удобно, даже исключительно англоязычный интерфейс не станет препятствием, настолько все понятно и очевидно.


На данный момент в каталоге Google собрано более 600 семейств веб-шрифтов, из них более 50 кириллических. Все они свободны для использования и легко могут быть встроены в любую веб-страницу.


Для того, чтобы при выборе шрифта можно было сразу увидеть результат его использования, на странице Google Fonts предусмотрены вкладки для четырех типичных вариантов предпросмотра и сравнения:


· Word (слово)


· Sentence (предложение)


· Paragraph (абзац)


· Poster (заголовки)


При переключении вкладки, автоматически меняется размер шрифта и область превью.


На странице Google Fonts предусмотрены фильтры подбора шрифтов: по начертанию, стилю (ширине, толщине и наклону) и языковой версии. Для каждого шрифта доступны опции: просмотр всех стилей, быстрое использование и вызов всплывающего окна с подробной информацией по шрифту (таблицей символов, описанием, статистикой использования). Шрифты можно сохранять в виде коллекций (для этого надо войти в свой аккаунт Google), а также скачивать на компьютер для дальнейшего использования.


При выборе опции быстрого использования надо отметить желаемый стиль шрифта, кодовую страницу (латиницу, кириллицу), затем способ интегрирования шрифта в свою верстку. Для импорта шрифта предусмотрены варианты вставки кода в элемент в html-коде страницы, импорт в таблицу стилей или через Javascript. Сниппеты кода снабжены подсказками — краткими инструкциями по использованию. При этом индикатор покажет, как быстро будет загружаться страница, в зависимости от выбранных шрифтов.

Оставить сообщение

PASSWORD RESET

18 + 7 =

REGISTER


12 − два =

LOG IN