{"id":13516,"url":"\/distributions\/13516\/click?bit=1&hash=37bd7b4748a2966bbc26730b25e2618c42f364e4b1fef4e1064b7cb954a0c2b0","title":"\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0438\u043d\u0432\u0435\u0441\u0442\u0438\u0446\u0438\u0438 \u043e\u0442 \u00ab\u0413\u0430\u0437\u043f\u0440\u043e\u043c \u043d\u0435\u0444\u0442\u0438\u00bb","buttonText":"\u0417\u0430 \u0447\u0442\u043e?","imageUuid":"9ff0d7f7-ef07-5cab-961b-7241d5749f52","isPaidAndBannersEnabled":false}
Дизайн
grafdesigna

Шпаргалка: восемь правил типографики, которые спасут любой текст

Мини-правила, о которых я расскажу, скорее подходят для небольшой полиграфии, рекламных баннеров на бумаге, в интернете и других носителях, которые содержат небольшое количество текста.

При вёрстке книг и журналов или в веб-дизайне некоторыми правилами лучше пренебречь или хорошо задуматься пред их использованием.

Начнём!

Исходный текст

Я специально создал этот небольшой ужас, чтобы прогнать его по всем правилам из шпаргалки. Прошу заметить, что данный текст не несёт никакой смысловой нагрузки. Представим его манекеном для тренировок.

1\Интерлиньяж

Добавьте воздуха тексту. Интерлиньяж (межстрочное расстояние) текста должен быть равен примерно 100–110% от размера шрифта для заголовков и 120–140% для обычного текста. Если размер заголовка 60 pt, то интерлиньяж должен быть равен примерно 66 pt. Это правило не строгое, потому что многое зависит от размера шрифта, его гарнитуры, ширины колонки и т.д.

Иногда для заголовков приходится делать интерлиньяж даже меньше кегля шрифта.

2\Тире и дефис

Соблюдайте правила русского языка, правильно расставляйте запятые, отличайте тире от дефиса. Тире на клавиатуре (Windows)— Alt + 0151.

3\Висячие предлоги

Если предлог стоит в конце строки, он называется «висячий». Если визуально кажется, будто он небрежно «торчит» из строки, то переносите его на следующую, а тире наоборот переносить не нужно.

4\Кавычки-ёлочки

Используйте кавычки «ёлочки» вместо кавычек „лапок”. Лапки используйте только внутри ёлочек, если нужны кавычки внутри кавычек.

Пример: «… „…”… »

5\Висячая пунктуация

Знаки, как скобки и кавычки с левой стороны выносите за линию текста. Если текст выровнен и справа, то справа также выноси запятые, точки, кавычки, скобки. Тире и дефисы в таком случае переносятся на треть или наполовину.

На самом деле это правило спорное, и я больше склоняюсь к тому, чтобы пользоваться им крайне редко и не во всех случаях. Подробнее об этом у Игоря Штанга.

Неверный пример

Скорее всего, это не должно выглядеть так, как выше. Более правильным кажется не полное вынесение пунктуацию за линию, а частичное: на четверть или на треть.

6\Буква «ё»

Никогда не игнорируйте буквы «ё» и «й». Они имеют равно те же права на существование, что и остальные буквы.

7\Оишбки

Всегда проверяйте макет на ошибки, удаляйте двойные пробелы.

8\Кернинг

Пользуйтесь кернингом, чтобы поправить расстояние между символами там, где это выглядит неровно. Для проверки: площадь пространства между символами должна быть одинаковой.

Финал

Спасибо за прочтение, но и вы выразите благодарность:)

Чтобы выразить её, перейдите и подпишитесь на мои соцсети.

Мои блоги в ВКонтакте и на Facebook о дизайне;
Моё портфолио;
Статьи для недизайнеров и владельцев бизнеса.

0
44 комментария
Написать комментарий...
Андрей Дерюгин

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

Ответить
Развернуть ветку
Гордый коктейль

ага класс вспоминаю раннего Лебедева

Ответить
Развернуть ветку
Egor Komarov

Интерлиньяж, кстати, не совсем ок в примере.

Ответить
Развернуть ветку
Sabit Sugirov

да, его бы сделать больше

Ответить
Развернуть ветку
Egor Komarov

ну и Bold можно было бы убрать 😄

Ответить
Развернуть ветку
Андрей Кириллов

Предлагаете исправить ошибки, начните с себя. Например, "Они имеют равно те же права" должно писаться через "ровно" (и да, кавычки тут не исправляются автоматом на ёлочки).

Ответить
Развернуть ветку
grafdesigna
Автор

Вообще то равно я правильно написал)

Ответить
Развернуть ветку
Artem Petrenkov

В данном случае нужно писать "ровно". Различаются по месту ударения: "рОвно" и "равнО".

Кроме того:
"а тире наоборот переносить не нужно" - вводное слово "наоборот" выделяется запятыми;
"Знаки, как скобки и кавычки с левой стороны выносите за линию текста. Если текст выровнен и справа, то справа также выноси запятые, точки, кавычки, скобки." - после сравнительного оборота с союзом "как" тоже нужна запятая, "выноси" - необоснованный переход на "ты" (в остальном тексте везде "вы").

Ответить
Развернуть ветку
grafdesigna
Автор

Я имел ввиду равные права, а не ровные. Что не так-то?)

Ответить
Развернуть ветку
Artem Petrenkov

