Тема: Дизайн цвета, формы, текстуры, шрифты

Веб-дизайн 8-9 классы 10-11.04.2023

Тема: Дизайн цвета, формы, текстуры, шрифты.

Восприятие цвета

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

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

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

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

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

Сочетаемость цветов

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

Что же это за принципы? Из выведенных закономерностей особенно важны для подбора цветов противоположные и взаимодополняющие принципы единства и контраста.

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

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

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

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

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

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

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

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

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

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

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

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

Цветовые схемы оформления

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

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

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

Текст и фон

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

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

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

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

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

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

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

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

Пространственные отношения элементов

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

Размер

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

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

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

Пропорции

Излюбленное соотношение архитекторов и художников заключено в формуле: b / a = a / ( a + b ), или b = 0,618a.

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

Размещение

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

- одноуровневые элементы

разноуровневые элементы

К элементам первого типа можно отнести, например, кнопки навигационной панели web-страницы (или объекты, расположенные вдоль одной прямой вертикально или горизонтально). К этому же типу относятся и пункты списка, которые часто выделяют маркерами.

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

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

Плотность

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

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

Форма

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

- состоящие из прямых линий (вертикальные и горизонтальные линии, прямоугольники)

- криволинейные (в форме которых выделяется окружность или ее часть)

- бесформенные (аморфные) элементы

Прямые

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

Прямоугольники

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

Круги и закругления

Круг - самодостаточная фигура, его трудно удачно вписать в композицию. Координировать круг с другими элементами не просто, однако можно взять только часть окружности — дугу. Концы дуги проще объединить с другими элементами: ведь появляются еще две дополнительные точки. Можно объединить окружность и прямоугольник — получится прямоугольник с закруглениями вместо углов. Эта фигуру легче внедрить в композицию.

Кривые Безье

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

Рис 5. Кривые Безье

Текстуры

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

Плоский цвет

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

Геометрические текстуры

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

Фотографические текстуры

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

Материальные текстуры

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

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

Шрифт и текст

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

Элементы шрифта

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

Все существующие в природе шрифты можно разделить на пять видов:

- шрифты с засечками,

- шрифты без засечек — рубленые,

- моноширные — с одинаковой шириной всех букв и знаков,

- декоративные — всевозможные стилизации (готический, древнерусский), рукописные и шрифты с различными эффектами («трехмерные», с тенями),

- и специальные (содержат математические, музыкальные знаки, декоративные элементы и т.д.).

Выделяют следующие начертания внутри одной гарнитуры:

- прямое начертание

- курсивное (наклоненный вправо, более округлый и рукописный почерк)

- жирное начертание

- сверхжирное начертание

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

Шрифты и время

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

Подбор шрифтов

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

Кажущаяся простота «обычных» шрифтов обманчива — это не простота, а отшлифованность, достижимая только веками обкатки на мириадах текстов и читательском сознании.

Единство противоположностей

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

Эти типы шрифтов противопоставлены по степени декоративности (шрифты с засечками наряднее). Однако это противопоставление не главное и не единственное. Эти шрифты абсолютно разные, но гармонично дополняющие друг друга.

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

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

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

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

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

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

Декоративные шрифты

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

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

Параметры наборов

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

Кегль

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

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

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

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

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

Прописные и строчные

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

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

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

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

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

С другой стороны, частое применение стиля «все строчные» делает его все более привычным и нейтральным для восприятия. Некоторая отстраненность в его звучании определенно остается, так что не стоит пользоваться этим стилем для строгих деловых страниц, — однако во многих других случаях он вполне уместен.

Выравнивание и отступы

Существует несколько способов выравнивания строк в абзаце. Язык гипертекстовой разметки web-документов HTML, как и большинство других средств верстки текста на компьютере, по умолчанию применяет отбивку влево с неровным правым краем. Степень этой неровности зависит от того, насколько часто в тексте расположены точки, на которых алгоритм верстки может перенести строку, и, следовательно (если не применяются переносы), от средней длины слов в тексте — которая значительно меньше в английском языке, чем в русском. Из-за этого режим выравнивания по левому краю, привычный и почти стандартный для английского языка, в русском наборе следует применять с большой осторожностью.

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

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

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

16