Веб-дизайн

Карты на стол


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

Противопоставление светло-оливковых надписей, набран­ных крупным жирным рубленым (Arial Black), блокам черного мелкого курсива шрифта с засечками (Monotype Garamond Italic, тот же самый, что и в логотипе), повторя­ясь четыре раза справа от основного визуала-фотографии, задает ритм чередования фрагментов текста и вводит два основных шрифта и два основных цвета, которые будут использоваться в заголовках и навигации по всему сайту. (Светлое начертание шрифта Frutiger, которым набрана над­пись «Dmitry Kirsanov Studio» на сплэш-странице, оказалось неустойчивым в отрыве от логотипа, поэтому на внутренних страницах сайта оно используется только в «колонтиту­ле» вверху каждой страницы и в строке копирайта справа внизу — т. е. в непосредственной близости от элементов, построенных на основе логотипа и с его цветами.)

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

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

312

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

• Глаз — «we are» — «portfolio»: «Смотрите, кто мы такие * и что мы можем делать».

• Часы — «offering» — «interested?»: «Если вы заинтересо­ваны, не тратьте время, напишите нам, чтобы обсудить наши предложения».

• Инструменты — «specializing» — «classes»: «Учитесь поль­зоваться дизайнерскими инструментами».

• Игрушечный самолет — «integrating» — «dmitry»: «По­знакомьтесь с автором и с его творчеством в разных жанрах».

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

• Одна сплошная светлая горизонтальная полоса вверху страницы (под «Dmitry Kirsanov Studio») уравновеши­вается тремя пунктирными параллельными полосами в навигационной панели внизу.

• Зона вытянутых по вертикали градиентов вверху страни­цы сменяется доминированием горизонтальных градиен­тов в центре и внизу.

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


Содержание раздела