43 ошибки веб-дизайна, которых следует избегать

В Интернете можно найти несколько списков, в которых перечислены ошибки веб-дизайна. Большинство из них представлены как «Самые распространенные ошибки» или «10 основных ошибок». Как только мне встречался подобный список, у меня возникала мысль: «Да ладно, не может быть только 10 ошибок…». Вот тогда я и решил записать все ошибки веб-дизайна, которые пришли на ум, и через полчаса в списке уже было тридцать пунктов. Потом я прошелся по сайтам в Интернете, и мой список вырос до 43 пунктов.

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

1. Пользователь должен понимать, о чем сайт, за считанные секунды.Внимание – это одна из самых ценных валют в Интернете. Если посетитель не смог разобраться, о чем ваш сайт, в течение нескольких секунд, то он у вас не задержится. Ваш сайт должен убедить меня остаться, и очень БЫСТРО!

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

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

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

5. Не устанавливайте открытие ссылки в новом окне. Я так делал на своем первом сайте. Логика проста: если внешняя ссылка открывается в новом окне, то посетитель всегда остается на моем сайте. НЕПРАВИЛЬНО! Дайте пользователю решать, где он хочет открыть ссылку. Для этого в браузерах предусмотрена огромная кнопка «Назад». Не бойтесь отправить посетителя на другой сайт, — он вернется, если посчитает нужным (в последнее время этим принципом пользуются даже порно-сайты…).

6. Не изменяйте размер окна браузера пользователя. Пусть пользователь сам управляет своим браузером. Если вы будете изменять размер, то у пользователя на экране все может перемешаться. И что еще хуже, вы можете потерять доверие посетителя.

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

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

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

10. Не используйте музыку: много лет назад разработчики веб-сайтов всегда старались удачно интегрировать музыку в сайты. Ничего хорошего из этого не вышло. Не используйте музыку, и точка.

11. Если вам НУЖНО, чтобы прозвучал аудио-файл, то дайте пользователю самостоятельно включить его воспроизведение. В некоторых случаях действительно необходим аудио-файл. Например, у вас подготовлено обращение к пользователю, или в вашей экскурсии присутствует аудио-компонент. Прекрасно! Только разрешите пользователю управлять его воспроизведением — пусть он нажмет кнопку “Play”, а не слушает надоедливую музыку сразу после входа на сайт.

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

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

14. Всегда указываете контактные данные. Нет ничего хуже, чем веб-сайт без контактных данных. Это нужно не только посетителям, но и вам. Со временем можно потерять много важных отзывов и мнений.

15. Не нарушайте работу кнопки «Назад» — это главное правило удобства использования. Ни при каких обстоятельствах не нарушайте работу кнопки «Назад». Ее работу нарушает открытие ссылки в новом окне, а также некоторые ссылки с использованием Javascript.

16. Не используйте мигающий текст. Ведь на ваш сайт не заходят посетители из прошлого… где-то из 1996 года.

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

18. Используйте CSS вместо HTML-таблиц. HTML-таблицы использовались раньше для построения структуры страниц. Но с приходом CSS уже нет необходимости все привязывать к таблицам. CSS быстрее, более надежен и функционален.

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

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

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

22. Четко указывайте, что даете ссылку на PDF-файл. С вами никогда такого не случалось, что вы нажимаете на ссылку, и ваш браузер зависает, пока запускается Acrobat Reader, чтобы открыть PDF-файл, который вы не собирались открывать? Это очень раздражает, поэтому четко описывайте ссылки, чтобы пользователь мог сам решить, как их открывать.

23. Не сбивайте пользователя с толку многими вариантами выбора. Не нужно все усложнять, предлагая разные версии вашего сайта. Какую пропускную способность я предпочитаю: 56Kbps? 128Kbps? Flash или HTML? Да мне все равно, дайте мне контент!

24. Не вставляйте рекламу в контент. Смешивая контент с рекламными блоками типа Adsense, вы можете очень быстро увеличить коэффициент кликов по банерам. Однако со временем это негативно скажется на ваших читателях. Раздраженный посетитель – потерянный посетитель.

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

26. Избегайте «стартовых заставок». Не заставляйте пользователя смотреть или читать что-либо перед тем, как он сможет добраться до настоящего контента. Это раздражает, и он останется на сайте только в том случае, если вы предлагаете что-то уникальное.

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

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

29. Обязательно создавайте всплывающую подсказку к ссылкам. Признаюсь, я сам допускал эту ошибку до недавнего времени. Конечно же, проще сказать людям «нажимайте здесь». Но от этого мало толку. Создавайте соответствующие всплывающие подсказки к своим ссылкам. Тогда можно не сомневаться, что читатель будет знать, куда он перейдет при нажатии ссылки. Это также даст некоторые SEO преимущества для тех сайтов, на которые ведет ссылка.

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

31. Не прячьте ссылки. Посетитель должен явно видеть, где ссылка, а где простой текст. Сделайте ссылки контрастного цвета (в большинстве случаев оптимальным вариантом является стандартный синий цвет). Также можно выделить их подчеркиванием.

32. Не выделяйте обычный текст подчеркиванием или цветом. Это допустимо только в крайних случаях. Так же, как и для ссылок, здесь нельзя вводить пользователя в заблуждение. Вы же не хотите, чтобы он пытался нажать на текст, который не является ссылкой.

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

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

35. Для изображений используйте атрибуты ALT и TITLE. Кроме SEO преимуществ, атрибуты ALT и TITLE, имеют большое значение для пользователей отключающих картинки при просмотре.
(Прим. автора: кроме того, ALT текст зачастую помогает понять, что изображено на картинке.)

36. Не используйте резкие цвета. Если у пользователя болит голова после 10-минутного пребывания на вашем сайте, то, скорее всего, вам лучше подобрать другое цветовое решение. Создайте цветовую палитру вокруг самого главного (т.е. создайте настроение и дайте пользователю сосредоточиться на содержании).

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

38. Избегайте использования ссылок Javascript. Такие ссылки выполняют небольшой сценарий Javascript при нажатии на них. Держитесь от них подальше, так как они часто создают проблемы для пользователей.

39. Помещайте вниз страницы навигационные ссылки. Люди привыкли прокручивать страницу вниз, если им не удалось найти определенную информацию. Как минимум, нужно дать ссылку на «Домашнюю страницу», а также на страницу «Контакты».

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

41. Никакой горизонтальной прокрутки. Тогда как вертикальная прокрутка приемлема, этого нельзя сказать о горизонтальной прокрутке. Сегодня большинство людей используют разрешение экрана 1024 x 768 пикселей. Проверьте, умещается ли в него ваш веб-сайт.

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

43. Если вы используете проверку CAPTCHA, то проверьте, чтобы символы легко читались. На многих сайтах используются фильтры CAPTCHA, чтобы сократить количество спама в комментариях или формах регистрации. Но есть у них одна проблема – зачастую пользователю приходится звать всю семью, чтобы расшифровать символы.

На этом все. Если вам есть что добавить, не стесняйтесь оставлять комментарии.

 

About: neadmin


Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Перейти к верхней панели