Оптимальный веб-дизайн для сайта

Оптимальный веб-дизайн для сайта

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

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

Юзабилити

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

Основы юзабилити сайта

Доступность и оптимизация сайта

Этот термин имеет два основных аспекта:

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

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

Что касается пункта 2), веб-сайт может считаться недоступным, если он не поддерживает устройства с маленьким экраном с одно колоночной компоновкой (поэтому текст очень мелкий, и вам нужно масштабировать его, чтобы прочитать).

Доступность и оптимизация сайта

Какие проблемы может вызвать слишком много внимания к эстетике

Некоторые общие проблемы, которые приходят на ум:

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

Это лишь некоторые примеры. Обычно они являются частью концепции, которую клиент имеет в своей голове. Например, клиент может сказать: «Я представляю свой сайт, где каждая страница выглядит как разлинованная бумага, а весь текст будет отображаться рукописным шрифтом». В такой идее как таковой нет ничего плохого, но могут возникнуть проблемы, когда содержание сайта не соответствует дизайну. Например, текст, написанный от руки, может очень хорошо работать с кратким содержанием, но людям будет сложно его прочитать, если он будет длинным.

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

Устоявшиеся веб-сайты уделяют большое внимание удобству использования и доступности

Достаточно взглянуть на такие крупные платформы, как Google, eBay и Amazon, чтобы узнать, сколько времени и денег тратят крупные технологические компании на то, чтобы сделать свои собственные веб-сайты максимально доступными и удобными в использовании. Эти сайты не используют концептуальные проекты и не пытаются «удивить» посетителя красивой глазу. Я часто привожу эти примеры потенциальным новым клиентам.

Подождите — большинство сайтов сейчас используют шаблоны — разве удобство использования и доступность не встроены в них?

Конечно, есть много проблем, которые устраняются базовым шаблоном веб-сайта. Например, структура HTML (теги заголовков и др.), и адаптивный дизайн включены в большинство современных шаблонов. Однако сам контент может вызвать проблемы. Клиент, добавляющий большие изображения вверху страницы, может сдвинуть текст вниз по странице — даже заголовок страницы может оказаться ниже сгиба. Их навигационные названия расплывчаты или откровенно вводят в заблуждение. Более того, не все шаблоны дизайна обеспечивают хорошее удобство использования и доступность. Многие макеты вопиющим образом игнорируют передовые методы веб-дизайна. Это проблема, когда клиенты говорят: «Мне очень нравится внешний вид этого шаблона дизайна», и вы знаете, что вам придется вывернуть его наизнанку, чтобы сделать его удобным и доступным для посетителя. Я провел много шаблонов дизайна через аудит только для того, чтобы увидеть, что они получили очень низкую оценку, и понял, что объем работы, который мне потребуется, чтобы получить оценку 95%+, не стоит затраченных усилий. В общем, не все шаблоны одинаковы.

Как объяснить клиентам

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