Одна из самых часто встречающихся бед дизайна - это проблема с .

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

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

Правило 1. Чем меньше шрифтов, тем лучше

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

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

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

Правило 2. Следите за разрядкой

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

Правило 3. Правильное выравнивание

Пожалуйста, не выравнивайте все по центру (если это не специальный дизайнерский ход). Подумайте об использовании сетки. Ведь на странице все взаимосвязано. Используйте направляющие и размещайте согласно им объекты. Не раскидывайте объекты по углам страницы так как будто вы не смогли решить, где их разместить.

Правило 4. Поменьше декоративных шрифтов

У вас есть красивые декоративные шрифты? Замечательно! Но это совсем не означает, что необходимо использовать их для текста абзацев. За декоративными шрифтами, чаще всего стоит, история или они применяются в конкретном случае, например, для заголовка или названия. Часто, чем проще, тем лучше, поэтому такие шрифты как Helvetica так популярны.

Правило 5. Размер имеет значение

Это о размере букв текста;). Заголовки хороши, когда набраны жирным и большим шрифтом, но если вы будете использовать и в основном тексте слишком большие буквы, это удешевит его. Подумай об этом. Вы идете в хороший ресторан и часто бывает, что меню написано мелким шрифтом, это выглядит классно. (Только убедитесь, что шрифт не так мал, чтобы было трудно прочитать). Не бойтесь делать заголовки гораздо больше, чем основной текст.

Правило 6. Следите за читабельностью

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

Правило 7. Правильно подбирайте цвета

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

Правило 8. Подходящая группировка

Связанные части информации лучше объединять вместе. Это позволит сделать дизайн яснее. Например: посмотрите на постер фильма, все данные сгруппированы в привлекательные блоки. Они теперь могут рассматриваться как отдельный элемент дизайна. Примеры плохой группировки – откройте желтые страницы.

Правило 9. Достаточный интерлиньяж

Это расстояние между строками текста. Очень важно правильно подобрать этот интервал. Гораздо более приятно читать, когда есть место для отдыха глаз между строками. Как правило, стараются использовать интерлиньяж, по крайней мере, на 2 пункта больше, чем размер шрифта. Например: для максимального удобства чтения при 10pt для шрифта должны задать хотя бы 12pt.

Правило 10. Следите за кернингом

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

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

Материал из Википедии - свободной энциклопедии

Обложка книги Эмиля Рудера «Typographie»

История

Последние научные данные говорят о том, что самые первые формы для набора текста - из фаянса - были использованы около тысячи лет назад ещё в Китае (1040 г.). Несмотря на недолговечность подобного материала, никакой другой технологии вплоть до XIII века не применялось.

Но расцвет типографики как отдельной сферы деятельности начался в Европе, где она появилась в середине XV века. Её распространению способствовали лёгкость и относительно малое количество символов в латинском шрифте, в отличие от китайских иероглифов. Первым, кто серьёзно занялся европейским типографическим искусством, стал Иоганн Гутенберг (1397-1468 гг.), немецкий изобретатель и ювелир. Создав в 1440 году из свинцовых букв наборную форму, он подарил миру первый печатный станок. Отныне создавать книги стало гораздо проще, их стоимость уменьшилась, а количество - возросло. И спустя 14 лет была выпущена первая напечатанная книга. Ей стала Библия, набранная готическим шрифтом - этот шрифт наиболее соответствовал рукописному тексту тех времён, был знаком и удобен читающей публике.

Развитие типографики

Грамотное текстовое оформление печатного листа ценилось всегда. И уже с середины XV века начинают зарождаться первые основы типографики: в Европе в качестве шрифта для текстов используется удобочитаемая антиква. Глядя на римскую капитель и гуманистический минускул, французский гравёр Николя Жансон (1420-1480 г.) вырезает первую антикву. В типографскую моду входит принцип равномерности интерлиньяжа и абзацного отступа для выделения и структурирования текста. В 1494 г. Альд Мануций , итальянский типограф и издатель из Венеции, выпускает первую книгу с удобным для глаза читателя абзацным отступом.

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

В XVII столетии типографика начинает меняться, отдавая предпочтение удобочитаемости книг, пытаясь адаптировать издания для большего круга читателей. С этим связано уменьшение формата, видоизменение шрифтов - сохраняя чёткость оттиска, они становятся более тяжеловесными. В этот же период появляется шрифт «Королевская антиква», который ещё больше не похож на все те шрифты, что были созданы до него. В середине XVIII века впервые появились попытки систематизации типоразмеров и выпуска книг шрифтовых образцов. Особое значение здесь имеет труд англичанина Джона Баскервилля (1706-1775 гг.), отказавшегося от использования книжного орнамента в пользу «чистой» типографики, основанной исключительно на шрифтовом оформлении. Типографика быстро меняется: со временем на смену узорчатости приходит геометрическая точность, проявляется значимость общей композиции свободного пространства листа, рождаются всё новые оттеночные, контрастные шрифты. В Россию типографика приходит вместе с первым книгопечатником Иваном Фёдоровым (1520-1583 гг.), открывшим в 1563 г. первую типографию в Москве и проработавшим красочное оформление со множеством мелких деталей.

