Типографика в веб-дизайне: основы и правила использования. Старайтесь использовать стандартные шрифты

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

Большие шрифты

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

Засечки возвращаются

Шрифты с засечками — это хорошо забытое старое, которое в последнее время стало настолько популярным, что превратилось в совершенно новое. Большие шрифты с засечками — символ 2018 года! Так что доставайте с полки всеми забытый Clarendon, он вам еще пригодится!

Типографика за рамками стандартных макетов

Тенденции говорят о том, что шрифты, нарисованные кистью теряют в популярности. Мир веба завоевывают 3D -начертания, иллюстрированные шрифты, анимированные, более живые буквы. Дизайнеры без раздумий отказываются от макетов с классической сеткой. Тексты на сайтах все больше походят на типографику в издательском дизайне. Скажем «Спасибо!» прогрессивной стандартизации Flexbox и CSS Grids и появлению переменных шрифтов.

Первые роли тексту

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

Оформление текста

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

Эволюция абзаца

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

Типографические тренды 2018

Вот немного о том, какие типографические тренды царят в 2018 году:

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

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

На самом деле, существуют определенные условия, при которых типографика практически не важна. Заключаются они в следующем:

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

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

Правила и основы типографики в веб-дизайне

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

Шрифт для сайта

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

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

Оформление текста

Правильный компьютерный набор - один из разделов типографики.

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

Макро- и микротипографика в дизайне сайта

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

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

Например, при создании сайта www.crowleywebb.com дизайнер опирался как раз на макро- и микротипографику:

Кстати, подобные сайты можно создавать и на базе шаблонов. Один из примеров – HTML шаблон :

Размер шрифта и набор стилей

Наиболее комфортный для восприятия размер шрифта в тексте - 12-16 пикселей. А вот заголовки и подзаголовки (H1, H2, H3) обычно несколько масштабней. Очень важно разработать свою систему стилей и употреблять ее в каждом текстовом оформлении на ресурсе. Желательно для заголовков и цитат применять различные варианты начертания используемого шрифта или же, для особого контраста, попробовать использовать совсем другой шрифт. Для акцентирования внимания на наиболее важных местах в тексте, его стоит выделять жирным или курсивом. Например, как на сайте www.hausofdesign.co.uk :

Методы хорошей верстки

Читабельность текстов - вот, что обеспечивает успех.

Вот как это может выглядеть на примере сайта :

А это пример удачной верстки flash-шаблона. Чтобы ознакомиться с ним подробнее, кликните по изображению.

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

Стили CSS

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

Выравнивание текста в блоках

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

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

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

P.S. Как Вам статья? Признаюсь честно, писал ее не я. Вообще-то я никогда не публиковал гостевых постов и все статьи на блоге написаны лично мной. Но когда со мной связалась Ольга Владыко, один из авторов сайта TemplateMonster Russia (это, кстати, ее статья) и предложила сотрудничество с этим популярным проектом, то я согласился.

Во-первых, это не рекламный пост, опубликованный за деньги, а статья, которая, уверен, будет полезна многим моим читателям. Или я не прав? Я, например, как и многие, использую знак “-” вместо “-” и т.д. Просто так удобнее, хотя и не правильно. В общем, знание правил веб-типографики нам не повредит.

Другая причина, это то, что моя статья о том, стабильно приводит посетителей с поиска. Значит многих интересуют темы для сайта. А TemplateMonster Russia – это русское отделение www.templatemonster.com – мирового лидера в области веб-дизайна, производстве и продаже высококачественных шаблонов для сайтов. В числе их партнеров такие известные бренды, как 1С-Битрикс, REG.RU, UMI.CMS и др.

Здесь Вы найдете шаблоны на любой вкус: HTML, Flash, для CMS и блогов, Facebook шаблоны, для интернет-магазинов и мобильных устройств. Это позволит без труда . Рекомендую присмотреться к сайту TemplateMonster Russia , возможно, это то, что Вы давно искали. А сейчас посмотрите видео, где сотрудники компании сами расскажут о себе. Всем пока!

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

Более 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. Старайтесь не использовать мерцающий текст

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

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

