Основы юзабилити сайта главной страницы или как не растерять читателей

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

Приветствую всех! С вами Екатерина Калмыкова и сегодня я продолжу тему про юзабилити и расскажу вам про юзабилити главной страницы. Что такое юзабилити и почему оно так важно для сайта вы можете прочитать в этой статье.

Кратко смысл данного понятия изображен на слайде:

юзабилити

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

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

Поэтому сегодня мы разберем основы юзабилити сайта и начнем с главной страницы.

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

На главной странице должна быть следующая информация, отвечающая 5 главным вопросам посетителя:

1. Куда я попал? Что это за сайт?

Для этого нужно разместить следующую информацию:

— название и логотип организации/ресурса;

Статьи в тему:

Что такое логотип и как создать его самому

Программа для разработки логотипа Logaster — быстро, просто, недорого

слоган организации/ресурса;

— описание деятельности организации/ресурса.

шапка блога

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

Посмотрите, как размещено у нас на blog-bridge.ru:

(1) — логотип

(2) — название

(3) — описание

Все понятно и находится на видном месте.

2.Что предлагает сайт? Где и как найти нужную мне информацию?

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

Если вы делаете выпадающее меню, то опять же главное — не перестарайтесь и не перегрузите его дополнительными вкладками. Все должно быть «четко и по делу».

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

меню

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

3. Чем мне может помочь сайт? Каким образом это сделать?

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

4. Можно ли верить этой организации/сайту?

— размещаем отзывы покупателей;

— в зависимости от сферы деятельности организации можно представить портфолио;

— если есть в наличии можно выложить на ознакомление посетителю сертификаты, свидетельства или грамоты организации;

— для блога очень эффективным будет демонстрация его наград;

— часто обновляемая лента новостей и статей, публикуемых на ресурсе.

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

5. Куда и к кому обращаться, если у меня возник вопрос?

— размещаем простую форму обратной связи;

— указываем в шапке на видном месте контакты (телефоны);

— хорошо, если есть онлайн чат или онлайн консультант.

Рекомендации по улучшению юзабилити на главной странице

юзабилити

  1. Подойти «с умом» и осторожностью к созданию выпадающего меню, так как такой вариант оформления может скрыть нужные подразделы от взгляда посетителя. Как вариант можно воспользоваться дополнительным меню.
  2. Названия разделов должны быть написаны простым языком, понятным читателю. Избегайте заумных фраз или жаргонизмов.
  3. Осторожнее со знаками препинания. Не злоупотребляйте восклицательными знаками, не используйте знаки препинания в заголовках статей.
  4. Следите за использованием прописных и строчных букв.
  5. Обратите внимание на ссылки. Цвета просмотренных ссылок должны различаться для удобства работы с ними. Используйте ссылки с анкором, не употребляя само слово «ссылка».
  6. Продумайте простую и удобную навигацию по ресурсу. Лучше не употреблять придуманные слова-навигаторы. Элементы навигации должны быть понятны всем пользователям ресурса.
  7. Расположите на главной странице форму поиска на блоге.
  8. Старайтесь с осторожностью использовать анимированные виджеты или заставки к сайту. Лучше приводить их в работу по желанию посетителя, а не вопреки его воле.
  9. На многих блогах на главной странице авторы располагают миниатюры статей. Этот способ позволяет сразу показать последние, например, пять записей на блоге.
  10. Не делайте на своем ресурсе промежуточные страницы. Если посетитель набирает в поисковой строке URL главной страницы, то оказаться он должен именно на ней. А не на эффектной, но бесполезной странице-заставке.
  11. Используйте с осторожностью раскрывающиеся или всплывающие окна. Данные механизмы могут вызвать раздражение у пользователя и они закроют и мешающее им окно, и главную страницу.
  12. Размещайте грамотно рекламные блоки. Реклама не должна отвлекать внимание аудитории, не должна отвлекать от нужной информации, размещенной на главной странице.
  13. Предупреждайте посетителя о технических работах, ведущихся на сайте. Располагайте данное объявление на главной странице.
  14. Проведите склейку зеркал, для того чтобы ваша главная страница отвечала и на адрес с www и без.
  15. В результате исследования было выявлено, что большинство посетителей просматривают по направлениям буквы F и E. Учтите это при расположении информационных блоков на своем проекте.

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

Удачи вам и до скорых встреч!

А вы придерживались основ юзабилити при проектировании своего блога?

С уважением, Екатерина Калмыкова

Поделись с друзьями:

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

  1. Алевтина

    Катюша, прочитала сейчас твою статью об юзабилити, все очень правильно написано. Нашла даже один косячок у себя и не маленький, спасибо! *LOL*

    Ответить
    1. Екатерина Калмыкова

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

      Ответить
  2. Ирина Лукшиц

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

    Ответить
    1. Екатерина Калмыкова

      Я тоже так считаю, что на блоге лицо автора должно быть открытым. Правильно вы, Ирина, пишите. Раз смелости хватило завести блог, то и показать себя надо. Многие читатели запоминают именно автора, а потом уже его блог.

      Ответить
  3. 7ya

    Ваши рекомендации прям то, что надо. Статью в закладки однозначно

    Ответить
    1. Екатерина Калмыкова

      Пользуйтесь на здоровье ))

      Ответить
  4. Сергей

    Все так правильно, но так скучно — как будто по одному шаблону все сайты в интернете) А где же изюминка и творчество? Где то, что должно цеплять?

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

    >>>большинство посетителей просматривают по направлениям буквы F и E

    А вот это интересная информация. *смайлик большой палец вверх*

    Ответить

Оставить комментарий

=) 8) :( ;( ;) :P :-D =-O :-! *IN LOVE* %) *CRAZY* *LOL* ]:-> *MACHO* *EEK*