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

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

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

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

http://d.pr/i/16l92http://d.pr/i/16l92http://d.pr/i/16l92
 
http://d.pr/i/16l92http://d.pr/i/16l92http://d.pr/i/16l92
между важными местами
http://d.pr/i/16l92http://d.pr/i/16l92http://d.pr/i/16l92
Shift
http://d.pr/i/16l92http://d.pr/i/16l92http://d.pr/i/16l92
между
разворотами

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

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

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

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

Изда­тель­ство Бюро Гор­бу­нова
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

Оглавление

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

Плохо

Хорошо

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

Поэто­му допол­ни­тель­ный воз­дух и под­пи­си луч­ше «отжи­мать» к кра­ям галереи.

Плохо

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

Хорошо

Поэто­му допол­ни­тель­ный воз­дух и под­пи­си луч­ше «отжи­мать» к кра­ям галереи.

Текстовая страница

Приве­дём реко­мен­да­ции по вёрст­ке экран­ной тек­сто­вой стра­ни­цы со ста­тьёй, замет­кой, книж­ной гла­вой или тек­стом о компании.

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

Модульная

Текстовая

Основ­ной текст

Колон­ка основ­но­го тек­ста зани­ма­ет 60⁠—70% шири­ны окна ком­пью­тера или план­шета. В «рези­но­вой» вёрст­ке шири­на тек­сто­вой поло­сы умень­ша­ет­ся или уве­ли­чи­ва­ет­ся с изме­не­ни­ем раз­ме­ра окна или экра­на. Но раз­ре­ше­ние экра­нов посто­ян­но рас­тёт, поэто­му име­ет смысл огра­ни­чи­вать мак­си­маль­ную шири­ну колон­ки тек­ста, чтобы стро­ки не ста­но­ви­лись чрез­мер­но длин­ны­ми, а стра­ни­ца — труд­ной для чтения.

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

Текст, выров­нен­ный вле­во с рва­ным пра­вым кра­ем, дол­жен «дышать» спра­ва, то есть край фор­ма­та или сосед­няя колон­ка не долж­ны под­хо­дить к нему слиш­ком близко.

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

Текстовая страница

Приве­дём реко­мен­да­ции по вёрст­ке экран­ной тек­сто­вой стра­ни­цы со ста­тьёй, замет­кой, книж­ной гла­вой или тек­стом о компании.

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

Модульная страница

Текстовая страница

Основ­ной текст

Колон­ка основ­но­го тек­ста зани­ма­ет 60⁠—70% шири­ны окна ком­пью­тера или план­шета. В «рези­но­вой» вёрст­ке шири­на тек­сто­вой поло­сы умень­ша­ет­ся или уве­ли­чи­ва­ет­ся с изме­не­ни­ем раз­ме­ра окна или экра­на. Но раз­ре­ше­ние экра­нов посто­ян­но рас­тёт, поэто­му име­ет смысл огра­ни­чи­вать мак­си­маль­ную шири­ну колон­ки тек­ста, чтобы стро­ки не ста­но­ви­лись чрез­мер­но длин­ны­ми, а стра­ни­ца — труд­ной для чтения.

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

Текст, выров­нен­ный вле­во с рва­ным пра­вым кра­ем, дол­жен «дышать» спра­ва, то есть край фор­ма­та или сосед­няя колон­ка не долж­ны под­хо­дить к нему слиш­ком близко.

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

Подзаголовки

Основ­ной текст име­ет один глав­ный заго­ло­вок пер­во­го уров­ня и дро­бит­ся на части с помо­щью подзаголовков.

Кегль заго­лов­ков вто­ро­го уров­ня обыч­но уве­ли­чен по срав­не­нию с основ­ным тек­стом. Перед таки­ми заго­лов­ка­ми про­пус­ка­ют при­мер­но две стро­ки, после дела­ют отступ, рав­ный отступу швей­цар­ского абзаца — как у над­пи­си «Подза­го­лов­ки» на этом развороте.

Заголов­ки тре­тье­го уровня