В попытке ввести типографику в разряд наук французский гравёр Пьер Фурнье (1712-1768 гг.) публикует «Типографическое руководство» (1773 г.), где представлена его собственная система определения кегля шрифта. Для этого он предложил использовать пики и пункты. А Франсуа Дидо , французский шрифтовик, приравнявший 72 пункта к одному дюйму, положил основы современной системы измерения.

Критика

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

Типографика в современном контексте

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

Конструктивисты начала XX века, напротив, решили отказаться от расписных шрифтов и обратиться к минимализму: буквы приблизились к геометрическим фигурам. Это значительно облегчало чтение текста и максимально концентрировало внимание публики на смысле, а не форме и подаче материала. Вскоре появились такие шрифты как Футура, затем Гилл Санс, в стиле которого оформлены первые карты Лондонской железной дороги. В 1957 г. благодаря швейцарцу Максу Миденгеру (1910-1980 гг.) появляется один из самых знаменитых и используемых по сей день шрифт Гельветика. Каждая эпоха характеризовалась своими веяниями моды в типографике, и каждое из них отвечало задачам своего времени.

Сегодня, в эпоху компьютеризации, когда основной массив информации черпается из всемирной сети, дизайнеры стремятся к легкости и аккуратности текста, выбирая наиболее простые и читабельные шрифты. Для этого текст собирается в единое целое, выбирается наиболее подходящий шрифт, определяется концепция оформления заданного пространства. Говоря о дизайне сайтов, нужно учитывать одно: чем яснее написан сам текст, чем грамотнее и рациональнее он размещен, тем выше шансы этого сайта на успех среди пользователей сети, потому как «бессмыслен труд типографа, если печатное произведение нельзя прочесть». В противном случае он получится малоинтересным, и посетитель закроет вкладку, так и не почерпнув для себя ничего нового .

Примечания

  1. Именно как искусство типографику определяют самые разные исследователи, начиная со Стэнли Морисона . См. напр.: Stanley Morison . First Principles of Typography. - Macmillan, 1936. - P. 1.
    Максим Жуков . Типографика Эмиля Рудера // Эмиль Рудер. Типографика: руководство по оформлению. - М. : Книга, 1982. - С. 277.
    Александра Королькова . Живая типографика. - М. : IndexMarket, 2010. - С. 8.
    Иннокентий Келейников . Дизайн книги: от слов к делу. - М. : Рип-Холдинг, 2012. - С. 14.
    В то же время Ян Чихольд, один из наиболее влиятельных типографов, писал: «Совершенная типографика есть скорее наука, нежели искусство». Впрочем, он избегал давать точное определение термину, и в той же статье именовал типографику также искусством, имея в виду её творческую природу, в отличие от производственных процессов верстки и печатания. См.: Как глина в руках гончара… // Ян Чихольд . Облик книги: избранные статьи о книжном оформлении. - М. : Книга, 1980. - С. 11-16.
  2. admin. Типографика, история и задачи . www.fotokomok.ru. Проверено 28 ноября 2016.
  3. Типографика: история тысячелетнего развития. | Web-дизайн форум на Galior-Market.ru . galior-market.ru. Проверено 28 ноября 2016.
  4. Типографика | История типографики . typography.bezugly.ru. Проверено 28 ноября 2016.

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

Что такое типографика?

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

Универсальные специалисты - они существуют?

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

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

Разумеется, уровень владения компьютерными программами у графического дизайнера будет значительно превышать уровень обыкновенного пользователя. Графический дизайнер - это прежде всего художник. Однако между художником и «компьютерщиком» связь более чем ощутима: например, основы стиля в типографике и дизайнерские решения, которые создаются с помощью определенного программного обеспечения.

С кем работают графические дизайнеры?

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

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

Где готовят графических дизайнеров?

В профессии графического и web-дизайнера, как ни в какой другой, крайне важно даже не желание, а постоянное стремление воплощать свои идеи в жизнь - и это можно сказать с уверенностью.

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

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

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

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

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

Понятие типографики, история и задачи

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

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

С типографикой также тесно связана такая деятельность, как проектирование рекламы, вывесок, оформление выставок, разработка многочисленных элементов фирменного стиля, создание дизайна web-сайтов. Особенно типографика востребована в рекламе, ведь текст в рекламе является важнейшей составляющей, позволяющей рекламодателям заявить о себе.