Заключение

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

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

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

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

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

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

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

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

    Гарнитуры можно разделить на две основные категории:

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

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

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

    Интерлиньяж - межстрочный интервал. Расстояние между базовыми линиями соседних строк.

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

    Есть замечательная игра-тренажер - Kern Type . Просто расставьте все буквы по местам. На самом деле это не так-то просто. Процесс достаточно сложен и требует отличного глазомера. Особенно этот опыт будет полезен при создании логотипов.

    Что мы делаем не так?


    Используем большое количество шрифтов

    Желательно использовать не более 3-х начертаний. Это могут быть шрифты как одной гарнитуры, так и разных. Например, гарнитура Roboto содержит довольно большое количество различных начертаний. Из них легко можно выбрать три, которые, как мы считаем, подойдут для нашего сайта. Допустим, это будут Light, Regular и Bold. Для заголовков можно использовать шрифт Bold или Light, для кнопок Bold, для основного текста Regular. Таким образом, используя одну гарнитуру, мы обеспечили наш сайт правильной типографикой. Естественно, все зависит от тематики сайта и идеи, которую вы планируете заложить в дизайн. Мой пример относится к универсальным и не претендует на что-то уникальное или неординарное.

    Не знаем какого размера должен быть шрифт

    Размер текста в вебе не должен быть меньше 12 пикселей. Лучший выбор - в пределах 14–18 px для основного текста. Не слишком большой и в то же время удобочитаемый. Причем, если уж мы выбрали размер 16 px, он должен оставаться 16 px на всех страницах сайта и не скакать плюс-минус 1 px от блока к блоку. Относится это и к интерлиньяжу, он везде должен быть одинаков.

    Размер шрифтов надо указывать целыми числами, не используя десятичныхдробей, например 16,28 px. И, конечно же, в фотошопе необходимо перевести pt в px. Для этого выбираете в меню: Редактирование - Установки - Основные. Далее - Единицы измерения и линейки. Меняете в выпадающих меню «Текст», «Линейки» пункты на пиксели. Жмете «OK».

    Длина строки - разве это важно?

    Длина строки не должна превышать 600 px. Это оптимальный размер для комфортного перемещения взгляда с одной строчки на другую. Очень широкую контентную часть тяжело читать - часто просто теряешь ту строчку, на которую собирался перейти после прочтения длинной предыдущей строки. Если все-таки необходимо растянуть текстовый блок на 1000 px и более по ширине, можно попробовать разбить текст на две или более колонок. Другой вариант - сделать межстрочное расстояние чуть больше обычного, чтобы визуально сильнее отделить строки друг от друга. Не забывайте разделять текст абзацами, это также поможет сделать его легко читаемым.

    Интерлиньяж соответствует размеру шрифта

    Расстояние между строками практически всегда должно быть больше размера шрифта. За исключением заголовков. Чтобы достигнуть баланса между текстом и «воздухом», сделайте межстрочное расстояние примерно в полтора раза больше высоты строчных букв. Или устанавливаем интерлиньяж, равный 150% размера шрифта. Например размер текста 14 px, тогда интрерлиньяж - 21 px. 14 / 2 = 7 + 14 = 21.

    Выбираем любой понравившийся шрифт

    Думаю, уже всем известно, что шрифты для дизайна веб-сайтов лучше всего использовать с fonts.google.com и webfont.ru , если, конечно, заказчик не предоставил вам свой шрифт.

    O Lorem, lorem...

    Совершенно естественно, что при разработке сайта почти никогда не используется тот контент, который там будет - зачастую, это контента ещё просто не существует. Поэтому дизайнеры (да и верстальщики тоже) используют «рыбу» - произвольный текст, который вписывается в контентные блоки. Это довольно удобно, особенно для дизайнеров, ведь теперь пресловутый «Lorem Ipsum...» можно вставить прямо из фотошопа (Меню: Текст - Вставить Lorem Ipsum). Но для русскоязычных сайтов делать это не рекомендуется - латиница не дает представления о том, как будет выглядеть текст, набранный кириллическим шрифтом. Поэтому генератор текстов вам в помощь.

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

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

    Выравнивание

    Есть текстовые блоки, которые очень часто выравниваются неправильно - это выравнивание по ширине, выравнивание посередине и выравнивание по правому краю. Во всех этих случаях читать текст неудобно, и визуально он выглядит непривлекательно. Выравнивание ВСЕГДА должно быть по левому краю. Даже если очень хочется сделать его по правому краю (просто потому что вам кажется - композиционно должно быть именно так) - это неправильно Исключением может быть одно или два коротких предложения, которые, скорее всего, являются подзаголовками для основного текста.

    Контраст

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