Надеюсь этой записью открыть серию статей, посвящённых типографике в целом и веб-типографике в частности.
Логически следующая статья будет посвящена использованию разнообразных пробелов и разделительных интервалов (такой заказ был в комментариях к статье о тире и дефисах пользователя besisland).
Итак, тезис статьи: «до тех пор, пока браузеры не имеют возможности динамически расставлять переносы в словах, вебмастеры должны забыть выключку по ширине как страшный сон».
Это значит, что нужно забыть CSS-конструкцию « text-align: justify; » и, если вы этого до сих пор не сделали, то выжечь калёным железом все воспоминания об « align=»justify» ».
Инь и ян типографики: ширина пробелов и правый край
Как показывает практика, неравномерность ширины межсловных пробелов в тексте отрицательно влияет на удобочитаемость уже в пределах одного абзаца (я подчёркиваю, именно «межсловных»).
Ровный правый край блока текста улучшает удобочитаемость на объёмах от половины стандартной страницы (при средней ширине строки), и только в случае однородности пробелов.
Таким образом, равномерность ширины пробелов на обычно коротких текстах в Интернете является гораздо более важной, чем выравнивание правого края.
Рукописи и ксилография
Подвижности литер нет (что написал, заново переписывать только с чистого листа, либо вырезать на новой деревяшке), возможность переноса — в «ручном» режиме.
Типографская печать (ручной набор, монотипы, линотипы)
Есть и подвижность литер (поподробнее о разгонке мы поговорим в будущей статье о пробелах), и возможность переноса в «ручном» режиме.
Печатная машинка
Снова нет подвижности литер, но переносы можно расставлять вручную.
Современные текстовые процессоры
Пытаются автоматически имитировать типографский процесс. Есть подвижность литер и возможность как автоматической расстановки переносов, так и ручной. Как ни удивительно, но даже в MS Word можно добиться приличного вида блока текста, выключенного по ширине, если в тексте расставить переносы.
Без переносов текст ужасен.
Браузеры
Первый в истории тип носителя, имеющий подвижность литер, но не имеющий возможности расстановки переносов. Помимо этого, строка может иметь практически любую ширину (ведь хорошие дизайнеры предусматривают возможное изменение размера шрифта пользователем!).Теперь, чтобы совместить равномерность пробелов и выравнивание по ширине, браузеры практически должны стать интерактивными текстовыми процессорами: либо автоматически расставляя переносы в реальном времени на произвольных объёмах текста, либо адекватно обрабатывая «мягкие переносы» так же в реальном времени.
До тех пор, пока этого не произошло, в плане типографики браузер недалеко ушёл от печатной машинки. Осознавая как этот факт, так и тот факт, что в недалёком будущем технологии разовьются до нормальной обработки переносов, дизайнер должен временно отказаться от CSS-конструкции « text-align: justify; ». Надеюсь, что от кода вида « p align=»justify» » вы уже давно отказались, потому что он является не рекомендуемым (deprecated) в HTML 4.01 и может в следующих версиях стандарта перейти в разряд «устаревшего» (obsolete).
Автор: Игорь Штанг
Графический и информационный дизайнер, автор курса «Типографика и верстка».
Памятка верстальщика вызвала большой резонанс, но, судя по комментариям в ЖЖ и на Awdee, мало кто понимает, почему всё именно так, как я нарисовал. Попробую объяснить на примерах. Сегодня речь пойдет о выключке по формату.
Хорошо
Особой требовательностью к набору отличались первопечатные книги. Вот, например, Николай Йенсон, 1474:
А это Альд Мануций, 1499:
Равномерные межбуквенные и межсловные пробелы делают набор однородно серым. В нем нет ни дыр, ни темных пятен. Тон полосы спокойный, прозрачный и легкий (определения Дмитрия Карпова).
Плохо
Плохи любые попытки сделать полную выключку в вебе и на мобильных устройствах. Компьютеры еще не научились правильно расставлять переносы и следить за величиной пробелов. Издание The Daily для айпада:
Здесь лучше, но текст всё равно слишком разреженный:
Полная выключка всегда работает плохо на узком формате. Тут необходим левый флаг или центровка:
Ошибки
Выключка по формату — неестественная форма существования текста, отсюда и многочисленные сложности. Ошибки, перечисленные в памятке, делятся на два вида: первые нарушают тон полосы (разреженные и сжатые строки), вторые — ее прямоугольность (висячие и концевые строки).
Висячие предлоги, союзы и другие короткие слова не являются ошибкой при полной выключке. Ими жертвуют ради однородного тона. Исключение составляют:
— однобуквенные слова в начале предложения,
— инициалы,
— маркеры списка (цифровые, буквенные и графические),
— сокращения вроде т. е., т. к., и т. д., и др.,
— цифры.
Как сделать в Индизайне
В первую очередь настраиваем вкладку Justification. Межсловное расстояние в интервале от 95 до 130%, межбуквенное — от −3 до 6%. Обратите внимание, что минимальное значение несильно отклоняется от желаемого (Desired): сжатые строки читать труднее, чем разреженные. Разрешаем масштабировать символы, но совсем чуть-чуть, от 99 до 101%:
Эти цифры получены опытным путем и лучше всего подходят для книжного набора: 50–60 символов в строке. Для узкой колонки правила нужно ослабить.
Обязательно включаем переносы во вкладке Hyphenation. Ползунок выкручен в сторону Better Spacing:
Если не включаются, значит, выбран не тот язык:
Галочка H&J Violations в панели Preferences подсветит желтым строчки, которые Индизайн не может разверстать по заданным цифрам:
Перечисленные выше настройки уже дадут сносный результат:
Дальше работаем руками — двигаем строки в проблемных абзацах. Есть несколько способов:
1. Иногда достаточно изменить место переноса в каком-нибудь слове — поставить символ мягкого переноса. Чтобы слово стало неразрывным, мягкий перенос должен стоять перед первой буквой.
Мак: Command + Shift + — (дефис)
Винда: Ctrl + Shift + —
2. Если переносы не помогли, крутим трекинг от −10 до 10 единиц. Трекинг увеличивает или уменьшает все пробелы в строке: и между словами, и между буквами. На горячих клавишах у Индизайна слишком большой шаг, поэтому я ими не пользуюсь.
Плюс 20 единиц:
Option + → (стрелка вправо)
Alt + →
Минус 20 единиц:
Option + ← (стрелка влево)
Alt + ←
3. Можно менять только межсловные пробелы, не трогая межбуквенные.
Плюс 20 единиц:
Command + Option + \ (бэкслеш)
Ctrl + Alt + \
Минус 20 единиц:
Command + Option + Delete
Ctrl + Alt + Backspace
4. Еще одно средство — масштабирование шрифта от 99 до 101%.
5. В сложных случаях слегка растягиваем или сужаем текстовый фрейм — не более, чем на 1–2 мм. (Этого никто не заметит.)
Изменения должны касаться всего абзаца, а не отдельных строк, потому что Индизайн «думает» об абзаце целиком и учитывает соседние строки. То есть сначала выделяем весь абзац, а потом крутим настройки.
С концевыми и висячими строками также справляемся с помощью вгонки и выгонки. Концевую строку, немного не доходящую до края, втягиваем, чтобы пробел стал более внятным, либо доводим до правой границы (см. первый абзац на предыдущей картинке). О допустимости висячих строк можно долго спорить, однако в традиционной книжной верстке они запрещены.
Нельзя менять интерлиньяж и добавлять пробелы между абзацами. Как говорит Брингхерст, «такие фокусы разрушают ткань текста и… поражают книгу в самое сердце».
В конце еще раз внимательно смотрим на полосу, особенно на правый край. Проверяем правильность переносов.
Выравнивание текста
Выравнивание или выключка текста
Текст может быть выровнен по одному или по обоим краям (отступам) текстового фрейма. Текст считается выключенным, если он выровнен с обеих сторон. Можно выбрать выравнивание всего текста в абзаце, кроме последней строки («Выключка по левому краю» или «Выключка по правому краю»), либо включая ее («Выключка по формату»). Если последняя строка содержит всего несколько символов, то, возможно, нужно будет применить специальный символ конца материала и создать концевую шпацию.
При выключке текста при помощи компоновщика абзацев Adobe, чтобы обеспечить одинаковую плотность текста в абзаце и его визуальную привлекательность, InDesign производит смещение текста. Можно произвести точную подстройку интервалов в выключенном тексте.
При размещении текста по центру или выключке текста в сетке фрейма текст больше не будет выравниваться точно по сетке. Можно также задать выравнивание для всех абзацев в сетке фрейма.
Применение к абзацу параметра «Выключка к корешку» приводит к тому, что текст левой страницы разворота выравнивается по правому, а правой – по левому краю. Аналогичным образом, применение к абзацу параметра «Выключка от корешка» приводит к тому, что текст левой страницы разворота выравнивается по левому краю, а правой страницы – по правому.
В вертикальных фреймах выключка к корешку или от корешка не оказывает никакого эффекта, поскольку выключка текста выполняется параллельно направлению корешка.
Если требуется выравнивание левого края текста по левому краю, а правого — по правому, установите точку ввода в том месте, где нужно выровнять текст по правому краю, нажмите клавишу «Tab», затем выровняйте по правому краю оставшийся текст строки.
Выравнивание абзацев по сетке из базовых линий
Сетка из базовых линий представляет интерлиньяж основного текста документа. Это значение может быть кратно изменено для всех элементов страницы, чтобы гарантировать, что текст всегда будет выровнен по столбцам и страницам. Например, если основной текст в документе имеет интерлиньяж 12 пунктов, то для текста заголовка можно задать интерлиньяж в 18 пунктов и добавить отступ 6 пунктов перед абзацами, которые находятся перед заголовком.
Использование сетки из базовых линий гарантирует единообразие размещения текстовых элементов на странице. Она позволяет настроить интерлиньяж абзаца таким образом, чтобы его базовая линия была гарантированно выровнена по основной сетке страницы. Этот метод можно использовать в том случае, если базовые линии текста находятся в нескольких столбцах, а также при выравнивании смежных текстовых фреймов. Параметры сетки из базовых линий изменяются в разделе «Сетка и направляющие» диалогового окна «Установки».
Можно выровнять по сетке из базовых линий только первую строку абзаца, что позволит остальным строкам сохранить ранее заданные значения интерлиньяжа.
Для просмотра сетки из базовых линий выберите меню «Вид» > «Сетка и направляющие» > «Показать базовую сетку».
Сетка из базовых линий отображается на экране только в том случае, если масштаб документа больше минимального масштаба отображения линий, заданного в разделе установок «Сетка и направляющие». Для их отображения может потребоваться увеличение масштаба отображения.
Выключка (типографика)
Содержание
Варианты выключки
Выключка влево
В русском и большинстве европейских языков, в которых слова читаются слева направо, выравнивание текста чаще всего производится слева. Это означает, что текст абзаца выравнивается по левой стороне и обрывается на правой стороне. При верстке для размещения в сети Интернет текстов, читаемых слева направо, этот способ выравнивания применяется по умолчанию. [2]
Выключка вправо
В других языках, таких как арабский и иврит, в которых чтение текста происходит справа налево, его выравнивание обычно так же делается справа. Кроме того, выравнивание по правому краю используется в английском языке для выделения специального текста, такого, как ссылки на источники цитирования, печатаемого в книгах и журналах, а также широко применяется для форматирования таблиц данных.
Выключка по формату
Выключка по формату является общим методом выравнивания, применяемым в печатной продукции, где промежуточное расстояние между словами и, в меньшей степени, между глифами или буквами, разрежено или сжато, с целью выровнять как правый, так и левый конец каждой строки текста. При использовании выключки по ширине последнюю строку абзаца принято выносить отдельно простым выключением строки вправо или влево, в зависимости от языковых особенностей написания. Строки, в которых расстояния растянуты сверх нормальной длины, называются строками с неполной выключкой, в то время как строки со сжатыми расстояниями — строками с плотной выключкой. Применяется для больших блоков текста после расстановки переносов.
Полная выключка
Также известна как «принудительная». При её использовании не только основная часть абзаца, но и его последняя строка выравнивается по формату области печати. При этом текстовый блок приобретает очертания ровного прямоугольника.
Выключка по центру
Текст также может быть выравнен по центру, или расположен симметрично оси колонки набора. Такой способ выключки часто применяется для выделения заголовков, стихов и песен. Также, как и выключка вправо, часто используется для выравнивания данных в таблицах. Текст с большим числом строк, выравненный по центру, считается менее читаемым, так как читателю сложнее визуально перемещаться на следующую строку.
Автор: Игорь Штанг
Графический и информационный дизайнер, автор курса «Типографика и верстка».
Это завершающая статья про выключку. Поговорим о правом флаге — самом редком и самом спорном виде выравнивания.
Сначала об очевидном. Правая выключка неестественна для нашей письменности и читать ее сложнее. Глазу трудно находить следующую строку, потому что она всегда начинается с произвольного отступа.
Зачем же тогда ее используют? Как ни странно, но чаще всего абсолютно низачем, просто потому что есть такая кнопка в редакторе. Случаев, когда правая выключка бывает уместна, не так уж много. Давайте разберемся, для каких целей она подходит, а для каких не очень. У меня получилось четыре пункта.
1. Выровнять правый край макета
Эта цель самая странная. Новичкам иногда кажется, что блок текста должен наглухо закрывать правую сторону макета, то есть быть абсолютно ровным с правой стороны. Никакого смысла в этом приеме нет: и макет красивее не становится, и удобочитаемость падает.
Здесь верхний текст нужно выключить по левому краю и на этом успокоиться:
То же самое с колонкой чисел:
Два рваных края смотрят друг на друга и образуют бесформенную дыру посередине:
2. Показать связь текста с элементом справа
В интерфейсных формах подписи иногда выключают вправо, чтобы они были ближе к полям и контролам:
В таблицах так же связывают боковик с данными:
Связь между колонками становится заметнее, но внешний вид текста из-за этого портится. В большинстве случаев достаточно просто не отодвигать первую колонку слишком далеко от остальных:
Если мешают длинные строчки, это можно исправить. Например:
Уменьшить ширину колонки. Выступающий текст разобьется на несколько строк:
Сократить текст. В отдельных случаях могут понадобиться сноски:
Добавить линейки, отточия или другие связующие элементы. Они частично скроют дыры после коротких строк. Прием подходит для динамических данных, когда форму текста нельзя контролировать:
Другое дело — карты и схемы, здесь правая выключка бывает необходима. В компактной верстке выравнивание часто остается единственным способом связать подпись с объектом:
Илья Бирман. Фрагмент схемы московского метро. 2016
По правому краю принято выравнивать первую колонку в титрах и вообще в любых списках с именами. Это традиционное решение, тут ничего не скажешь:
Йозеф Мюллер-Брокманн. Фрагмент концертного плаката. 1953
С помощью выключки можно обозначить связь подписи с иллюстрацией, прием достаточно редкий:
Страница из книги «Фрески Ярославля». Дизайнер Николай Калинин. 1969
3. Передать симметричную структуру
Иногда сама информация подталкивает к симметричной верстке, к сочетанию правой и левой выключки. Например, так показывают игровой счет:
Или оформляют листалки в интерфейсах:
Правый флаг здесь действительно оправдан, но не обязателен. Даже симметричную структуру можно передать несимметрично:
4. Сделать нестандартно
Иногда спрашивают: если правая выключка не очень, почему тогда она есть на образцово-показательных швейцарских плакатах? Отвечаю. Во-первых, не стоит принимать каждый швейцарский плакат за эталон. Во-вторых, правый флаг там встречается довольно редко. В-третьих, плакаты на то и нужны, чтобы экспериментировать. Это акцидентный набор, никаких правил для него не существует. Вот несколько примеров.
Здесь дизайнер выстраивает текст по ступенькам:
Зигфрид Одерматт. 1981
Тут с помощью выключки рисует невидимый прямоугольник (наверно):
Йозеф Мюллер-Брокманн. 1979
А тут сами придумайте что:
А как же числа в таблицах?
Числа в таблицах иногда действительно выключают по правой краю, чтобы они выровнялись по разрядам: единицы встали под единицами, десятки под десятками и т. д. Внешне это может выглядеть как правый флаг, но корректней называть такое выравнивание выключкой по знаку, а именно по запятой. Дело в том, после запятой может быть разное количество знаков, и тогда правый флаг сломает выравнивание:
О выключке по знаку я рассказал в отдельной статье.
Одну строчку можно
И последнее. Нет ничего страшного в том, чтобы поставить справа одну строчку текста, например, подпись, посвящение или эпиграф. Проблема правой выключки — рваный край, но тут его нет: