ADV.Systems

09 Июл 2017

Основы типографики

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

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

Первое что хотелось бы отметить – использование читабельного шрифта. Нередко заказчик настаивает на корпоративной гарнитуре, например Times New Roman, не взирая на то, что принятый им дизайн-концепт никак не соответствует ей. При этом он не стесняется в выражениях, относительно критики подходящей графики.

Изначально хотелось бы отметить, что гарнитуры, используемые в полиграфических материалах заказчика далеко не всегда могут быть использованы в Web-интерфейсах. Это большей частью связано с тем, что восприятие русского текста существенно отличается от латинского шрифта и необходимо учитывать физиологические особенности восприятия текста с монитора. Наиболее удобными для восприятия русского языка можно назвать такие гарнитуры как Tahoma, Verdana, MyriadPro. Что касается последнего – он не идёт в стандартной поставке операционных систем, но неплохо сочетается с первыми двумя.

Так же необходимо заметить, что типографика в Web-пространстве тесно связана со спецификацией HTML. Например красная строка, переносы слов по слогам стандартными средствами не предусмотрены. Безусловно можно использовать различные приёмы для достижения цели (Текст абзаца или создать в CSS псевдо-класс :first-letter), но это является скорее приёмом, а не стандартом. При этом отсутствие красной строки не будет ошибкой в соответствии со спецификацией W3C. Однако это не отменяет классических правил грамматики и вёрстки.

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

Тем не менее существует целый ряд правил, определяющих правила набора текста

1. В русских текстах используются «ёлочки». Для английского языка это совершенно неприемлемо: стандартными являются ?такие? или “такие”кавычки. Что касается значка дюйма (“), то он применяется исключительно в исходных текстах программ, иногда в электронной переписке (на самом деле знак дюйма применяется так широко в электронных текстах потому, что его непосредственно можно набрать с клавиатуры в текстовом режиме.

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

3. В интернете часто используются знаки “знак охраны авторского права” © и “символ зарегистрированного товарного знака” ®. Писать их нужно именно так – комбинации (c) и (r) не годятся.

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

5. Недопустимой считается и слишком маленькая последняя строка абзаца.

И это лишь небольшая часть правил…
(Примеры с сайта http://yapro.ru)

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

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