Само собой, но в выражении "ровно те же" слово "ровно" имеет разговорное значение "совершенно, совсем" (http://gramota.ru/slovari/dic/?bts=x&word=%D1%80%D0%BE%D0%B2%D0%BD%D0%BE). Ещё раз: в данном случае выбор написания носитель языка легко может сделать по ударению — произносится "рОвно" или "равнО", но не иначе. Вы же, надеюсь, не произносите: "Они имеют равнО те же права".

Ответить
Развернуть ветку
grafdesigna
Автор

Справедливо. Русский в школе преподаёте?

Ответить
Развернуть ветку
Станислав Калашников

Достаточно было ходить в эту школу. Это элементарные, базовые знания.

Ответить
Развернуть ветку
Artem Petrenkov

Нет :)

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
grafdesigna
Автор

Здорово)

Ответить
Развернуть ветку
Никита Сила

Ваше «стало» нужно использовать, как «было» для исправления нормальному дизайнеру)

Ответить
Развернуть ветку
Унылый Дорси

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

«Надёжные»
правила типографики –
успех твоего макета,
даже если это баннер
из какого-то текста.

А если пространство позволяет, то

«Надёжные» правила типографики –
успех твоего макета, даже если это баннер
из какого-то текста.

Ну, и длинное тире, как по мне — это лишний пафос.

Ответить
Развернуть ветку
Егоръ Мышляевъ

Длинное тире — правило русского языка, а не какой-то пафос

Ответить
Развернуть ветку
Унылый Дорси

Но обычное тире утилитарнее в моих обстоятельствах.

Ответить
Развернуть ветку
Егоръ Мышляевъ

В каких обстоятельствах, позвольте поинтересоваться?
Я может просто не так понял и сижу тут умничаю.

Ответить
Развернуть ветку
Унылый Дорси

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

Ответить
Развернуть ветку
Станислав Калашников

Может, проблема именно в том, что журнал "местный"? Топовый глянец такой херни себе не позволяет.
https://www.vogue.ru/

Ответить
Развернуть ветку
grafdesigna
Автор

В топовом журнале чё-то шрифты нечитаемые(

Ответить
Развернуть ветку
Станислав Калашников

С тире-то нормально всё, претензий нет?

А сверх-контрастные шрифты — это для нормальных мониторов.

Ответить
Развернуть ветку
grafdesigna
Автор

Не обижайте мой монитор :(

Ответить
Развернуть ветку
Artem Petrenkov

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

Ответить
Развернуть ветку
Унылый Дорси

Топовый глянец в виде Вог не использует Ё. Представим ситуацию, когда русский журнал издаётся в Германии на немецком, например, и такой: ой, эти ваши умляуты лишние.
Я сейчас не смогу привести примеры, к сожалению. Нет под рукой ни Харперс базар, ни Офисьель, ни, в противовес, исконно русских журналов. Но вот я взял Кутзее издательства Virgin, и там тире обычное, не длинное. Подчеркну: скорее всего, есть тенденция.
Беру Book of the British Countryside – тире нормальное. New Book of Knowledge — тире длинное. Стандарта нет, а если и есть, то они локальные и летс зэ великая битва тупоконечников и остроконечников бегин.

Ответить
Развернуть ветку
Artem Petrenkov

Так русская типографика берёт корни из континентальной типографики: французской и немецкой, а никак не британской.

Ответить
Развернуть ветку
Унылый Дорси

Так и я о чём говорю: издательский дом, который издаёт упомянутый Vogue, пришёл со своими стандартами.

Ответить
Развернуть ветку
Кирилл Табасов

А мне текст слева больше нравится, можете считать меня больным :)) справа размазан и безлик стал от слова совсем. Добавить орфографию пунктуацию и норм

Ответить
Развернуть ветку
Fedor Nikiforov

Существует еще один способ определить какой из макетов лучше: прищурьтесь и посмотрите на оба текста.

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

Ответить
Развернуть ветку
Юрий

*facepalm

Ответить
Развернуть ветку
grafdesigna
Автор

Проблемы?)

Ответить
Развернуть ветку
Artem Petrenkov

Для начала: слова "январь", "физика" и "фотоэффект" в середине предложения должны писаться со строчной буквы.

Далее: "4-х" — вредная привычка пытаться добавлять окончание ко всем числительным, тогда как это требуется только для порядковых. Должно быть просто "до 4 первичных баллов".

В диапазонах чисел тире традиционно не отбивается пробелами. Должно быть "9—10 января".

Наконец, множество переносов в тексте и заголовках здесь, несмотря на отсылку к дизайну логотипа, смотрится весьма неряшливо.

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Константин Рогов

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

Ответить
Развернуть ветку
Dmitriy Dorian

"И эти люди не разрешают мне ковырять в носу". 

Ответить
Развернуть ветку
Артём Вечера

Хороший пост

Ответить
Развернуть ветку
Nikolay Pomeschenko

Ё - это святое. Мне не сложно использовать, как стал печатать слепым методом :)

Ответить
Развернуть ветку
Valeria V.

Спасибо за «ё»))

Ответить
Развернуть ветку
La Noche Oscura

Альт 0151 это длинное тире, альт 0150 стандартное

Ответить
Развернуть ветку
Оксана Пономарева
Ответить
Развернуть ветку
aven

Интерлиньяж оч непонятный

Ответить
Развернуть ветку
Avdotii Pedishnii

Столько условий для кавычек... Стараюсь обходиться без них. Красным выделяю кавычное слово

Ответить
Развернуть ветку
Сергей Чекуров

А я - не профессионал, мне всё понравилось ((

Ответить
Развернуть ветку
Валерия Князева

Спасибо

Ответить
Развернуть ветку
Читать все 44 комментария
null