Нельзя сказать, что типографика как явление появилось только на рубеже XX – XXI веков. В действительности, история становления и развития типографики начинается с появления в жизни человека книгопечатания. Более того, своими корнями эта область графического дизайна уходит еще в более древнюю эпоху рукописных книг, когда красивое размещение текста на плоскости листа очень ценилось. Уже с середины XV века формируются первые основы типографики: в Европе в качестве шрифта для текстов используется удобочитаемая антиква, также издатели и авторы книг начинают выдерживать принцип равномерности интерлиньяжа и абзацного отступа как средства выделения и структурирования текста.

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

В XVII веке с подачи издательских домов Голландии типографика меняет свои задачи в пользу создания книг для более широкого круга читателей. Соответственно, книги приобретают небольшой формат для большего удобства, видоизменяются шрифты – они получаются с более утяжеленным рисунком, что позволяет сохранять четкость оттиска даже при больших тиражах изданий. В это же столетие появляется оригинальный шрифт «Королевская антиква», еще дальше отходящий от рукописного прототипа. В середине XVIII века впервые появились попытки систематизации типоразмеров и выпуска книг шрифтовых образцов.

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

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

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

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

В качестве композиционного каркаса книги стала использоваться математически рассчитанная модульная сетка, состоящая из равных прямоугольников текста и свободных промежутков между ними. Такая композиция выдерживалась в изданиях от первой до последней страницы. В 1970 году в Нью-Йорке была основана Международная шрифтовая корпорация (ITC), которой принадлежит огромная роль в разработке новых шрифтов, в том числе хорошо известных нам сегодня. Как мы видим, каждая историческая эпоха характеризовалась своей типографикой и созданием своих собственных шрифтовых рисунков, отвечающих конкретным задачам и веяниям времени.

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

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

Типографическое оформление текста

Типографическое оформление текста зависит от нескольких составляющих:

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

— Носители текста. Также на выбор типографических приемов влияет то, где будет размещаться текст – в Интернете, на рекламном щите или бумаге глянцевого издания.

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

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

Естественно, что главное, с чем работает типограф – это шрифт, поскольку от него в основном зависит восприятие текста читателем. Шрифт представляет собой набор символов определенного размера и рисунка. Различные шрифты объединяются в группы или семьи по своему стилистическому решению: шрифты рукописные, шрифты с засечками или без засечек и другие. Понятием «гарнитура» в типографике как раз и определяют шрифт или несколько шрифтов, обладающих стилистическим единством начертания. Например, гарнитура TimesNewRoman включает в себя обычный, курсивный, полужирный и множество других шрифтов этого, очень популярного сегодня семейства.

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

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

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

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

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

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

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

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

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

Более 95% информации в Интернете хранится в письменном виде.

Хорошая типографика — это залог легкодоступной информации, в то время как при плохой типографике приходится прикладывать усилия для понимания текста. Как отмечает Оливер Райхенштайн в статье «Веб-дизайн на 95% состоит из типографики »:

Оптимизация типографики — это оптимизация читабельности, доступности, удобства использования (!) и достижение графического баланса в целом.

1. Используйте минимальное количество шрифтов

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

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

В целом, сведите количество шрифтов к минимуму (двух более чем достаточно, часто хватит и одного) и придерживайтесь использования одних и тех же на всем веб-сайте. Если вы решите работать с более чем одним шрифтом, убедитесь, что семейства шрифтов подходят друг другу с точки зрения ширины букв. Взгляните на пример, приведенный чуть ниже. У комбинации Georgia и Verdana (слева) есть общие характеристики, что позволяет им гармонично сочетаться друг с другом. Возьмем для сравнения комбинацию Baskerville и Impact (справа). «Тяжеловесный» Impact подавляет своего «засечного» напарника.

Убедитесь, что семейства шрифтов подходят друг другу с точки зрения ширины букв

2. Старайтесь использовать стандартные шрифты

В сервисах со шрифтами (например, Google Web Fonts или Typekit) можно найти много интересных, которые добавят в ваш дизайн нечто новое и необычное. К тому же, ими очень легко пользоваться. Возьмем, к примеру, Google:

1. Выбираете любой шрифт. Скажем, Open Sans .

2. Генерируете код и вставляете его в

Своего HTML. 

3. Готово!


Но что может пойти не так?

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

Обычно наилучшим выходом будет использование системных шрифтов (Arial, Calibri, Trebuchet, etc.). Исключением может стать необходимость придерживаться каких-то шрифтов, которые задал сам клиент: например, для брендинга или для создания чего-то запоминающегося. Помните, что хорошая типографика влияет на прочтение текста, а не на визуальное восприятие шрифта.

