Владелец любого сайта желает иметь много посетителей. Если же интернет-ресурс разработан для получения прибыли, то цифры посещаемости и конверсии становятся жизненно важными. Высокий уровень юзабилити веб-страниц обеспечивает полновесный трафик и большое количество покупателей. Что такое «юзабилити» и как сделать сайт привлекательным для клиентов?
Что такое «юзабилити» usability?
Согласно терминологии, юзабилити сайта — это степень удобства работы человека с интерфейсом. Этим же словом называются методы улучшения сайта во время разработки.
Когда пользователь открывает веб-страницу, он желает увидеть понятное меню, четкую структуру, полезный читабельный контент и т.д. Но, вместо этого, нередко наталкивается на путаницу из картинок, кнопок и гиперссылок. Вроде бы, все элементы присутствуют, но что с этим делать — поди, разберись!
Захочет ли клиент вникать, каким образом ему решить свои задачи? Вопрос очень важный, потому что на сегодняшний день высокий уровень юзабилити сайта является серьезным конкурентным преимуществом. Как утверждает Forrester Research, интернет-магазины не досчитываются до половины покупателей только из-за того, что люди не могут быстро найти нужный товар. При этом 40% посетителей, получив отрицательный опыт работы, на «плохой» сайт уже никогда не возвращаются.
По мнению социологов, люди в наше время слишком нетерпеливы. Посетителей Интернета это касается в самой полной мере. Как свидетельствует Nielsen Norman Group, средний пользователь проводит на одной странице 27 секунд и в большинстве случаев не досматривает ее до конца.
Одна из причин такого поведения, по мнению Якоба Нильсена — огромное количество бесполезной информации. Люди просто вынуждены быстро отфильтровывать то, что их не интересует. Если изучать каждый открытый сайт подробно, все свободное время уйдет только на Интернет, о реальной жизни придется забыть. Клиенты не хотят ждать, а потому не любят сложный дизайн и медленную загрузку. По той же причине они не желают читать правила пользования главной страницей. Посетитель хотел бы за несколько секунд, после беглого просмотра, все понять и начать действовать.
В том же ключе высказывается С. Круг, один из самых известных в мире специалистов по юзабилити. По его словам, простую и понятную веб-страницу можно сравнить с хорошо освещенной витриной магазина. Разработчик должен понимать, что после загрузки сайта в его распоряжении всего несколько секунд. Следует построить интерфейс таким образом, чтобы за это короткое время объяснить пользователю, где он находится и что делать дальше. При этом надо заинтересовать человека, чтобы он почувствовал — здесь лучшее из того, что ему требуется. В противном случае, клиент уйдет на другой сайт.
Сравнивая два веб-ресурса с разным уровнем юзабилити, можно отметить:
Что происходит в действительности?
Если теоретически с юзабилити все понятно, то на практике суровая реальность вносит свои коррективы. Когда клиент платит веб-разработчикам за создание сайта, он доверяет специалистам. Однако существует много фирм, которые без контроля со стороны заказчика не в состоянии разработать удобный интерфейс. Что делать? Для начала — разобраться, знают ли в этой компании о юзабилити и какие методы используют в своей работе. А заодно поинтересоваться, дают ли мастера гарантию того, что сайт будет удобным для посетителей?
Почти всегда создатели сайтов на подобные вопросы отвечают одинаково. Да, принципы известны, да, мы ими пользуемся, и вообще, у нас очень опытный дизайнер. После чего начинают работу с проектирования дизайна — и полученный результат далеко не всегда соответствует ожидаемому. Потому что дизайну должен предшествовать этап проектирования с созданием прототипов страниц. В идеале же сначала следует изучить потребности пользователей. А готовые прототипы — протестировать на респондентах из целевой группы.
Но при таком подходе вырастет плановый бюджет, тогда как реально выделенная сумма часто бывает сильно ограничена…
Что является предметом изучения юзабилити?
Юзабилити рассматривает несколько основных факторов, среди которых:
По данным статистики, каждые 6 пользователей из 10 не могут найти в интернете нужную информацию. Одна из главных причин заключается в пренебрежении правилами юзабилити, в результате чего на поиск уходит больше времени и работа оказывается малоэффективной. Поэтому тем, у кого уже есть веб-ресурс, полезно протестировать его.
Тестирование
Проведение тестов является обязательным этапом разработки юзабилити. Суть его в том, что несколько респондентов, используя прототип системы, независимо друг от друга решают стандартный набор задач. Рядом находится специалист, фиксирующий их слова и действия. Полученные данные анализируются, после чего определяются необходимые коррективы.
Общая схема разработки сайта с высоким уровнем юзабилити
Определение цели
В начале работы следует определить поставленные перед сайтом цели:
- зачем он создается?
- для кого (целевая аудитория)?
- в какое время посетители будут на сайте и что они должны на нем делать?
Имеют значение также цели юзабилити сайта. В общем случае, веб-ресурс должен отвечать следующим требованиям:
- простой в обучении;
- эффективный в работе;
- легко запоминающийся при повторном открытии;
- приносящий пользователю удовлетворение.
Для конкретного сайта, в зависимости от сложившейся ситуации и целевой аудитории, дополнительно могут быть поставлены и другие цели.
Сбор данных от пользователей
Эти сведения нужны по той простой причине, что сайт делается, в конечном итоге, для людей. Для сбора данных существуют различные способы, в т.ч. тестирование юзабилити, логи серверов и обратная связь. При помощи полученной информации можно определить, в какой мере сайт (если он уже работает) удовлетворяет посетителей.
Разработка прототипа
Для первой серии тестов достаточно сделать прототип интерфейса, без графики и с минимальным количеством текста. Этого достаточно для того, чтобы получить вполне объективные данные с комментариями пользователей. Анализ результатов позволит определить, насколько данный вариант сайта способен решать задачи юзеров. Прототипы делаются на бумаге, в HTML, при помощи MSVisio и т.д.
Подготовка и размещение контента
При подготовке текстовых материалов следует помнить главное — сайт обязан быть полезным и интересным для целевой аудитории. По этому принципу следует отобрать имеющуюся информацию.
При компоновке материала нужно помнить — чтение с экрана отличается от привычного, с бумажных носителей. Попав на сайт, посетитель быстро сканирует содержимое, выхватывая небольшие отрывки, чтобы определить, нужна ли ему эта страница. И двигается при этом слева направо, сверху вниз. Поэтому самый важный материал размещается вверху, ближе к левому полю. Крупных блоков быть не должно, контент разбивается на маленькие абзацы. Следует выбросить все вспомогательные слова, оставить только фразы с конкретной информацией. Очень полезно использование таблиц и списков.
По такому же принципу работают и поисковики — для них то, что в тексте вверху слева, важнее всего остального.
Тестирование
В заключение нужно определить, насколько эффективен разработанный сайт. О проведении тестирования было сказано выше.
Правила юзабилити для отдельных категорий интерфейса
Общая схема задает направление, в котором следует двигаться при создании веб-ресурса. Но на каждом этапе нужно учитывать правила, соблюдение которых позволит сайту стать привлекательным для пользователей, а значит — успешным. Среди многочисленных рекомендаций можно выделить основную: «чем проще — тем лучше». Полезно также использование стандартных приемов — если посетитель видел нечто подобное на других интерфейсах, он уже знает, как этим пользоваться.
Навигация
Навигация, т.е. схема перехода между разделами, должна быть удобной для посетителя, и учитывать индексацию сайта поисковыми машинами. Последовательность страниц, посещаемых человеком (или роботом), называется «навигационной тропой».
Карта сайта
Качественно выполненная карта сайта помогает юзеру быстро найти необходимую информацию. Поисковики, благодаря наличию этого элемента, лучше индексируют сайт. Обязательно следует сгруппировать страницы по темам. Кроме хорошо проработанного дизайна, на карте нужно разместить прямую текстовую ссылку на домашнюю страницу — это важно для поискового робота.
Уровни и директории
Посетители предпочитают сайты, на которых от главной до нужной информации можно добраться за один-два клика. Если для этого приходится открывать много «промежуточных» страниц, то после второй-третьей люди уходят на другой веб-ресурс.
Так же поступают и роботы. Они углубляются лишь на несколько уровней. Если искомая информация «глубоко спрятана», то это отрицательно сказывается на индексации страниц, не зависимо от того, насколько хорошей будет навигационная система.
Text Links (Текстовые ссылки)
Это одно из лучших решений, как с точки зрения юзабилити, так и для SEO. Нечитабельный код мешает поисковику следовать навигационной системе сайта. Наличие дополнительных текстовых ссылок облегчает работу пользователей и «нравится» поисковым машинам.
Anchor text (Ссылочный текст)
Так называются слова в гиперссылке, для перехода на другую страницу или сайт. С позиции SEO это еще одна возможность поставить ключевое слово. С точки зрения юзабилити — дополнительное удобство, так как с предложением перехода сразу сообщается тема.
Breadcrumbs («Хлебные крошки»)
Выражение, заимствованное у братьев Гримм, характеризует систему навигации, при которой человек в любой момент легко определяет где он находится. А на предыдущую страницу может вернуться, не нажимая «Back». Роботам такая схема тоже облегчает передвижение по сайту.
Titles (Заголовки)
Заголовки делаются краткими, конкретными и обязательно соответствующими содержанию текста. Посетитель должен сразу понять, о чем идет речь. Поисковые системы в этом случае быстрее определяют релевантность сайта, сканируя контекст его страниц, и определяя, насколько уместны именно такие заголовки.
Рекомендации
1. Навигация для всех страниц должна быть одинаковой.
2. На каждой странице указывается название сайта и/или логотип. В большинстве случаев название идет со ссылкой на главную. Логотип обычно располагается в левом верхнем углу.
Поиск по сайту
Довольно часто, не обращая внимания на систему навигации, посетители для перехода на нужную страницу сразу используют внутренний поиск. В каких случаях веб-ресурс нуждается в подобном элементе? Я. Нильсен предлагает пользоваться правилом: «Если сайт имеет до 100 страниц, поиск не обязателен. От 100 до 1000 — желательно, хотя система выбирается попроще. Свыше 1000 — необходимо, притом система должна быть высокоэффективной».
Рекомендации
1. Лучше всего, если поисковая форма имеется на каждой странице (обычно вверху справа).
2. Длина поля для запроса выбирается в пределах 27 – 30 символов.
3. Система работает только по «своему» сайту, поиск в других ресурсах Интернета не предлагается.
4. Результаты поиска желательно оформлять так, как это делают глобальные поисковики: содержать введенный запрос, краткое описание, заголовок со ссылкой.
5. Рекомендуется проверять орфографию, и, при ошибке в запросе, уточнять фразу («Возможно, Вы хотели написать…?»)
Главная страница
С главной страницы обычно начинается знакомство с сайтом. Поэтому требования к ней предъявляются особенные:
1. На главной должно быть краткое и понятное разъяснение, что собой представляет веб-ресурс и для чего он нужен. Часто для этого используют слоган и приветствие.
2. Главная страница — это сайт в миниатюре. На ней располагается обзор содержимого: коммерческие предложения, заголовки последних статей, сервисы (авторизация, подписка и т.д.).
3. Желательно, чтобы часть информации регулярно обновлялась (новости, корпоративный блог)
4. Большую пользу приносит наличие ссылки/подсказки типа «Откуда начинать». Чем очевиднее способ дальнейшего продвижения по сайту, тем посетителю проще и удобнее перейти к основному содержимому.
Перечисленные выше требования по навигации, поиску и т.д. в полной мере относятся и к главной странице.
Текст
Лучше всего, если тексты короткие, без «ненужных» слов, содержащие только конкретную информацию по теме. При их составлении используется правило «пирамиды»: сначала даются основные выводы, затем приводится их обоснование, после чего тема разворачивается более подробно. Самая важная и полезная часть информации располагается вверху — она должна быть видна без прокрутки.
Шрифты
При чтении пользователь не должен напрягаться. Слишком мелкий шрифт делает процесс неприятным, многие не пожелают даже знакомиться с текстом. Да и поисковики любят покрупнее. То же самое относится к непривычному фону или негармоничным сочетаниям цвета шрифта и фона (красный на синем, оранжевый на темно-зеленом и др.). Мигающие, выскакивающие или прокручивающиеся элементы на поисковые машины не производят никакого «впечатления». А читателям сильно мешают, поэтому лучше обойтись без них.
Заголовки
Рекомендуется делить страницу на разделы, используя теги заголовков в формате HTML-документа (<H1>-<H6>). Это привлекает внимание посетителей, а поисковые системы подобную структуру считают серьезным преимуществом веб-ресурса.
Оформление
1. Минимальный размер шрифта — 12 рх (в MS Word это приблизительно соответствует 10 pt).
2. Подбирая шрифты, лучше ориентироваться не на фиксированный размер, а на относительные величины.
3. Шрифты «без засечек» (Arial, Arial Black, Verdana, Tahoma) на экране читаются легче, чем Times New Roman или Georgia.
4. При использовании шрифтов разного цвета, их должно быть не более четырех.
5. Применение только прописных букв снижает скорость чтения и ухудшает восприятие смысла.
6. Цвета текста и фона должны быть контрастными. Лучший вариант — черные буквы на белом поле.
Дизайн
С точки зрения людей и поисковых машин, оптимальный дизайн должен быть предельно простым и четко структурированным. В этом случае и человеку удобнее бродить по страницам, и поисковики такой сайт посещают охотнее, потому что информация находится легко и быстро. При помощи HTML-кодов дизайнер без проблем изменяет содержание.
Дополнительные теги
Скорее всего, браузеры будут больше ориентированы на стандарты CSS, поэтому тег <font> станет непопулярным, а <b> и <i> будут заменены другими, так что желательно использовать их пореже. При работе с HTML-редактором, при необходимости изменений, могут появиться дополнительные теги. В то же время DreamWeaver и другие редакторы такого типа их группируют, что «нравится» поисковикам. К тому же кодировка становится более четкой, дальнейшие апдейты упрощаются.
Скрипты и CSS
Встроенные ссылки или ссылки JavaScript усложняют работу поисковых систем. Но в секциях <head> и <body> применение такого кода позволяет сделать использование ресурсов сайта при обходе машиной более интенсивным.
Каскадные таблицы стилей или CSS для поисковых ботов очень удобны. В секции <head> CSS иметь не обязательно, достаточно ссылки на внешние файлы CSS-страницы.
Удобства для людей с ограниченными возможностями
Сайт посещает множество людей, и не все из них имеют одинаковые возможности для ознакомления с содержимым. Чем больше категорий населения смогут прочитать контент, чем успешнее окажется веб-ресурс. Что же касается сайтов государственных, общественных или образовательных организаций, то их просто необходимо разрабатывать с учетом потребностей пользователей с ограниченными возможностями.
Рекомендации для повышения доступности сайта
1. Навигация обязана предусматривать вариант управления только клавиатурой, без мыши.
2. В начале каждой страницы должна стоять ссылка на главную так, чтобы это было первым, что произносит диктор на экране.
3. Использование тега label связывает поля формы с подсказками, после чего формы начинают взаимодействовать с дикторами.
4. Дикторы игнорируют изображения, поэтому каждый рисунок должен иметь описание.
5. Если в целевой аудитории есть слабовидящие, то нужно поставить опцию изменения размеров шрифта, несмотря на то, что подобная имеется в браузере.
6. Не все адаптационные технологии хорошо воспринимают javascript, поэтому лучше использовать его минимально.
Статистика сайта
Статистика требуется для того, чтобы иметь возможность проанализировать действия пользователей и сделать выводы о мерах по доработке сайта. Отмечаются часто посещаемые страницы, а также разделы, в которых клиенты испытывают трудности. Определение маршрута движения по сайту показывает, в каких местах люди уходят, что позволяет разобраться, почему. Помогают улучшить навигацию и данные об ошибках.
А если сайт уже работает?
Допустим, с разработкой все понятно. А что делать, если сайт уже работает? На него затрачены средства, он долго создавался, было просмотрено множество вариантов… Все переделать?
Не часто, но бывает и так, что приходится переделывать — настолько плохо отвечает веб-ресурс потребностям посетителей. Хотя обычно бывает достаточно «мелкого ремонта». Главное при этом — обратиться к опытным специалистам. Прежде всего, следует проконсультироваться у профессионала по юзабилити. Затем придется провести исследование eye traking (слежение за движением глаз) и обычное юзабилити-тестирование с привлечением респондентов из целевой аудитории. И необходимо провести независимый аудит сайта или аудит интернет-магазина. В результате появится возможность составить перечень недостатков, после чего можно начинать работу по улучшению сайта.
Создание сайта, дизайн которого удовлетворит и посетителей, и поисковые машины, вполне возможно. Разработано достаточно много специальных приемов, использование которых сделает веб-ресурс «дружелюбным» для поисковиков, простым и удобным для людей. Между юзабилити и эффективным SEO существует тесная связь, направленная на то, чтобы повернуть Интернет лицом к потребителям.
Что такое «юзабилити» usability?
Согласно терминологии, юзабилити сайта — это степень удобства работы человека с интерфейсом. Этим же словом называются методы улучшения сайта во время разработки.
Когда пользователь открывает веб-страницу, он желает увидеть понятное меню, четкую структуру, полезный читабельный контент и т.д. Но, вместо этого, нередко наталкивается на путаницу из картинок, кнопок и гиперссылок. Вроде бы, все элементы присутствуют, но что с этим делать — поди, разберись!
Захочет ли клиент вникать, каким образом ему решить свои задачи? Вопрос очень важный, потому что на сегодняшний день высокий уровень юзабилити сайта является серьезным конкурентным преимуществом. Как утверждает Forrester Research, интернет-магазины не досчитываются до половины покупателей только из-за того, что люди не могут быстро найти нужный товар. При этом 40% посетителей, получив отрицательный опыт работы, на «плохой» сайт уже никогда не возвращаются.
По мнению социологов, люди в наше время слишком нетерпеливы. Посетителей Интернета это касается в самой полной мере. Как свидетельствует Nielsen Norman Group, средний пользователь проводит на одной странице 27 секунд и в большинстве случаев не досматривает ее до конца.
Одна из причин такого поведения, по мнению Якоба Нильсена — огромное количество бесполезной информации. Люди просто вынуждены быстро отфильтровывать то, что их не интересует. Если изучать каждый открытый сайт подробно, все свободное время уйдет только на Интернет, о реальной жизни придется забыть. Клиенты не хотят ждать, а потому не любят сложный дизайн и медленную загрузку. По той же причине они не желают читать правила пользования главной страницей. Посетитель хотел бы за несколько секунд, после беглого просмотра, все понять и начать действовать.
В том же ключе высказывается С. Круг, один из самых известных в мире специалистов по юзабилити. По его словам, простую и понятную веб-страницу можно сравнить с хорошо освещенной витриной магазина. Разработчик должен понимать, что после загрузки сайта в его распоряжении всего несколько секунд. Следует построить интерфейс таким образом, чтобы за это короткое время объяснить пользователю, где он находится и что делать дальше. При этом надо заинтересовать человека, чтобы он почувствовал — здесь лучшее из того, что ему требуется. В противном случае, клиент уйдет на другой сайт.
Сравнивая два веб-ресурса с разным уровнем юзабилити, можно отметить:
- при равных расходах на рекламу «удобный» сайт получит больше клиентов, чем «неудобный», и стоимость обращения через такой сайт будет более низкой;
- комфортабельная работа на сайте делает пользователя лояльным к компании, что выражается в повторных посещениях и покупках;
- при высоком уровне юзабилити посетитель находит на страницах ответы на свои вопросы; в результате нагрузка (а вместе с ней и расходы) на менеджеров снижаются.
Что происходит в действительности?
Если теоретически с юзабилити все понятно, то на практике суровая реальность вносит свои коррективы. Когда клиент платит веб-разработчикам за создание сайта, он доверяет специалистам. Однако существует много фирм, которые без контроля со стороны заказчика не в состоянии разработать удобный интерфейс. Что делать? Для начала — разобраться, знают ли в этой компании о юзабилити и какие методы используют в своей работе. А заодно поинтересоваться, дают ли мастера гарантию того, что сайт будет удобным для посетителей?
Почти всегда создатели сайтов на подобные вопросы отвечают одинаково. Да, принципы известны, да, мы ими пользуемся, и вообще, у нас очень опытный дизайнер. После чего начинают работу с проектирования дизайна — и полученный результат далеко не всегда соответствует ожидаемому. Потому что дизайну должен предшествовать этап проектирования с созданием прототипов страниц. В идеале же сначала следует изучить потребности пользователей. А готовые прототипы — протестировать на респондентах из целевой группы.
Но при таком подходе вырастет плановый бюджет, тогда как реально выделенная сумма часто бывает сильно ограничена…
Что является предметом изучения юзабилити?
Юзабилити рассматривает несколько основных факторов, среди которых:
- Простота обучения. Определяется тем, как быстро посетитель, впервые вошедший на сайт, осваивает выполнение простых заданий.
- Эффективность использования. Насколько быстро клиент, научившийся пользоваться сайтом, решает свои вопросы?
- Запоминаемость. Хорошо ли пользователь запоминает схему работы на сайте при повторном открытии веб-страниц? Или потребуется снова что-то изучать?
- Ошибки при работе. Часто ли пользователь ошибается, решая на сайте свои задачи? Насколько эти ошибки серьезны, легко ли их исправить?
- Удовлетворение от работы. Нравится ли посетителю работать с системой, и если да, то в какой мере?
Тестирование
Проведение тестов является обязательным этапом разработки юзабилити. Суть его в том, что несколько респондентов, используя прототип системы, независимо друг от друга решают стандартный набор задач. Рядом находится специалист, фиксирующий их слова и действия. Полученные данные анализируются, после чего определяются необходимые коррективы.
Главная цель тестирования — обнаружение проблем, которые возникают у респондентов при работе на сайте.
Общая схема разработки сайта с высоким уровнем юзабилити
Определение цели
В начале работы следует определить поставленные перед сайтом цели:
- зачем он создается?
- для кого (целевая аудитория)?
- в какое время посетители будут на сайте и что они должны на нем делать?
Имеют значение также цели юзабилити сайта. В общем случае, веб-ресурс должен отвечать следующим требованиям:
- простой в обучении;
- эффективный в работе;
- легко запоминающийся при повторном открытии;
- приносящий пользователю удовлетворение.
Для конкретного сайта, в зависимости от сложившейся ситуации и целевой аудитории, дополнительно могут быть поставлены и другие цели.
Сбор данных от пользователей
Эти сведения нужны по той простой причине, что сайт делается, в конечном итоге, для людей. Для сбора данных существуют различные способы, в т.ч. тестирование юзабилити, логи серверов и обратная связь. При помощи полученной информации можно определить, в какой мере сайт (если он уже работает) удовлетворяет посетителей.
Разработка прототипа
Для первой серии тестов достаточно сделать прототип интерфейса, без графики и с минимальным количеством текста. Этого достаточно для того, чтобы получить вполне объективные данные с комментариями пользователей. Анализ результатов позволит определить, насколько данный вариант сайта способен решать задачи юзеров. Прототипы делаются на бумаге, в HTML, при помощи MSVisio и т.д.
Подготовка и размещение контента
При подготовке текстовых материалов следует помнить главное — сайт обязан быть полезным и интересным для целевой аудитории. По этому принципу следует отобрать имеющуюся информацию.
При компоновке материала нужно помнить — чтение с экрана отличается от привычного, с бумажных носителей. Попав на сайт, посетитель быстро сканирует содержимое, выхватывая небольшие отрывки, чтобы определить, нужна ли ему эта страница. И двигается при этом слева направо, сверху вниз. Поэтому самый важный материал размещается вверху, ближе к левому полю. Крупных блоков быть не должно, контент разбивается на маленькие абзацы. Следует выбросить все вспомогательные слова, оставить только фразы с конкретной информацией. Очень полезно использование таблиц и списков.
По такому же принципу работают и поисковики — для них то, что в тексте вверху слева, важнее всего остального.
Тестирование
В заключение нужно определить, насколько эффективен разработанный сайт. О проведении тестирования было сказано выше.
Правила юзабилити для отдельных категорий интерфейса
Общая схема задает направление, в котором следует двигаться при создании веб-ресурса. Но на каждом этапе нужно учитывать правила, соблюдение которых позволит сайту стать привлекательным для пользователей, а значит — успешным. Среди многочисленных рекомендаций можно выделить основную: «чем проще — тем лучше». Полезно также использование стандартных приемов — если посетитель видел нечто подобное на других интерфейсах, он уже знает, как этим пользоваться.
Навигация
Навигация, т.е. схема перехода между разделами, должна быть удобной для посетителя, и учитывать индексацию сайта поисковыми машинами. Последовательность страниц, посещаемых человеком (или роботом), называется «навигационной тропой».
Карта сайта
Качественно выполненная карта сайта помогает юзеру быстро найти необходимую информацию. Поисковики, благодаря наличию этого элемента, лучше индексируют сайт. Обязательно следует сгруппировать страницы по темам. Кроме хорошо проработанного дизайна, на карте нужно разместить прямую текстовую ссылку на домашнюю страницу — это важно для поискового робота.
Уровни и директории
Посетители предпочитают сайты, на которых от главной до нужной информации можно добраться за один-два клика. Если для этого приходится открывать много «промежуточных» страниц, то после второй-третьей люди уходят на другой веб-ресурс.
Так же поступают и роботы. Они углубляются лишь на несколько уровней. Если искомая информация «глубоко спрятана», то это отрицательно сказывается на индексации страниц, не зависимо от того, насколько хорошей будет навигационная система.
Text Links (Текстовые ссылки)
Это одно из лучших решений, как с точки зрения юзабилити, так и для SEO. Нечитабельный код мешает поисковику следовать навигационной системе сайта. Наличие дополнительных текстовых ссылок облегчает работу пользователей и «нравится» поисковым машинам.
Anchor text (Ссылочный текст)
Так называются слова в гиперссылке, для перехода на другую страницу или сайт. С позиции SEO это еще одна возможность поставить ключевое слово. С точки зрения юзабилити — дополнительное удобство, так как с предложением перехода сразу сообщается тема.
Breadcrumbs («Хлебные крошки»)
Выражение, заимствованное у братьев Гримм, характеризует систему навигации, при которой человек в любой момент легко определяет где он находится. А на предыдущую страницу может вернуться, не нажимая «Back». Роботам такая схема тоже облегчает передвижение по сайту.
Titles (Заголовки)
Заголовки делаются краткими, конкретными и обязательно соответствующими содержанию текста. Посетитель должен сразу понять, о чем идет речь. Поисковые системы в этом случае быстрее определяют релевантность сайта, сканируя контекст его страниц, и определяя, насколько уместны именно такие заголовки.
Рекомендации
1. Навигация для всех страниц должна быть одинаковой.
2. На каждой странице указывается название сайта и/или логотип. В большинстве случаев название идет со ссылкой на главную. Логотип обычно располагается в левом верхнем углу.
3. Контактная информация (как минимум — телефон) должна быть не только вверху, но и внизу.
4. Меню первого уровня (еще лучше — если и второго) ставится на каждой странице.
5. На страницах обязательно указываются названия разделов
6. Для удобства посетителя, нужно показывать ему, где он находится, выделением текущего раздела в меню.
7. Желательно выделять ссылки на каждой странице одинаково и подчеркивать их, чтобы было хорошо видно, что именно является ссылкой.
4. Меню первого уровня (еще лучше — если и второго) ставится на каждой странице.
5. На страницах обязательно указываются названия разделов
6. Для удобства посетителя, нужно показывать ему, где он находится, выделением текущего раздела в меню.
7. Желательно выделять ссылки на каждой странице одинаково и подчеркивать их, чтобы было хорошо видно, что именно является ссылкой.
Поиск по сайту
Довольно часто, не обращая внимания на систему навигации, посетители для перехода на нужную страницу сразу используют внутренний поиск. В каких случаях веб-ресурс нуждается в подобном элементе? Я. Нильсен предлагает пользоваться правилом: «Если сайт имеет до 100 страниц, поиск не обязателен. От 100 до 1000 — желательно, хотя система выбирается попроще. Свыше 1000 — необходимо, притом система должна быть высокоэффективной».
Рекомендации
1. Лучше всего, если поисковая форма имеется на каждой странице (обычно вверху справа).
2. Длина поля для запроса выбирается в пределах 27 – 30 символов.
3. Система работает только по «своему» сайту, поиск в других ресурсах Интернета не предлагается.
4. Результаты поиска желательно оформлять так, как это делают глобальные поисковики: содержать введенный запрос, краткое описание, заголовок со ссылкой.
5. Рекомендуется проверять орфографию, и, при ошибке в запросе, уточнять фразу («Возможно, Вы хотели написать…?»)
Главная страница
С главной страницы обычно начинается знакомство с сайтом. Поэтому требования к ней предъявляются особенные:
1. На главной должно быть краткое и понятное разъяснение, что собой представляет веб-ресурс и для чего он нужен. Часто для этого используют слоган и приветствие.
2. Главная страница — это сайт в миниатюре. На ней располагается обзор содержимого: коммерческие предложения, заголовки последних статей, сервисы (авторизация, подписка и т.д.).
3. Желательно, чтобы часть информации регулярно обновлялась (новости, корпоративный блог)
4. Большую пользу приносит наличие ссылки/подсказки типа «Откуда начинать». Чем очевиднее способ дальнейшего продвижения по сайту, тем посетителю проще и удобнее перейти к основному содержимому.
Перечисленные выше требования по навигации, поиску и т.д. в полной мере относятся и к главной странице.
Текст
Лучше всего, если тексты короткие, без «ненужных» слов, содержащие только конкретную информацию по теме. При их составлении используется правило «пирамиды»: сначала даются основные выводы, затем приводится их обоснование, после чего тема разворачивается более подробно. Самая важная и полезная часть информации располагается вверху — она должна быть видна без прокрутки.
Шрифты
При чтении пользователь не должен напрягаться. Слишком мелкий шрифт делает процесс неприятным, многие не пожелают даже знакомиться с текстом. Да и поисковики любят покрупнее. То же самое относится к непривычному фону или негармоничным сочетаниям цвета шрифта и фона (красный на синем, оранжевый на темно-зеленом и др.). Мигающие, выскакивающие или прокручивающиеся элементы на поисковые машины не производят никакого «впечатления». А читателям сильно мешают, поэтому лучше обойтись без них.
Заголовки
Рекомендуется делить страницу на разделы, используя теги заголовков в формате HTML-документа (<H1>-<H6>). Это привлекает внимание посетителей, а поисковые системы подобную структуру считают серьезным преимуществом веб-ресурса.
Оформление
1. Минимальный размер шрифта — 12 рх (в MS Word это приблизительно соответствует 10 pt).
2. Подбирая шрифты, лучше ориентироваться не на фиксированный размер, а на относительные величины.
3. Шрифты «без засечек» (Arial, Arial Black, Verdana, Tahoma) на экране читаются легче, чем Times New Roman или Georgia.
4. При использовании шрифтов разного цвета, их должно быть не более четырех.
5. Применение только прописных букв снижает скорость чтения и ухудшает восприятие смысла.
6. Цвета текста и фона должны быть контрастными. Лучший вариант — черные буквы на белом поле.
Дизайн
С точки зрения людей и поисковых машин, оптимальный дизайн должен быть предельно простым и четко структурированным. В этом случае и человеку удобнее бродить по страницам, и поисковики такой сайт посещают охотнее, потому что информация находится легко и быстро. При помощи HTML-кодов дизайнер без проблем изменяет содержание.
Дополнительные теги
Скорее всего, браузеры будут больше ориентированы на стандарты CSS, поэтому тег <font> станет непопулярным, а <b> и <i> будут заменены другими, так что желательно использовать их пореже. При работе с HTML-редактором, при необходимости изменений, могут появиться дополнительные теги. В то же время DreamWeaver и другие редакторы такого типа их группируют, что «нравится» поисковикам. К тому же кодировка становится более четкой, дальнейшие апдейты упрощаются.
Скрипты и CSS
Встроенные ссылки или ссылки JavaScript усложняют работу поисковых систем. Но в секциях <head> и <body> применение такого кода позволяет сделать использование ресурсов сайта при обходе машиной более интенсивным.
Каскадные таблицы стилей или CSS для поисковых ботов очень удобны. В секции <head> CSS иметь не обязательно, достаточно ссылки на внешние файлы CSS-страницы.
Удобства для людей с ограниченными возможностями
Сайт посещает множество людей, и не все из них имеют одинаковые возможности для ознакомления с содержимым. Чем больше категорий населения смогут прочитать контент, чем успешнее окажется веб-ресурс. Что же касается сайтов государственных, общественных или образовательных организаций, то их просто необходимо разрабатывать с учетом потребностей пользователей с ограниченными возможностями.
Рекомендации для повышения доступности сайта
1. Навигация обязана предусматривать вариант управления только клавиатурой, без мыши.
2. В начале каждой страницы должна стоять ссылка на главную так, чтобы это было первым, что произносит диктор на экране.
3. Использование тега label связывает поля формы с подсказками, после чего формы начинают взаимодействовать с дикторами.
4. Дикторы игнорируют изображения, поэтому каждый рисунок должен иметь описание.
5. Если в целевой аудитории есть слабовидящие, то нужно поставить опцию изменения размеров шрифта, несмотря на то, что подобная имеется в браузере.
6. Не все адаптационные технологии хорошо воспринимают javascript, поэтому лучше использовать его минимально.
Статистика сайта
Статистика требуется для того, чтобы иметь возможность проанализировать действия пользователей и сделать выводы о мерах по доработке сайта. Отмечаются часто посещаемые страницы, а также разделы, в которых клиенты испытывают трудности. Определение маршрута движения по сайту показывает, в каких местах люди уходят, что позволяет разобраться, почему. Помогают улучшить навигацию и данные об ошибках.
А если сайт уже работает?
Допустим, с разработкой все понятно. А что делать, если сайт уже работает? На него затрачены средства, он долго создавался, было просмотрено множество вариантов… Все переделать?
Не часто, но бывает и так, что приходится переделывать — настолько плохо отвечает веб-ресурс потребностям посетителей. Хотя обычно бывает достаточно «мелкого ремонта». Главное при этом — обратиться к опытным специалистам. Прежде всего, следует проконсультироваться у профессионала по юзабилити. Затем придется провести исследование eye traking (слежение за движением глаз) и обычное юзабилити-тестирование с привлечением респондентов из целевой аудитории. И необходимо провести независимый аудит сайта или аудит интернет-магазина. В результате появится возможность составить перечень недостатков, после чего можно начинать работу по улучшению сайта.
Создание сайта, дизайн которого удовлетворит и посетителей, и поисковые машины, вполне возможно. Разработано достаточно много специальных приемов, использование которых сделает веб-ресурс «дружелюбным» для поисковиков, простым и удобным для людей. Между юзабилити и эффективным SEO существует тесная связь, направленная на то, чтобы повернуть Интернет лицом к потребителям.
|
Голосов: 16
Баллы рейтинга: 49 |
27.04.2011 15:59