Заголов­ки тре­тье­го уров­ня удоб­но наби­рать полу­жир­ным основ­но­го кег­ля и не отби­вать от после­ду­ю­ще­го тек­ста, как над колон­ка­ми тек­ста на раз­во­роте бренд­бука Скайсканера.

Подза­го­ло­вок в под­бор к основ­но­му тексту. Ещё один спо­соб избе­жать лиш­них отсту­пов на странице.

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

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

Подза­го­лов­ки в иерар­хии могут быть оформ­ле­ны ком­би­на­ци­ей раз­ных сти­лей: кег­ля, полу­жир­но­го начер­та­ния, капи­те­ли, кур­си­ва и выде­ле­ния цве­том. Глав­ные пра­ви­ла — чере­до­ва­ние, то есть яркий кон­траст сти­ля заго­лов­ков на сосед­них уров­нях вло­жен­но­сти, и чув­ство меры.

Подзаголовки

Основ­ной текст име­ет один глав­ный заго­ло­вок пер­во­го уров­ня и дро­бит­ся на части с помо­щью подзаголовков.

Кегль заго­лов­ков вто­ро­го уров­ня обыч­но уве­ли­чен по срав­не­нию с основ­ным тек­стом. Перед таки­ми заго­лов­ка­ми про­пус­ка­ют при­мер­но две стро­ки, после дела­ют отступ, рав­ный отступу швей­цар­ского абзаца — как у над­пи­си «Подза­го­лов­ки» на этом развороте.

Заголов­ки тре­тье­го уровня

Заголов­ки тре­тье­го уров­ня удоб­но наби­рать полу­жир­ным основ­но­го кег­ля и не отби­вать от после­ду­ю­ще­го тек­ста, как над колон­ка­ми тек­ста на раз­во­роте бренд­бука Скайсканера.

Подза­го­ло­вок в под­бор к основ­но­му тексту. Ещё один спо­соб избе­жать лиш­них отсту­пов на странице.

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

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

Подза­го­лов­ки в иерар­хии могут быть оформ­ле­ны ком­би­на­ци­ей раз­ных сти­лей: кег­ля, полу­жир­но­го начер­та­ния, капи­те­ли, кур­си­ва и выде­ле­ния цве­том. Глав­ные пра­ви­ла — чере­до­ва­ние, то есть яркий кон­траст сти­ля заго­лов­ков на сосед­них уров­нях вло­жен­но­сти, и чув­ство меры.

Для успеш­ной рабо­ты дизай­не­ру необходимо:

  1. Пони­мать прин­ци­пы дизайна.

  2. Разби­рать­ся в типо­гра­фи­ке и вёрстке.

  3. Знать осно­вы дизайна поль­зо­ва­тель­ско­го интерфейса.

  4. Уметь управ­лять зада­ча­ми и проектами.

  5. Осво­ить инфо­стиль и осно­вы редактуры.

  6. Быть гото­вым к пере­го­во­рам и рабо­те с ожи­да­ни­я­ми клиента.

Особен­но­сти Школы стажёров:

  • 1) дистан­ци­он­ное обучение;

  • 2) бес­по­щад­ная систе­ма отбо­ра и отсе­ва на всех ступенях;

  • 3) бес­плат­ные места для луч­ших студентов;

  • 4) гаран­тия трудоустройства;

  • 5) чистая радость познания.

Обра­тить внимание:

  • а) на правильность,

  • б) однородность,

  • в) целесообразность.

Эле­менты спис­ков обозначаются:

  • — араб­ски­ми циф­ра­ми с точкой;

  • — араб­ски­ми циф­ра­ми или рус­ски­ми бук­вами со скобкой;

  • — гра­фи­че­ски­ми маркерами;

  • — втяжкой.

Элемен­ты спис­ков обозначаются:

  • араб­ски­ми циф­ра­ми с точкой;

  • араб­ски­ми циф­ра­ми или рус­ски­ми бук­вами со скобкой;

  • гра­фи­че­ски­ми маркерами;

  • втяжкой.

