15 лучших Google шрифтов для вашего сайта

Шрифт для веб-проекта — не просто эстетический выбор. Он может существенно повлиять на показатели сайта. Поэтому так важно выбрать идеальное семейство Google Fonts для WordPress-страниц.

В бесплатном доступе есть более 1052 различных вариантов. Мы подготовили список лучших шрифтов Google Fonts для ваших интернет-проектов.

Почему стоит использовать шрифты Google

В Интернете существуют тысячи хранилищ шрифтов, так что именно делает Google Fonts особенным?

Безопасность

Google Fonts поддерживаются и поставляются компанией Google. Это делает их гарантировано безопасными.

Существует множество сайтов с бесплатными шрифтами. Но их качество будет сомнительным. Если вы не являетесь графическим дизайнером и не разбираетесь в типографике, то Google Fonts — оптимальный выбор.

Бесплатное использование

Здесь нет сложных лицензионных ограничений. Шрифты в каталоге Google Fonts имеют открытый исходный код. Их можно свободно использовать в коммерческих или печатных проектах.

Единой лицензии не существует, но большинство используют Open Font License. Шрифты со сторонних сайтов редко бывают бесплатными. Они также сопровождаются рядом запутанных лицензионных ограничений.

Простая установка

Добавить шрифты Google на сайт можно, используя Google Fonts API. Вы можете скачать их по отдельности и загрузить на свой веб-сервер по FTP/SFTP.

На что обратить внимание при выборе шрифта Google

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

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

• Соответствие бренду. Это важный аспект. Успешные сайты имеют шрифты, которые демонстрирует их индивидуальность. При этом, они понятны и вписывается в дизайн интернет-ресурса.
• Читабельность. Второй важный принцип — удобочитаемость. Причудливый и фантазийный шрифт может соответствовать бренду. Но если посетители не смогут его прочитать, они быстро уйдут. Поэтому типографика должна быть разборчивой.
• Классификация шрифтов. Существуют сотни способов классифицировать шрифты. Зная эти систематизации, можно лучше ориентироваться при выборе начертания. Вот несколько основных типов: с засечками (он делает текст более элегантным), без засечек, моноширинный (популярен на сайтах с технологической тематикой), декоративный.
• Дисплейный или основной шрифт. Дисплейные начертания предназначены для больших размеров экранов, заголовков или печатных проектов. Они могут быть менее разборчивыми ради уникального дизайна. Главная задача основных шрифтов — читабельность, так как они составляют основную часть сайта.
• Настроение и замысел. Художники часто разрабатывают шрифты для определенных целей. К большинству прилагаются примечания, как их можно использовать. Выбирайте вариант, который наиболее точно передаст тематику и настроение вашего сайта.

10 самых популярных шрифтов Google

Как определиться с лучшими шрифтами Google, если такой рейтинг будет сильно зависеть от субъективного восприятия? Чтобы избежать предвзятости, необходимо опираться на предпочтения большого количества пользователей, тем самым составив список самых популярных шрифтов.

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

Затем мы немного расширим список самых популярных шрифтов и выберем несколько новых вариантов, которые набирают популярность.

Roboto

Roboto — шрифт семейства Sans-Serif от Кристиана Робертсона. Он был разработан в качестве системного варианта для Android. Эта типографика пользуется огромной популярностью. Также Roboto выпускается в 12 различных стилях.

Open Sans

Open Sans Condensed — удобочитаемый шрифт, созданный по заказу Google и вдохновленный своим предшественником Droid Sans. Google использует Open Sans на некоторых своих сайтах, а также в печатной и веб-рекламе.

Lato

Lato — популярный шрифт от Лукаша Дзедзича. За его дизайном стоит довольно интересная история, в которой сбалансированы противоречивые цели, в результате чего получился уникальный, легкий шрифт sans-serif.

Montserrat

Montserrat — написание без засечек от Джульеты Улановски, живущей в одноименном районе Монтсеррат в Буэнос-Айресе. Этот вариант предлагает 18 различных стилей — от легкого до сложного.

Oswald

Oswald — шрифт с написанием Sans-Serif. Он был разработан с учетом ярко выраженного готического стиля Alternate Gothic. Об этом свидетельствуют его жирные начертания.

Source Sans 3

Source Sans 3 относится к семейству Sans-Serif. Он был создан Полом Хантом. Затем стал первым шрифтом с открытым исходным кодом Adobe. Понятное написание делает Source Sans 3 чистым и разборчивым.

Slabo 27px/13px

Slabo — шрифт с засечками, созданный Джоном Хадсоном из Tiro Typeworks.

Он был специально разработан для определенных размеров — 27px или 13px. Используйте его в зависимости от тематики сайта и своих потребностей.

Raleway

Raleway — крупномасштабный шрифт Sans-Serif, созданный Мэттом Макинерни. Он поставляется с  18 различными стилями.

PT Sans

PT Sans был разработан для всех субъектов Российской Федерации. Он включает в себя как латинские, так и кириллические символы.

Merriweather

