Шрифты: дизайн против типографии

27 апреля 2023, 13:22

Грамотная классическая подача текста против нововведений. Что из того, что недавно открыли и доказали веб-дизайнеры, действительно работает. Как читает современный человек и почему он уходит со страницы.

В современном понимании типография — это то, что умерло вместе с газетами, однако, — нет. Вообще нет.

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

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

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

Итак, к конкретике. Что мешает хорошей статье? Излишество дизайна. Нельзя пытаться отдизайнить текст по полной, потому что он — подобие интерьера. Всё над чем вы властны в царстве букв — это их форма, их цвет, их расположение, их размер. Не делайте колонок. Глаза вынуждены скакать со строчки на строчку. И такой формат больше напоминает женские журналы со слезливыми историями актрисулек. Колонки так же вредны для восприятия, как и слишком длинная строка.

Кто-нибудь помнит этот ужас со старых сайтов, где текст был на всю длину браузерного окна в компьютере, причём каким-то жутким 8 или 9 шрифтом? В одной строке должно быть не меньше пяти слов и не больше 75 символов. А если у вас не милипиз*рический нечитаемый шрифт и больше пяти слов в строке, то формат колонки вообще отпадает сам собой. Этот формат подходит для главных страниц, где о материале достаточно двух колоночных строк, потому что такие страницы служат для статей оглавлением в книге: не всегда хватает лишь названия, 1-2 предложения в описании тоже нужны, чтобы заинтересовать. Почему не делать описания на главной в одну строку? Потому что главная страница сайта — это его витрина, как раз там взгляд скачет по картинкам и блокам, а не плавно скользит по тексту.

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

Главная сайта — его витрина. Она должна быть яркой, но не нелепой и аляпистой.

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

Когда открывают статью, её (о Боги!) хотят читать. Поэтому абсолютно неважно, какого размера ваш печатный шедевр: 10 предложений или 1000, — здесь уж, будьте добры, обеспечьте полное погружение. Для основного текста статьи желателен шрифт с засечками (можно совсем лёгкими, но засечками). Это помогает сосредоточиться на тексте и дочитать статью до конца чисто психологически. Так же подобный ход поможет «активировать» баннерную слепоту, и читатель не будет беситься из-за рекламы.

Дизайнеры уже извелись с советом «делать текст мягче» за счёт изменения цвета шрифта. Как правило, его делают светлее или вообще коричневым. Давайте запомним, что хороший дизайн — это дизайн, которого не видно. То есть вы не начинаете подмечать крутых деталей, а просто не отвлекаясь читаете и вам легко это делать. Классический цвет — чёрный и единственное, к чему можно от него убежать, это тёмно графитовый. Он действительно не так раздражает взгляд и не напрягает читателя за счёт уменьшения сильного контраста между текстом и фоном. Но если шрифт абсолютно без засечек, да к тому же и не чёрный, — не губите себя и сделайте его хотя бы толще.

Перейдём к размерам. В нулевых было нормально использовать 8-12 шрифты, так как это было классикой для печати в книгах и газетах. Сейчас такая мелочь — дурной тон. Начинают обязательно от 14 или 16. И правило «чем больше, тем лучше» работает не потому, что все резко стали подслеповаты, а потому что так проще читать всем. Да и текст становится психологически понятнее, ближе и доверительнее. Важен не только размер букв, но и расстояние между строчками: оно ни в коем случае не должно быть меньше высоты самих букв. Одна маленькая хитрость: чем уже строка — тем уже межстрочное расстояние.

Восприятие текста человеком зависит не только от того, насколько он качественный, но и от ритма его жизни. В зависимости от того, как часто его отвлекают, он по разному воспринимает один и тот же материал. А отвлекать его могут не только внешние раздражители вроде телефонного звонка или людей вокруг, но и сам сайт. Баннеры, анимация и прочая навязчивая реклама постоянно уводит внимание от основного материала. Спасение от этого только одно — грамотная подача с учётом всего того, что было разобрано выше. Мягкий цвет расслабляет и втягивает, крупный шрифт увеличивает скорость восприятия, межстрочное расстояние уменьшает информационную нагрузку и напряжение, засечки помогают взгляду цепляться и фиксироваться — поэтому баннеры человек автоматически и бессознательно отфильтрует, а после внешнего раздражителя быстро вернётся к тексту и найдёт место, где его прервали. Хороший материал, должен легко восприниматься. А уродливая и вычурная подача нужна только в случаях с низкосортным текстом, неинтересной темой и удовлетворяет лишь цель «выделиться на фоне».