Книга: Веб-дизайн

Единство

Единство

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

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

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

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

Content is king. Хорошо, скажете вы, но если ничего нельзя, то что же тогда можно? Чем пользоваться для оформления заголовков, иллюстрации, кнопок навигации? Нельзя же просто взять и покидать весь материал на страницу, не задумываясь о красоте?

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

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

Академический стиль. Подход, при котором оформление документа полностью определяется его структурой, совсем не оригинален. Точнее, он именно оригинален в смысле английского «original» — ведь именно структура документа, а не его внешний вид, и является объектом разметки в HTML согласно официальной идеологии этого языка (стр. 22), положенной в основу самой первой его версии. HTML предназначен именно для разметки логической, а не визуальной структуры; внешний же вид документа в броузере есть лишь побочный эффект логической разметки.

Правда, достаточно строго этот принцип соблюдался только в первые годы жизни языка. Впоследствии в HTML было введено множество визуально–ориентированных средств, не имеющих никакого структурного значения и употребляемых исключительно для управления внешним видом документа в графической среде (тег FONT — самый известный пример). Граница между «логической» и «визуальной» эпохами в истории HTML проходит приблизительно между версиями HTML 2.0 и 3.2 (о том, почему не 3.0 и не 3.1, см. стр.23). В последней на момент написания книги версии 4.0 выделено самодостаточное подмножество структурных тегов (так называемый Strict DTD, стр.49).

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

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

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

Посмотрите, сколько важных достоинств у академического стиля:

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

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

• «Академические» страницы находятся в наилучшем согласии с духом и буквой официальной спецификация языка HTML. Это позволит вам, не краснея, иметь дело с весьма многочисленной и влиятельной прослойкой HTML-пуристов (стр. 24), а самое главное — обеспечит легкую и безболезненную стыковку с другими технологиями, поддерживаемыми Консорциумом W3 (CSS, XML).

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

Зайдем, к примеру, на сайт норвежского программиста Эрика Наггума (www.naggum.no). Забудем на минуту, что автор не ставил перед собой абсолютно никаких эстетических задач (его приверженность HTML 2.0 объясняется причинами скорее идеологическими), и попробуем посмотреть на этот сайт именно как на образец дизайна. Мы видим единый, логичный, очень строго выдержанный стиль, в котором положение и оформление каждого элемента легко предсказуемы. Ничто не раздражает, не «цепляет взгляд», информация подается опрятными небольшими порциями, текст звучит негромко и выразительно. Право же, страницы этого сайта производят впечатление чистоты и свежести на человека со вкусом, привыкшего к «среднему уровню» современного веб–дизайна.

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

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

Я, конечно, не надеюсь на то, что строгое очарование академического стиля станет, после выхода этой книги, следующей «большой модой» в веб–дизайне. Да это и не нужно. Я всячески прошу прощения за это отступление у Настоящих Дизайнеров (к которым, ну конечно же, принадлежите и вы, — или, по крайней мере, будете принадлежать после того, как одолеете эту книгу до конца); пожалуйста, считайте мою агитацию за HTML 2.0 обращенной не к вам, а… э-э… ко всем остальным — которым вы, кстати, сможете сослужить хорошую службу, наставив их (если представится такая возможность) на путь истинный.

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

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

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

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

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

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

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

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

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

Оглавление книги