Обра­тить внимание:

  • на правильность,

  • однородность,

  • целесообразность.

Списки

Спи­сок, или пере­чень, — это пред­ло­же­ние с одно­род­ными чле­на­ми, раз­би­ты­ми для удоб­ства чте­ния на отдель­ные стро­ки, обо­зна­чен­ны­ми гра­фи­че­ски­ми мар­ке­ра­ми или набор­ны­ми сим­во­ла­ми. Поэто­му любой спи­сок пред­ва­ря­ет­ся обоб­ща­ю­щим тек­стом (общей, непо­вто­ря­ю­щейся частью пред­ло­же­ния) или заго­лов­ком в той же син­так­си­че­с­кой роли.

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

В «Справоч­ни­ке изда­те­ля и авто­ра» Арка­дия Миль­чина при­ве­де­ны подроб­ные реко­мен­да­ции по оформ­ле­нию раз­ных видов спис­ков. Ниже — самые упо­тре­би­тель­ные варианты.

Нумеро­ван­ные и упорядоченные

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

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

Если эле­мен­ты спис­ка про­стые, то есть состо­ят из нес­коль­­ких слов без зна­ков пре­пи­на­ния внут­ри, допу­сти­мо ста­вить меж­ду эле­мен­та­ми запя­тую. Если про­стые эле­мен­ты не содер­жат ссы­лок, то мож­но не уве­ли­чи­вать рас­сто­я­ние меж­ду элементами.

Ненуме­ро­ван­ные списки

Вме­сто цифр и букв в нену­ме­ро­ван­ных спис­ках эле­мен­ты часто обо­зна­ча­ют­ся гра­фи­че­ски­ми мар­ке­ра­ми или символами.

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

Списки

Спи­сок, или пере­чень, — это пред­ло­же­ние с одно­род­ными чле­на­ми, раз­би­ты­ми для удоб­ства чте­ния на отдель­ные стро­ки, обо­зна­чен­ны­ми гра­фи­че­ски­ми мар­ке­ра­ми или набор­ны­ми сим­во­ла­ми. Поэто­му любой спи­сок пред­ва­ря­ет­ся обоб­ща­ю­щим тек­стом (общей, непо­вто­ря­ю­щейся частью пред­ло­же­ния) или заго­лов­ком в той же син­так­си­че­с­кой роли.

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

В «Справоч­ни­ке изда­те­ля и авто­ра» Арка­дия Миль­чина при­ве­де­ны подроб­ные реко­мен­да­ции по оформ­ле­нию раз­ных видов спис­ков. Ниже — самые упо­тре­би­тель­ные варианты.

Нумеро­ван­ные и упорядоченные

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

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

Если эле­мен­ты спис­ка про­стые, то есть состо­ят из нес­коль­­ких слов без зна­ков пре­пи­на­ния внут­ри, допу­сти­мо ста­вить меж­ду эле­мен­та­ми запя­тую. Если про­стые эле­мен­ты не содер­жат ссы­лок, то мож­но не уве­ли­чи­вать рас­сто­я­ние меж­ду элементами.

Ненуме­ро­ван­ные списки

Вме­сто цифр и букв в нену­ме­ро­ван­ных спис­ках эле­мен­ты часто обо­зна­ча­ют­ся гра­фи­че­ски­ми мар­ке­ра­ми или символами.

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

Для успеш­ной рабо­ты дизай­не­ру необходимо:

  1. Пони­мать прин­ци­пы рабо­то­спо­соб­но­го дизайна.

  2. Разби­рать­ся в типо­гра­фи­ке и иметь навы­ки вёрстки.

  3. Знать осно­вы про­ек­ти­ро­ва­ния поль­зо­ва­тель­ско­го интер­фей­са и пред­став­ле­ния информации.

  4. Уметь управ­лять зада­ча­ми, про­ек­та­ми, испол­ни­те­ля­ми и соб­ствен­ным временем.

  5. Осво­ить инфор­ма­ци­он­ный стиль и осно­вы редактуры.

  6. Пони­мать юри­ди­че­скую сто­ро­ну дизайна.

  7. Быть гото­вым к пере­го­во­рам и рабо­те с ожи­да­ни­я­ми клиента.

