Статьи

8 статей о стеках веб-шрифтов

Насколько похожи похожи?

Кляйн отметил, что группировка шрифтов в соответствии с их эстетикой (тип и угол обводки, пропорции, «выглядит как Грузия », «выглядит как Arial ») в некоторых случаях может оказаться бесполезной. Даже похожие шрифты часто имеют четкие различия; например, он отмечает, что Garamond — это семейство гарнитур, отличное от семейства ITC Garamond , даже созданное разными дизайнерами .

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

В связанном элементе Вивьен из Inspiration Bit указывает, что стек Garamond слишком велик для дизайнера, чтобы проникнуть в шрифты Garamond, и предлагает разделить стек на два. Я вижу, что, возможно, стек, управляемый Palatino, и стек, управляемый Garamond , с некоторым необходимым перекрытием, может быть приемлемой альтернативой, достойной изучения.

Пример из практики: стек Helvetica / Arial Sans Serif

Стек Helvetica / Arial является одним из самых больших и, казалось бы, самых случайных стеков. Давайте разберем это и посмотрим, почему это так.

  • Мы начинаем с Frutiger / Frutiger Linotype — личный выбор, который, я знаю, не на машинах многих случайных пользователей, хотя он хорошо известен графическим дизайнерам. ( Frutiger Linotype — это версия Microsoft стандартного шрифта Frutiger .)
  • Поскольку большинство пользователей не видят этот шрифт, мы используем Univers, шрифт Mac для старых компьютеров.
  • Около половины пользователей Windows имеют Calibri , шрифт Vista, поэтому я добавлю его следующим.
  • Затем у нас есть два варианта Gill Sans , более старый и менее известный шрифт Mac, и два варианта Myriad , шрифта Adobe, который Mac принял вместо старого боевого коня, Garamond . (Вы знаете шрифт Myriad Pro ; он используется для более старого логотипа iPod .)
  • Далее у нас есть множество похожих шрифтов Linux, которые зависят от операционной системы пользователя Linux.
  • Затем мы подошли к популярному выбору Windows Tahoma , доступному также на большинстве компьютеров Mac, и популярному шрифту Mac — Geneva . Мы заканчиваем почти универсальной Helvetica Neue / Helvetica (в первую очередь Mac, с некоторыми версиями Helveticas для Linux).
  • И, наконец, мы перечислили Arial (Mac, Windows и множество пользователей Linux) как последний запасной вариант. Мы заканчиваем общим термином без засечек .

Что касается типичных посетителей нашего сайта, большинство пользователей Mac увидят дисплей в Tahoma, Geneva или Helvetica / Helvetica Neue, в то время как большинство пользователей Windows увидят его в Tahoma или Calibri . Arial — последняя альтернатива для тех, у кого необычно голый шкаф для шрифтов.

Обратите внимание, что стек обладает преимуществом, охватывающим практически все варианты, прежде чем перейти к главным образом универсальным запасным вариантам: Tahoma, Verdana, Helvetica и Arial . Тем, у кого менее распространенные шрифты, сайт будет отображаться в этих шрифтах. Таким образом, в кажущемся хаосе списков шрифтов есть некоторое подобие порядка.

Кляйн утверждает, что этот стек сочетает в себе гуманистические шрифты — Frutiger, Calibri, Gill Sans и Tahoma — и реалистичные / классические шрифты, такие как Helvetica. Он разделит их, но для вас важно решить, что лучше для вашей цели; сочетание гуманистических и реалистических / классических шрифтов может быть подходящим. Вы можете начать углубляться в эту тему в Википедии .

Не ограничивайте себя веб-безопасными шрифтами!

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

Я бы выдвинул два контраргумента.

  1. Ограничить себя этой относительно анемичной группой шрифтов означает игнорировать тысячи прекрасных альтернатив; Выбирая хорошо продуманные комбинации, вы можете убедиться, что 90% или более посетителей имеют хотя бы один из альтернативных шрифтов, которые вы используете для своего дизайна.
  2. «Практически каждая машина» означает Windows и Mac, а не Linux. Многие пользователи Linux имеют некоторые или все эти шрифты, обычно из пакета основных шрифтов Microsoft TrueType , но многие без них. Действительно, многие пользователи Linux предпочитают свои собственные шрифты; в конце концов, часть смысла использования Linux — это уход от Microsoft.

Кляйн утверждает, что чем больше шрифтов в вашем стеке и дизайне, тем больше вероятность того, что плохие шрифты будут использованы для создания дизайна: «Существуют сотни тысяч шрифтов… [но] только небольшое количество хороших шрифтов . »Элементы хорошего шрифта включают сильную эстетику, хорошо спроектированные таблицы подсказок, хороший кернинг, поддержку различных языков, сильную поддержку Unicode и настоящие курсивные грани в отличие от медленного компьютерного курсива. «Чем больше шрифтов можно выбрать, тем больше шансов выбрать плохой шрифт.

На самом деле, это почти все сводится к общей типографии ». Он прав: больше вариантов может создать больше проблем. И эти веб-безопасные шрифты? Это Arial, Arial Black, Comic Sans MS, Courier New, Джорджия, Impact, Times New Roman, Требушет MS и Вердана .

Когда вы отсеиваете те, которые вы, вероятно, отклоните в качестве основных шрифтов ( Arial Black, Comic Sans, Courier New и Impact ), у вас есть пять вариантов — пять вариантов. Я предпочитаю больший выбор.

Резюме

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

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

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

Перейти на страницу: 1 | 2 | 3