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

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

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

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

,    ,    
(o,o)   
  /    ///
^   ^

Изобретение GIFа как такового дало возможность сетевикам обмениваться картинками (ума не приложу, как они это делали на тогдашних 2400-модемах). Затем был HTML, а потом и прочее, прочее...

На данный момент можно определить как типы -

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

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

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

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

"смешанные" типы - суть понятна и так. Обычно комбинация всех этих типов.

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

Второй пример - логотип сайта имени газеты "ВСЕМ! ВСЕМ! ВСЕМ!". Более навороченный логотип издательского дома, дополненный графическими элементами. По ходу развития сайта он трижды меняет свое дополнение, но основная его часть остается без изменений, что в общем-то и обеспечивает его узнавание. В какой-то мере реклама (а стили, логотипы и пр. - это все рекламные штучки) использует педагогический принцип: - "Повторение - мать учения!"  © Ушинский (отец русской педагогики).

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

А вот так можно распорядиться изобразительным материалом и логотипом в рамках стиля.

пример афиши, книжной обложки.

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

Индивидуальность. Ну это как раз понятно. Неинтересно, когда "как у всех".

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

Также можете проследить методику применения логотипов на сайтах известных фирм и агентств... Ford, Toyota, Sony, CNN, Microsoft... и многих других.

Статья о модульных сетках >>

Цвет как таковой >>

14.09.99 © Виктор Вязьминов (MrDeSign)