Особен­но­сти Школы стажёров:

  • 1) дистан­ци­он­ное обучение;

  • 2) бес­по­щад­ная систе­ма отбо­ра и отсе­ва на всех ступенях;

  • 3) бес­плат­ные места для луч­ших студентов;

  • 4) гаран­тия трудоустройства;

  • 5) чистая радость познания.

Обра­тить внимание:

  • а) на правильность,

  • б) однородность,

  • в) целесообразность.

Элемен­ты спис­ков обозначаются:

  • — араб­ски­ми циф­ра­ми с точкой;

  • — араб­ски­ми циф­ра­ми или рус­ски­ми строч­ны­ми буквами;

  • — с закры­ва­ю­щей скобкой;

  • — гра­фи­че­ски­ми мар­ке­ра­ми или набор­ны­ми знаками;

  • — втяжкой.

Элемен­ты спис­ков обозначаются:

  • араб­ски­ми циф­ра­ми с точкой;

  • араб­ски­ми циф­ра­ми или рус­ски­ми строч­ны­ми буквами;

  • с закры­ва­ю­щей скобкой;

  • гра­фи­че­ски­ми мар­ке­ра­ми или набор­ны­ми знаками;

  • втяжкой.


Обра­тить внимание:

  • на правильность,

  • однородность,

  • целесообразность.

Таблицы

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

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

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

По умол­ча­нию все зна­че­ния в таб­ли­це вырав­ни­ва­ют­ся по вер­ху и по лево­му краю. Если чис­ло­вые зна­че­ния срав­ни­мы и изме­ря­ют­ся в одной еди­ни­це, они вырав­ни­ва­ют­ся по раз­ря­дам и затем по лево­му краю колон­ки самым длин­ным чис­лом. Для упро­ще­ния тех­ни­че­ской реа­ли­за­ции так­же допу­сти­мо вырав­ни­вать чис­ла по пра­во­му краю колонки.

На при­мере оформ­ле­ние таб­ли­цы с заго­лов­ком и пояс­ня­ю­щим текстом.

Употребление кофе в Коворкафе осенью 2013 и 2014 годов

Пока­зано коли­че­ство выпи­тых чашек без учёта кофе‑брей­ков на кур­сах бюро. Дан­ных за ноябрь пока нет.

Эсп.рессо Капуч.ино Лате Америк.ано Всего
2013
Сентябрь 61 20 70 61 212142
Октябрь 68 29 56 60 213157
Ноябрь 70 21 13 17 121108
2014
Сентябрь 54 65 28 35 182154
Октябрь 59 77 51 53 240189

Таблицы

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

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

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

По умол­ча­нию все зна­че­ния в таб­ли­це вырав­ни­ва­ют­ся по вер­ху и по лево­му краю. Если чис­ло­вые зна­че­ния срав­ни­мы и изме­ря­ют­ся в одной еди­ни­це, они вырав­ни­ва­ют­ся по раз­ря­дам и затем по лево­му краю колон­ки самым длин­ным чис­лом. Для упро­ще­ния тех­ни­че­ской реа­ли­за­ции так­же допу­сти­мо вырав­ни­вать чис­ла по пра­во­му краю колонки.

На при­мере оформ­ле­ние таб­ли­цы с заго­лов­ком и пояс­ня­ю­щим текстом.

Употребление кофе в Коворкафе осенью 2013 и 2014 годов

Пока­зано коли­че­ство выпи­тых чашек без учёта кофе‑брей­ков на кур­сах бюро. Дан­ных за ноябрь пока нет.

Эсп.рессо Капуч.ино Лате Америк.ано Всего
2013
Сентябрь 61 20 70 61 212142
Октябрь 68 29 56 60 213157
Ноябрь 70 21 13 17 121108
2014
Сентябрь 54 65 28 35 182154
Октябрь 59 77 51 53 240189
Скрыто 40 разворотов

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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