Главная » Статьи и переводы, Юзабилити

Ошибки реализации постраничной навигации на сайте

14 Июнь 2008 просмотров 2 822 комментариев 7


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

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

Это на мой взгляд самый наглядный пример как НЕ надо делать постраничную навигацию.

Давайте разберемся, почему данная реализация – плохая идея.

Спонсор статьи: Как срочно продать квартиру в Москве с предоплатой.
Хотите стать спонсором?

1: Не нужно изобретать велосипед

Уверена, что 99% пользователей Интернета привыкли видеть постраничную навигацию в горизонтальном расположении. Во-первых, это будет уместно, когда страниц много и можно обозначить переход на следующую/предыдущую страницу символами < и >, а переход к началу или концу « и ». Все логично и просто. В случае с данной вертикальной реализацией такая схема не пройдет и придется использовать новые символы, что опять скажется на восприятии их пользователями.

2: Всему свое место

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

3: "Серая мышь и в Африке серая"

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

4: В каждом слове должен быть смысл

Надпись "Показывать на странице по: 12 24 36 " некорректна. "По-русски" это должно звучать примерно так: "Число товаров на странице: 12 24 36". И вопрос "чего по?" не станет возникать. Числовые значения удобнее даже реализовать с помощью выпадающего списка, а не ссылочным перечислением.

5: Повторение – мать учения

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

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

Блогун

Комментариев 7 »

  • ]]>Растениевод пишет: ]]>

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

    Я у себя сделал так – 1запись на 1 странице, то есть чем новее запись, тем глубже она лежит, а вот в анонс, вывожу уже в обратном порядке из базы.

      Цитировать

  • ]]>Niq` пишет: ]]>

    Во-первых, как мы видим, ребята исправились. Случайно ли это? Или критика подействовала?

    Во-вторых, вот тут: http://upa.org.ru/UsabilityBulletin-15.aspx?EntryID=706 тему раскрыли оч. хорошо!

      Цитировать

  • ]]>Автор пишет: ]]>

    разработчики исправили ошибки в тот же вечер насколько я помню. Критика хорошо подействовала

      Цитировать

  • ]]>Блейн пишет: ]]>

    Даже и не докопаешься.

      Цитировать

  • ]]>zabuza пишет: ]]>

    Интересная статья, побольше бы таких.

      Цитировать

Комментарии

Добавьте ваш комментарий, или трекбэк с сайта. Вы также можете подписаться на комментарии к этой статье через RSS.

Вы можете использовать теги:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Чтобы получить аватарку, зарегистрируйтесь на Gravatar.