Merriweather — шрифт с приятным и легким дизайном. Художники задумывали его именно таким.

Набирающие популярность шрифты-новинки

Варианты, представленные выше, являются самыми популярными начертаниями Google. Ниже предлагаем несколько новых и перспективных HTML-шрифтов.

Noto Sans/Serif

Noto — это набирающий популярность шрифт. Он был создан по заказу Google.

Преимущества:

• Выпускается с засечками и без засечек.
• Регулярно обновляется.
• Насчитывает 100+ начертаний, их число постоянно растет.

Цель Noto — охватить все алфавиты и символы различных языков. При этом он сохраняет гармоничный дизайн сотен семейств. К ним относятся популярные Noto Sans KR и Noto Sans JP.

Nunito Sans

Nunito Sans — вариант Sans-Serif, который стремительно набирает популярность. Его использование утроилось в период с 2018 по 2019 год. С каждым годом он становится более востребованным для различных интернет-ресурсов.

Concert One

Concert One — округлый, гротескный шрифт. Он станет отличным вариантом для заголовков. Его нетрадиционный дизайн обязательно привлечет внимание читателей сайта.

Prompt

Prompt — вариант без засечек от компании из Тайланда Cadson Demak. Он не имеет петель (тайский эквивалент sans-serif). Начертание включает в себя тайские и латинские символы.

Work Sans

Work Sans — это шрифт Sans-Serif, он оптимизирован для любых экранов. Дизайнеры рекомендуют применять легкие стили для размеров от 14px до 48px.

Как создать лучшие комбинации шрифтов Google

Сайт ВордПресс будет удобным и читабельным, если использовать два-три шрифта. Главное, чтобы они гармонировали между собой.

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

Правила использования шрифтов Google на WordPress

Выбрав идеальные начертания для сайта, важно их грамотно применить. Предлагаем несколько правил использования Google Fonts на WordPress.

Ограничьте количество используемых шрифтов

Некоторые из представленных вариантов имеют множество начертаний. Это хорошо, поскольку дает возможность выбора. Но загрузка всех написаний замедлит работу сайта.

Используйте максимум три начертания:

• Обычный.
• Курсив.
• Полужирный.

Если самостоятельно устанавливать шрифты Google Fonts, можно решить, какие варианты начертаний включить. Нужно нажать «Выбрать этот стиль» рядом с теми, которые нужны.

Большинство тем WordPress содержат удобные способы выбора начертаний Google Fonts. Но не все разработчики темплейтов ориентируются на производительность. Поэтому в некоторых случаях лучше отключить Google Fonts в шаблоне и добавить их самостоятельно.

Вариативные шрифты набирают популярность и поддерживаются современными браузерами. Они позволяют трансформировать один файл начертания с разными свойствами. В Google Fonts есть множество таких вариантов.

Рассмотрите локальное размещение шрифтов Google

В качестве альтернативы загрузке шрифтов с сервера Google, вы также можете размещать шрифты локально, что обеспечивает повышение производительности. Большинство начертаний Google, вероятно, уже кэшированы в браузерах пользователей. Поэтому мы рекомендуем проводить тесты производительности.

Выберите шрифт, который обновляется

Шрифты похожи на плагины и темы WordPress. Со временем они получают обновления и улучшения, которые делают их еще лучше.

Выбрать регулярно обновляемую типографику будет верным решением. Например, семейство Noto от Google регулярно развивается с 2014 года.

Не забывайте о доступности

По данным ВОЗ, собранным в 2015 году, около 253 миллионов человек живут с нарушениями зрения. 36 миллионов — слепые, а 217 миллионов имеют умеренные или тяжелые нарушения. Кроме того, число людей с той или иной формой нарушения зрения выросло до 2,2 миллиарда.

Внешний вид шрифтов Google Fonts можно контролировать с помощью CSS. Например, менять цвет и размер. Поэтому следуйте “Руководству по доступности веб-контента (WCAG) 2.0”. Это гарантирует, что ресурс будет удобным для всех пользователей.

Соблюдение этих рекомендаций сделает сайт понятным для людей с ограниченными возможностями,  включая:

• Слепоту и слабое зрение.
• Глухоту и потерю слуха.
• Нарушения обучаемости.
• Когнитивные нарушения.
• Ограниченность движении.
• Нарушения речи.
• Проблемы со светочувствительностью.

Цветовой контраст также играет важную роль в восприятии сайта посетителями. Помните, контент не должен напрягать зрение.

Инструмент Color Contrast Checker от WebAIM поможет проверить, соответствуют ли цвета шрифтов официальным рекомендациям.

Как добавить шрифты Google в WordPress

Выбрав одно или два начертения, нужно добавить их на свой ресурс. Google Fonts позволяет сделать это быстро и легко.

У вас есть три варианта:

Заключение

Шрифты Google — отличный выбор для интернет-ресурса. Их используют миллионы сайтов. Они делают веб-страницы более приятными, быстрыми и доступными. Все это за счет принципов типографики и иконографии.

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