Артём Гор­бу­нов

Типографика и вёрстка

🔍 Начните печатать, чтобы искать по книге или перейти к нужной странице по номеру

Удобно листать не только прокруткой, но и клавишами‑стрелками:

 
между важными местами
Shift
между
разворотами

Моему деду — Валерию Горбунову, писателю, газетчику и остроумному человеку

Моему деду — Валерию Горбунову, писателю, газетчику и остроумному человеку

Артём Гор­бу­нов

Типографика и вёрстка

Изда­тель­ство Бюро Гор­бу­нова
2015
Артём Горбунов

Типографика и вёрстка

Издательство Бюро Горбунова
2015
удк 655.262
ббк 85.15
г67
Гор­бу­нов А. С.
г67
Типо­гра­фика и вёрстка. —
М.: Изд‑во Бюро Гор­бу­нова, 2015
ISBN 978‑5‑9907024‑0‑0

Пер­вая книга Изда­тель­ства Дизайн‑бюро Артёма Гор­бу­нова — прак­ти­че­ское руко­вод­ство по типо­гра­фике и вёрстке с акцен­том на маке­ти­ро­ва­нии для экрана. Учеб­ник пред­на­зна­чен для дизай­не­ров, редак­то­ров и разработчиков.

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

«Типо­гра­фика и вёрстка» после­до­ва­тельно отве­чает на вопрос как. Автор вво­дит прин­ципы модуль­но­сти и якор­ных объ­ек­тов, пра­вило внут­рен­него и внеш­него. Затем шаг за шагом наглядно объ­яс­няет, как добиться акку­рат­ной и плот­ной вёрстки сай­тов, сер­ви­сов и СМИ.

УДК 655.262
ББК 85.15

Оглавление

удк 655.262
ббк 85.15
г67
г67
Горбунов А. С.
Типографика и вёрстка. —
М.: Изд‑во Бюро Горбунова, 2015
ISBN 978‑5‑9907024‑0‑0

Первая книга Издательства Дизайн‑бюро Артёма Горбунова — практическое руководство по типографике и вёрстке с акцентом на макетировании для экрана. Учебник предназначен для дизайнеров, редакторов и разработчиков.

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

«Типографика и вёрстка» последовательно отвечает на вопрос как. Автор вводит принципы модульности и якорных объектов, правило внутреннего и внешнего. Затем шаг за шагом наглядно объясняет, как добиться аккуратной и плотной вёрстки сайтов, сервисов и СМИ.

УДК 655.262
ББК 85.15

Оглавление

1
Основы
вёрстки

Правило внутреннего и внешнего

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

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

1
Основы
вёрстки

Правило внутреннего и внешнего

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

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

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

Совре­мен­ный дизай­нер так и соби­рает зна­ния по кру­пи­цам — из книг, сове­тов кол­лег, заме­ча­ний арт‑директора.

Запом­нить даже пере­чис­лен­ные пра­вила довольно затруд­ни­тельно. Если дизай­нер и вызуб­рит соб­ствен­ный набор пра­вил, все­гда най­дутся такие, о кото­рых он не слы­шал, — копилка‑то бесконечна.

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

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

«Пра­вило внут­рен­него и внеш­него» — базо­вый прин­цип типо­гра­фики, рабо­та­ю­щий на всех уров­нях от буквы до разворота.

Пра­вило внут­рен­него и внеш­него — это част­ный слу­чай тео­рии бли­зо­сти. Типо­гра­фи­че­ский объ­ект любого уровня состоит из дру­гих объ­ек­тов: буквы из штри­хов, слова из букв, строки из слов, абзацы из строк.

И для того чтобы объ­ект имел само­сто­я­тель­ное зна­че­ние, то есть буква, слово, строка и абзац отде­ля­лись от сосед­них, его внут­рен­ние рас­сто­я­ния должны быть меньше внешних.

Современный дизайнер так и собирает знания по крупицам — из книг, советов коллег, замечаний арт‑директора.

Запомнить даже перечисленные правила довольно затруднительно. Если дизайнер и вызубрит собственный набор правил, всегда найдутся такие, о которых он не слышал, — копилка‑то бесконечна.

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

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

«Правило внутреннего и внешнего» — базовый принцип типографики, работающий на всех уровнях от буквы до разворота.

Правило внутреннего и внешнего — это частный случай теории близости. Типографический объект любого уровня состоит из других объектов: буквы из штрихов, слова из букв, строки из слов, абзацы из строк.

И для того чтобы объект имел самостоятельное значение, то есть буква, слово, строка и абзац отделялись от соседних, его внутренние расстояния должны быть меньше внешних.

Скрыто 169 разворотов

Гор­бу­нов Артём Сергеевич

Типо­гра­фика и вёрстка

  • Aвтор и арт‑дирек­тор Артём Горбунов

  • Дизай­нер Алек­сандр Кан

  • Фото­граф Вла­ди­мир Колпаков

  • Кал­ли­граф Анна Данилова

  • Мет­ран­паж и соав­тор тестов
    Сер­гей Фролов

  • Раз­ра­бот­чики Рустам Кул­ма­тов,
    Васи­лий Полов­нёв
    и Андрей Ерес

  • Книга набрана шриф­тами
    «Бюро­се­риф» и «Бюросанс»

  • Дизайн‑бюро Артёма Гор­бу­нова
    Большая Новодмитровская улица,
    дом 36, стро­е­ние 2
    Москва, Рос­сия, 127015

Горбунов Артём Сергеевич

Типографика и вёрстка

  • Aвтор и арт‑директор Артём Горбунов

  • Дизайнер Александр Кан

  • Фотограф Владимир Колпаков

  • Каллиграф Анна Данилова

  • Метранпаж и соавтор тестов
    Сергей Фролов

  • Разработчики Рустам Кулматов,
    Василий Половнёв
    и Андрей Ерес

  • Книга набрана шрифтами
    «Бюросериф» и «Бюросанс»

  • Дизайн‑бюро Артёма Горбунова
    Большая Новодмитровская улица,
    дом 36, строение 2
    Москва, Россия, 127015