3. Ограничьте длину строки

Правильно подобранное количество знаков на одной строке — это ключ к легкости прочтения вашего текста. Выбирая ширину текста, вы должны ориентироваться не на ваш дизайн, а на ясность и четкость написанного. Обратите внимание на этот совет от Baymard Institute :

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

Если строка слишком короткая, глазам придется часто менять фокус, что сбивает темп чтения. Если же строка слишком длинная, глазам читателя, наоборот, придется долго фокусироваться на написанном. Фото: Material Design

Что касается мобильных устройств, придерживайтесь диапазона в 30-40 знаков в строке. Ниже представлен пример двух сайтов, открытых на мобильных устройствах. На одном строка содержит от 50 до 75 символов (лучшее количество знаков в строке для печатного текста и разрешения компьютера), а на втором мы видим оптимальные 30-40 знаков.

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

4. Выбирайте гарнитуры, которые хорошо читаются в любом размере

Пользователи будут заходить на ваш сайт с разных устройств, у которых, соответственно, различается размер и разрешение. Большинство пользовательских интерфейсов используют текстовые элементы различной величины (кнопка «копировать», подписи полей, заголовки секций и т.д.). Необходимо выбирать гарнитуру, которая будет хорошо выглядеть, и оставаться читабельной в любом размере.

Roboto от Google

Убедитесь, что гарнитура, которую вы выбрали, легко читается на маленьких экранах! Старайтесь не использовать курсивные шрифты, например, Vivaldi (на изображении ниже): хоть они и выглядят красиво, понять написанное иногда бывает сложно.

Использование шрифта Vivaldi затруднит прочтение текста на маленьком экране

5. Используйте шрифты с четкими буквами

Многие шрифтовые гарнитуры созданы таким образом, что иногда бывает очень легко спутать похожие буквы, особенно «I» и «L», написанные латиницей (как на изображении ниже). В некоторых же буквы расположены так близко друг к другу, что сочетание «r» и «n» можно принять за букву «m». Поэтому, выбирая шрифт, протестируйте его в разных контекстах. Так вы сможете убедиться, что из-за шрифтовой гарнитуры у читателя не возникнет проблем с пониманием текста.

6. Избегайте капса

Текст, написанный капсом — или одними заглавными буквами — подходит для ситуации, где пользователь не вовлекается в процесс чтения (например, в аббревиатурах или логотипах). Но в других случаях не насилуйте ваших читателей текстом, написанным заглавными буквами. Как отмечает Майлз Тинкер в своей известной работе «Legibility of Print», такой текст читается гораздо медленнее текста, написанного строчными.

7. Не сводите межстрочное расстояние к минимуму

В типографике существует специальный термин для обозначения расстояния между строками — интерлиньяж (или межстрочный интервал). Увеличивая интерлиньяж, вы увеличиваете вертикальное пространство между строками, тем самым улучшая читабельность текста на экране. По правилам, для обеспечения читабельности текста интерлиньяж должен быть примерно на 30% больше, чем высота знака.

Правильное межстрочное расстояние способствует лучшей читабельности текста. Фото: Microsoft

По словам Дмитрия Фадеева, правильно подобранное расстояние между абзацами увеличивает понимание прочитанного на 20%. Умение дизайнера работать с белым пространством позволяет пользователям усваивать содержание текста целиком без упущения каких-либо деталей.

Слева: Текст написан практически вплотную. Справа: Правильное межстрочное расстояние способствует читабельности текста. Фото: Apple

8. Убедитесь, что у вас все в порядке с цветовым контрастом

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

  • Небольшие тексты должны иметь коэффициент контраста минимум 4,5:1 по отношению к фону.

  • Большие тексты (от 14 размера полужирным шрифтом/от 18 размера и выше стандартным шрифтом) должны иметь коэффициент контраста минимум 3:1 по отношению к фону. 


Этот текст не соответствует стандарту цветового контраста, поэтому его тяжело различить на фоне.

Этот текст соответствует стандарту цветового контраста, поэтому он читается легко.

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

9. Старайтесь не использовать красный или зеленый цвет в тексте

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

10. Старайтесь не использовать мерцающий текст

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

Не используйте мерцающий текст!

Заключение

Типографика — это очень важная вещь. Делая правильный выбор, вы наделяете веб-сайт ясностью и четкостью. В то же время, неправильный выбор может привести к невнимательному прочтению текста, так как отвлекает все внимание на себя. Типографика должна быть читабельной, ясной и понятной.

Типографика должна уважительно относиться к контенту

Это подразумевает, что читатель никогда не должен испытывать дискомфорта при прочтении текста.