Інтернет Мастерская
Подборка полезных статей для веб-мастеров и заказчиков

версия для печати

10 признаков дурного тона в веб-дизайне

| источник: www.diaspro.com

О чем эта статья?

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

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

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

1. Представление Flash-анимации

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

Мне не раз приходилось сталкиваться с такой ситуацией: я как потенциальный пользователь определенных услуг перехожу по ссылке на сайт и вижу пустой экран. Ни сообщения о том, где я могу получить нужную мне информацию, ни ссылки на версию сайта, не содержащего Flash-компонентов - ничего! Как поступит на моем месте любой посетитель? Конечно, покинет ресурс, который уже на подступах оказался совершенно бесполезным. Вот потеря одного потенциального потребителя, пользователя, партнера, клиента и пр. А сколько их может произойти за день, неделю, месяц? Можно представить, какие эмоции будут преобладать у посетителя, которого постигло подобное разочарование. Это сродни с тем, если бы вас пригласили в гости, но при вашем появлении, чуть приоткрыв дверь, тут же с громким стуком захлопнули бы ее перед самым вашим носом.

Аналогичная ситуация с навигационными меню, выполненными посредством Flash. Это красиво - согласен! Это модно - допустим! Это интерактивно - без сомнения! Но зачем лишать остальных посетителей сайта, пришедших не для того, чтобы восхититься вашими анимационными шедеврами, возможности получить ценную информацию, консультацию, совет, помощь, наконец? Почему те пользователи, которые не могут или попросту не хотят устанавливать дополнительное программное обеспечение, должны чувствовать себя обделенными? Представьте, что вы зашли в огромный супермаркет, чтобы купить продуктов: вы идете вдоль нескончаемых рядов с разноцветными упаковками, яркими пакетами, броскими наклейками, но понять, сколько стоит любой из продуктов, не можете: ценники расположены вверх тормашками. В ответ на ваш вопросительный взгляд директор магазина сообщает о том, что вы можете узнать стоимость товаров, но для этого придется встать на голову. Не хотите оказаться в положении Буратино? Тогда идите и ищите другой магазин. Хозяин - барин.

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

2. Кнопки

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

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

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

3. Баннеры

Баннеры, баннеры, баннеры... Сколько о них писали, их ругали и хвалили, критиковали и защищали. Однако, все соглашались с утверждением о том, что баннерная реклама нужна и эффективна (в особенности, когда речь заходила о продвижении Интернет-проекта). Никто и не спорит, однако, как говорится, "хорошего понемногу". Что же мы сегодня наблюдаем? Электронные библиотеки, почтовые серверы, торговые и развлекательные порталы буквально ломятся от обилия рекламы, за которым скрывается истинное предназначение любого Интернет-проекта - содержание. Его попросту не видно на фоне всевозможных "небоскребов", "растяжек", кнопок и прочих рекламных носителей. Складывается впечатление, что веб-разработчики во главу угла ставят стремление заработать на баннерных показах, увеличить траффик, раскрутить дочерние проекты - все, что угодно, но не привлечь посетителя актуальным, полезным контентом, которого так не хватает современному Интернету. Реклама размещается во всех мыслимых и немыслимых уголках сайта: рядом с логотипом и в "подвале", под навигационным меню и над формой рассылки, в заголовке разделов и между новостными блоками. Она настолько наводнила информационное пространство всемирной сети, что мешает работать, искать действительно нужную информацию, читать электронную корреспонденцию и общаться с друзьями. Она - повсюду. Но и этого некоторым особенно неугомонным рекламодателям кажется мало: теперь реклама "научилась" перемещаться вслед за прокруткой окна браузера, появляться откуда ни возьмись при наведении на самые, казалось, безобидные элементы оформления сайта и т.д. Вполне естественно, что после такого подхода со стороны рекламодателей многие пользователи стали отключать графику, Java и Flash, блокировать popup-окна.

Однако, не следует понимать вышесказанное как призыв к игнорированию баннерной рекламы. Проектируя макет для будущего проекта нужно тщательно продумать расположение рекламных модулей, их тип и формат, количество и периодичность показа. Необходимо остановиться на варианте, подразумевающем разумное количество рекламных единиц на одного посетителя. В среднем, это 2-3 баннера, из них один большого формата (например, 468х60), остальные - меньшего (к примеру, два по 120х60). Размещать баннеры следует на достаточном расстоянии друг от друга, что позволит сконцентрировать внимание посетителя на содержании сайта, но в то же время - привлечь своей рекламной идеей. При наличии на сайте нескольких тематических разделов было бы верным решением организовать показы по контекстному признаку. Например, в разделе "Новости" показываются баннеры новостных агентств и электронных СМИ, в рубрике "Финансы" демонстрируется реклама банковских учреждений и страховых обществ и т.д.
 

4. Альтернативная навигация

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

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

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

(а) система навигации выполнена по Flash-технологии, а проигрывателя роликов на компьютере посетителя не установлено;

(б) система навигации представляет собой графические объекты, а поддержка графики в браузере посетителя не установлена (выключена);

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

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

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

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

5. Добавление в "Избранное"/Стартовая страница браузера (Home Page)

В последнее время неотъемлемым атрибутом многих сайтов стало наличие ссылок добавления страницы в "Избранное" (Favorites/Bookmarks) и установки текущего URL в качестве стартового адреса браузера (Home Page). С одной стороны, преимущество такой автоматической возможности налицо: посетителю не приходится самому переходить по пунктам меню своего браузера, а надо лишь нажать на соответствующую гиперссылку. Однако, это не совсем так.

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

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

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

6. Popup-окна

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

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

7. Обратная связь

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

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

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

8. Поиск

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

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

9. Орфография

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

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

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

10. Форма и содержание

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

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

К примеру, что является главным для посетителей сервера новостей? Новости, информационные и аналитические материалы, обсуждения и т.д. Тогда зачем на странице каждого раздела размещать огромную Flash-заставку, характеризующую тему текущей рубрики? С другой стороны, чего ждет посетитель от сайта, посвященного векторному формату SVG? Побольше практических примеров с иллюстрациями, примерами, демонстрационными презентациями и т.д.
 

В заключение...

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

Поставить ссылку в соцсети