Посмотрите на любую веб-страницу в Интернете сегодня, независимо от размера сайта или отрасли, для которой он предназначен, и вы увидите, что одна вещь, которую они объединяют, - это текстовый контент.
Один из самых простых способов повлиять на дизайн веб-страницы - это шрифты, которые вы используете для текстового контента на этом сайте. К сожалению, многие веб-дизайнеры, которые на ранних этапах своей карьеры, немного сходят с ума, используя слишком много шрифтов на каждой странице. Это может привести к запутанному опыту, который, как представляется, лишен согласованности дизайна. В других случаях разработчики пытаются экспериментировать со шрифтами, которые практически не читаются, используя их только потому, что они «классные» или разные. Они действительно могут быть классными шрифтами, но если текст, который они предназначены для передачи, не может быть прочитан, «холодность» этого шрифта будет изнашиваться, когда никто не читает этот веб-сайт и вместо этого не отправится на сайт, который они смогут обработать!
В этой статье мы рассмотрим некоторые элементы, которые вы должны учитывать при выборе семейства шрифтов для вашего следующего проекта веб-сайта.
НЕКОТОРЫЕ ПРАВИЛА
- Не используйте более 3-4 шрифтов на одной странице. Что-то большее, чем это, начинает чувствовать себя дилетантским - и даже в некоторых случаях даже 4 шрифта могут быть слишком большими!
- Не изменяйте шрифт в середине предложения, если у вас нет веской причины (примечание - я никогда, за все свои годы, как веб-дизайнер, не нашел достаточной причины для этого)
- Используйте шрифты sans serif или шрифты serif для основного текста, чтобы облегчить чтение этих блоков содержимого.
- Используйте моноширинные шрифты для текста пишущей машинки и блока кода, чтобы установить этот код отдельно от страницы.
- Используйте скрипт и фэнтезийные шрифты для акцентов или крупных заголовков с очень небольшим количеством слов.
Помните, что это все предложения, а не жесткие и быстрые правила. Однако, если вы собираетесь сделать что-то другое, тогда вы должны сделать это с намерением, не случайно.
SANS SERIF FONTS - ОСНОВА ВАШЕГО САЙТА
Шрифты Sans serif - это те шрифты, у которых нет «засечек» - небольшое добавление дизайна на концах букв.
Если вы прошли курсы дизайна печати, вам, вероятно, сказали, что вы должны использовать шрифты с засечками только для заголовков. Это неверно для Интернета. Веб-страницы предназначены для просмотра веб-браузерами на компьютерных мониторах, а современные мониторы очень хорошо отображают шрифты с засечками и без засечек. Некоторые шрифты с засечками могут стать немного сложными для чтения с меньшими размерами, особенно на более старых дисплеях, поэтому вы всегда должны знать свою аудиторию и следить за тем, чтобы они могли читать шрифты с засечками, прежде чем принимать решение использовать их для вашего основного текста. Это означает, что большинство шрифтов serif сегодня предназначены для цифрового потребления, и они будут работать нормально как копия тела, если они установлены с разумным размером шрифта.
Некоторые примеры шрифтов sans-serif:
- Arial
- Женева
- Helvetica
- Lucida Sans
- Требушет
- Verdana
Общая информация: Verdana - это семейство шрифтов, которое было изобретено для использования в Интернете.
ИСПОЛЬЗОВАТЬ СЕРИЙНЫЕ Шрифты для печати
В то время как шрифты с засечками могут вести онлайн-чтение для более старых дисплеев, они идеально подходят для печати и хороши для заголовков на веб-странице. Если у вас есть версия для печати вашего сайта, это идеальное место для использования шрифтов с засечками. Засечки, в печати, облегчают чтение, поскольку они позволяют людям более четко различать буквы. И поскольку печать имеет более высокое разрешение, их можно увидеть более четко и, похоже, не размываются.
Лучшая практика: рассмотрите возможность использования шрифтов с засечками для страниц, удобных для печати.
Некоторые примеры шрифтов с засечками:
- Garamond
- Грузия
- раз
- Times New Roman
МОНОПОЛЬНЫЕ ШРИФТЫ ПРИНИМАЮТ РАВНОЕ ПРОСТРАНСТВО ДЛЯ КАЖДОГО ПИСЬМА
Даже если ваш сайт не относится к вычислениям, вы можете использовать моноширину для предоставления инструкций, примеров или подразумевающих машинописный текст. Буквы моноширины имеют одинаковую ширину для каждого символа, поэтому они всегда занимают одинаковое пространство на странице.
Пишущие машинки обычно используют моноширинные шрифты, и использование их на вашей веб-странице может дать вам ощущение того машинописного контента.
Некоторые примеры моноширинных шрифтов:
- курьер
- Новый Курьер
- Консоль Lucida
- Монако
Лучшая практика: моноширинные шрифты хорошо работают для образцов кода.
ФОНТАЛЬНЫЕ И СКРИПТНЫЕ ШРИФТЫ ТРЕБУЮТ ЧИТАТЬ
Фэнтезийные и скриптовые шрифты не так широко распространены на компьютерах, и в целом их трудно читать в больших кусках. В то время как вам может понравиться эффект дневника или другой личной записи, который может дать курсорный шрифт, у ваших читателей могут быть проблемы. Это особенно актуально, если ваша аудитория включает в себя носителей без языка. Кроме того, фэнтезийные и скорописные шрифты не всегда включают символы акцента или другие специальные символы, которые ограничивают ваш текст английским.
Используйте фэнтезийные и скорописные шрифты в изображениях, а также заголовки или выходы. Держите их короткими и помните, что любой шрифт, который вы выберете, вероятно, не будет на большинстве компьютеров ваших читателей, поэтому вам нужно будет доставить их с помощью веб-шрифтов.
Некоторые примеры фэнтезийных шрифтов:
- Медная тарелка
- Дездемона
- Влияние
- Kino
Trivia: Impact - это семейство шрифтов, которое, скорее всего, будет на компьютерах Mac, Windows и Unix.
Некоторые примеры скриптовых шрифтов:
- Apple Chancery
- Comic Sans MS
- Люсида Почерк
Общая информация: исследования показали, что шрифты, которые труднее читать, могут помочь учащимся сохранить больше информации.
Оригинальная статья Дженнифер Крынин. Под редакцией Джереми Жирара 9/8/17




