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

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

Основные принципы создания качественного дизайна сайта

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

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

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

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

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

Разберем этот тезис на первом, пришедшем в голову, примере: операторы мобильной связи. Основные игроки в этой сфере – МТС, БиЛайн и МегаФон. Думаю, Вам нетрудно будет вспомнить их цветовые гаммы (белый на красном, черный на белом (и обязательно желто-черные полосы) и белый на зеленом соответственно). А теперь представьте такую ситуацию: на веб-странице Вы видите ссылки на эти три сайта и находятся ссылки совсем рядом. Вам нужен, допустим, МТС, Вы уверенно кликаете мышью на соответствующей ссылке, загружается страница и… Вы видите зеленый фон. Практически уверен, что первой мыслью будет «Акела промахнулся», вторая – ох эти сайтостроители – опять со ссылками напутали, это же не МТС. И пользователь не будет смотреть в адресную строку, чтобы убедиться, что он попал именно туда, куда нужно, а веб-страница будет моментально закрыта.

Все! Потенциальный клиент так и не узнал о всех тех «вкусностях», которые он мог бы и, самое главное, хотел получить, идя на сайт. Но вчитываться в текст пользователь не стал – цветовая гамма сайта и так «сигнализировала» ему: «не тот сайт», так зачем же терять время и напрягать глаза, вчитываясь в текст. Также упомяну, что узнаваемый логотип и/или слоган компании (кстати, слоган может быть и немного изменен с учетом специфики Сети) должны сразу «цеплять взгляд» посетителя.

KISS – делай проще, дурачок. Принцип KISS (Keep Is Simple, Stupid), что как раз и переводится как «делай проще, дурачок» широко распространен в среде разработчиков ПО, в том числе и web-разработчиков. Собственно, принцип и заключается в том, чтобы не «изобретать велосипед» и размещать элементы сайта там, где пользователь ожидает их увидеть (поверьте – разместить логотип где-нибудь внизу страницы – это не очень хорошая идея, даже если очень хочется). Люди неохотно меняют свои привычки, а ведь пользователи, серферы Сети – это обычные люди. Именно поэтому, для того, чтобы посетителям Вашего сайта не пришлось искать (и, возможно, так и не найти) то, за чем они пришли, рекомендуется соблюдать несколько правил. Рассмотрим их поподробнее.

Правила размещения информационных блоков на сайте

  • Логотип компании-владельца сайта располагается вверху (чаще всего – слева, но это уже не столь важно, главное – «зацепить взгляд», чтобы пользователь убедился, что пришел по адресу);
  • Главное меню находится также в верхней части страницы: пункты меню расположены либо горизонтально, либо вертикально (в этом случае меню находится обычно в левой части страницы);
  • Логотип и/или ссылку на сайт разработчика желательно расположить в нижней части страницы. Не нужно совсем убирать эту ссылку: она дает посетителю сайта больше уверенности, что сайт качественный (раз его разработчик не прячется, а совсем даже наоборот), ну а раз качественный, значит – хороший. Согласитесь, документ с подписью, а уж тем более – печатью, выглядит гораздо солиднее обычного листа бумаги. То же самое можно сказать и про веб-страницы.
  • Текст должен читаться легко, не нужно заставлять человека вчитываться, понимать текст по буквам, ведь в этом случае он и запомнит буквы, а никак не мысль, которую нужно было до него донести этим текстом.

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

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

При меньшей удаче она запоминается пользователем… как спам, как навязчивое «впаривание, мягко говоря, плохого товара». Не думаю, что это хорошо, по крайней мере, в большинстве случаев. Но это никоим образом не значит, что на сайте должен быть лишь голый текст! Ничего подобного! Буквально пара капель терпения – и Вы узнаете, как сделать красиво и понятно. А нужно всего-навсего…Изучите Вашего клиента. Наверняка, если Вы проводили подобные исследования, то «среднестатистический портрет» посетителя сайта уже известен. Значит, нужно строить облик сайта так, чтобы этому посетителю было легко, удобно и приятно находиться на этом ресурсе. Ориентируетесь на молодежь – смело используйте молодежный сленг, на домохозяек – сделайте из сайта уютную комнату. Также, с точки зрения web-программиста, могу добавить, что и «вес» страницы, то есть ее объем также можно определить, ориентируясь на этого самого «среднестатистического посетителя», в частности из скорости его соединения с Сетью и стоимостью расходов на трафик. Например, студентам, посетившим сайт электронной библиотеки любимого учебного заведения, скорее всего будет интересна возможность с минимальными затратами скачать нужную книгу. Бизнесмена, решившего купить элитный офис, такое, конечно же, не устроит – здесь будет хороша и ненавязчивая flash-анимация, и качественные большие фото, и даже фоновая музыка – но все должно быть строго и по-деловому. Ну а клиенты модных бутиков вполне могут себе позволить просмотреть видео с показа последней коллекции любимого кутюрье.

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

Неважно, будет ли этим делом укладка кирпичей, продвижение сайта или пилотирование реактивного истребителя. Здесь, думаю, будет достаточно процитировать одно стихотворение, «беда, коль пироги стал печь сапожник, а сапоги тачать – пирожник», думаю, этого будет достаточно.