R.I.P. стандартные шрифты для сайта

Пришло время, когда стандартные шрифты семейства Arial канули в лету. Хвала господу-богу. С появлением новых технологий, любой найденный в интернете шрифт может стать основным на вашем сайте. Это и радость, и боль одновременно. С одной стороны, у дизайнеров появились дополнительные инструменты для улучшения юзабилити и привлечения внимания. А с другой, не все понимают, что текстовый контент, предназначен в первую очередь для чтения.

Так какой же шрифт использовать на сайте, чтобы максимально совместить приятное с полезным? Я предлагаю вам воспользоваться моей подборкой качественных и мега популярных шрифтовых гарнитур. Подключаются они до банального просто и быстро: либо через @font-face, либо через Google Fonts.

Подборка из 6 популярных кириллических шрифтов

1. Open Sans (Бесплатно)

opensans

Его называют новым Arial. Один из самых популярных кириллических шрифтов на сегодняшний день. Большие объемы текста, написанные этим шрифтом, читаются легко — не напрягая лишний раз глаза.

Шрифт разработан Стивом Мэттисом и является полностью бесплатным. В 3 клика устанавливается на любой сайт через Google Fonts.

2. Proxima Nova (29$)

proximanova

Разработан, а точнее переделан в 2005 году из шрифта Proxima Sans. Имеет множество начертаний и не менее популярен, чем Open Sans, хоть и стоит 29$ / начертание. Отлично подходит не только для контентной части, но и для заголовков, чем предыдущий похвастаться точно не может.

3. PT Sans (Бесплатно)

ptsans

Отличный бесплатный шрифт, разработанный студией ПараТайп. Гарнитура включает 8 начертаний, каждое из которых можно скачать на сайте студии, либо сразу подключить через Google Fonts. С недавних пор, активно используется на этом блоге :).

4. PT Serif (Бесплатно)

ptsherif

Еще одна бесплатная гарнитура от студии ПараТайп, выпущенная в 2009 году. Наилучшим образом подходит для заголовков всех мастей. Как вы могли догадаться, PT Serif и PT Sans — парные шрифты. Именно поэтому они очень хорошо взаимодействуют друг с другом, создавая единую типографическую картину.

5. Roboto (Бесплатно)

roboto

Наверняка, один из самых узнаваемых шрифтов среди дизайнеров, использующих Android устройства. Если предыдущий шрифт не очень хорошо подходит для «многа букав», то Roboto —  универсален. Он одинаково хорошо выглядит, как в заголовках, так и объемных текстах.

6. Geometria (40$)

geometria

Самый дорогой шрифт из рассмотренных сегодня. Зато имеет 16 начертаний и вполне может стать единственной гарнитурой, используемой на сайте. Шрифт размашист, в следствии чего, часто используется для цитат и заголовков. Но в качестве контентного так же выглядит очень и очень неплохо.

В заключении

Если вы дизайнер не одного проекта, работаете в студии, или фрилансите на берегу океана, иметь вышеупомянутые шрифты в своем арсенале — обязательное условие. Они сделают контент по-настоящему разнообразным и помогут избежать унылой однообразности.

Если у вас есть чем дополнить данную подборку — добро пожаловать в комментарии.

Артем 08 сентября 2014 / 10:31

Вот уж действительно — «Хвала господу-богу!», что Ариал канул в Лету. Жаль, что многие автономные блоггеры этого не понимают. Особенно бесит, когда на сайте не настроены шрифты и Ариал в кирилице перемежается с Освальдом в латинице и цифрах. Прямо беда, так и хочется написать автору и сказать — автор постав плагин и смени шрифты))

Ответить
    talgautb 08 сентября 2014 / 12:46

    А что плохого в arial ?

    Ответить
      Антон 08 сентября 2014 / 13:40

      Он уныл, и наскучил всем. В современных реалиях, ничего интересного с ним не получается.

      Ответить
        Артем 08 сентября 2014 / 13:54

        Вот именно…

Алексей 08 сентября 2014 / 13:38

Я правильно понимаю, что купив например Proxima, лицензия позволяет его использовать бесконечное число раз в сайтах? Или же привязывается к ресурсу или еще какие-либо ограничения?

Ответить
    Антон 08 сентября 2014 / 13:43

    Учтите, что цена указана за одно начертание: Normal, Bold …

    По поводу покупки. Такую информацию стоит читать непосредственно при покупке. Кто во что горазд. Но, зачастую, за цену вам дается определенное количество показов в месяц.

    Рекомендую вам ознакомиться вот с этой статьей http://paulradzkov.com/2014/web-fonts_license/

    Ответить
      Алексей 08 сентября 2014 / 13:45

      Про начертание я понял) Спасибо за направление, почитаю статью, надеюсь поможет разобраться в некоторых вопросах.

      Ответить
Артем 08 сентября 2014 / 13:57

Насчет шрифтов применяемых в вебе. Есть хороший сайт webfont.ru, там все шрифты бесплатные, но их очень много и они уже заточены под установку на сайтах. И из 400 с гаком кириллических шрифтов всяко можно подобрать что-то похожее на Proxima

Ответить
    Алексей 08 сентября 2014 / 19:10

    Благодарю)

    Ответить
Dimox 09 сентября 2014 / 14:15

Есть еще один интересный шрифт, называется Arimo (разрабоnчик, кстати, тоже Стив Мэттисон). Это что-то среднее между Arial и PT Sans. Также бесплатен и есть в Гугл-шрифтах.

Ответить
Егор 19 сентября 2014 / 12:30

Полностью поддерживаю эту тенденцию. Долой шрифты Arial и Verdana в меню и заголовках! Хотя по удобству чтения основного текста Arial ещё вполне сгодится.

Ответить
Дмитрий 26 сентября 2014 / 12:46

Благо подписался на обновления блога! давно как то хотел найти альтернативу Arial и еже сними, как по мне они морально устарели. Перейду наверное на пару из PT один для заголовков, другой для контента. Благодарность автору за статью!

Ответить
fontan 09 октября 2014 / 22:14

а что так мало? на гугл фонтс много много шрифтов!

Ответить
Никита Волков 17 октября 2014 / 11:56

Офигенно! Правда я себе решил установить немного другой шрифт. Но тоже не плохо смотрится. А так, согласен, что шрифты Arial слишком убогие.

Ответить