5 галочек: чеклист юзабилити

    Мы выделили 5 основных пунктов, по которым можно определить юзабилити сайта. Список спорный и в основном касается продающих сайтов. И да, эти пять пунктов — среднее арифметическое опыта, полученного при обработке заявок на конкурс «Юзабельный вебпроект». Думаете, мы раздали слонов и забыли?


    оригинал картинки

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

    Ошибки, само собой, повторялись. Голова пухла, а мы продолжали писать одинаковые комменты. Результатом марафона стал ниже приведенный чеклист.

    Сразу оговоримся, что мы не оцениваем юзабилити в вакууме, нам важно, чтобы сайт работал, т.е. «продавал». Товары, услуги, идеи — не важно. Речь может идти о бесплатном веб-сервисе, для которого транзакцией станет регистрация посетителя.

    Первый контакт


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

    Я открываю сайт и вижу размытое пятно.

    Нет, я не вижу интересных новостей, не вижу самые популярные товары, не вижу вашего телефона и не вижу всех разделов каталога.

    Почему?

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

    Главное меню


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

    Горизонтальное или вертикальное?
    • Если в меню мало пунктов, его можно сделать горизонтальным, если больше 5 — делайте вертикальным.
    • Если меню представляет собой список (например, список услуг), делайте его вертикальным.
    • Если сомневаетесь, делайте меню вертикальным.

    Разделы
    • Названия должны быть однозначными. Пользователь должен понять, что находится в разделе до того, как туда пойдет, а не после.
    • Если в меню больше 9 пунктов, упрощайте его. Объединяйте пункты под заголовками или помещайте в подменю.

    Подменю и подразделы
    • Хорошо, когда подменю раскрываются по клику, а не при наведении.
    • Подразделы должны быть видны всегда, когда я нахожусь в «материнском» разделе.
    • В подменю должно быть только то, что однозначно относится к этому разделу. Лучше сделать отдельный раздел, чем добавлять подпункт «до кучи».
    • Используйте «хлебные крошки».

    Дублирование информации


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

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

    Во-вторых, я впустую трачу время, чтобы осознать, что текст дублированный. Думаете, «это всего пара секунд»? В интернете счет на них и идет. Лишняя секунда — напрягает.

    Из правила есть исключения.
    • Хлебные крошки. Дублируют ссылки в меню по определению.
    • Контактная информация. Если требуемая транзакция предполагает телефонный звонок, значит телефон должен быть на каждой странице.
    • Атрибуты контента. Например, параметры товара должны быть указаны и в каталоге (кратко), и на странице товара (полностью).
    • Ключевые слова. В рамках текстов могут повторяться. Но сами тексты не должны дублироваться по смыслу.
    • В гипермаркетах без определенной направленности «сумки для ноутбуков» могут попасть одновременно в раздел «Ноутбуки» и «Сумки».
    • Актуальное дублирование. Иногда одна и та же информация одинаково актуальна в нескольких местах: телефонный номер на страницах, посвященных разным услугам одной организации, инструкция по установке программы на странице для скачивания и на странице справки, и т.д. Как правило, она не занимает много места.

    Привлечение внимания


    А вдруг посетитель сайта не увидит информацию в одном месте — давайте просто разместим ее в нескольких одновременно?

    Правда в том, что каждый элемент должен иметь свое, единственно возможное место. Когда он необходим, его очень просто найти.

    Выделять элементы следует логически и графически.
    1. Каждый элемент должен находиться там, где я, скорее всего, буду его искать. Сначала подумайте, какие вопросы задает клиент, когда приходит на сайт: «А они доставят товар в мой город?», «Где я могу найти стиральную машину с вертикальной подачей?» и т.д. А затем выстраивайте иерархию согласно этой логике, объединяя общее и выделяя частное.
    2. Элемент должен быть заметен сам по себе. Только не надо больших красных букв, всплывающих подсказок и громоздких блоков. Просто отделите элементы друг от друга, а активные элементы сделайте похожими на активные (кнопки, вкладки, пункты меню, ссылки).

    Нестандартный дизайн


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

    Нестандартный дизайн зачастую не имеет ничего общего с юзабилити. Красиво, но нефункционально.

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

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

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

    Транзакционные элементы


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

    Зачастую контактная информация скромно указана в подвале или на отдельной странице «Контакты», ссылка на которую есть только в нижнем меню. Иначе говоря, в мертвой зоне. Какого черта? Все ведь затевалось исключительно для того, чтобы посетитель мог позвонить, поговорить с любезным (дай бог) консультантом и сделать, наконец, покупку.

    Так почему бы не разместить контакты на каждой странице и на видном месте, например, в шапке или хотя бы на первом экране?

    То же относится к другим транзакционным элементам: кнопкам «Добавить объявление» или «Регистрация» и т.п.

    Главная страница


    Предположим, мы все сделали правильно, и теперь готовы заполнить главную страницу. Что на ней должно быть?

    Чем меньше — тем лучше. Если посетитель увидит понятное меню и удобные навигационные элементы, он сам найдет то, что нужно. Может, ему хватит и телефонного номера.

    Главная страница должна отвечать на вопрос «О чем этот сайт?» Если это неочевидно (а чаще всего это так), на главной должны быть пояснения. Максимально конкретные.

    Я захожу на сайт и думаю:
    • «Да, я вижу, что это интернет-магазин, но что он продает?»
    • «Да, я понял, что это сайт про мишек Тедди, но что это: интернет-магазин, сайт производителя, клуб любителей?»
    • «Да, я понял, что это новостная лента, но какова тематика?»
    • «Стоматологическая клиника. Она хотя бы в моем городе?»
    • «Ага, это что-то про интернет. Блин, да я и так в интернете! Вроде бы, это не Хабр, что нового я тут найду?!»

    Описание сайта в одно-два предложения можно и нужно поместить под логотипом. Например, такое: «Интернет-магазин эксклюзивного кошачьего корма. Доставка в Екатеринбурге и по всей России».

    Итак, в шапке — логотип, пояснение, контакты. Где-то рядом — главное меню. А оставшееся место чем забить?

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

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

    Конечно, в таких вещах надо сдерживаться. А если все таки случилась простыня, следует отделить ее от ключевого контента.

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

    Резюме


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

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

    Вы можете с нами не согласиться, но мы считаем, что если у вас пять галочек — у вашего сайта хорошее юзабилити.
    Webprojects 32,41
    Компания
    Поделиться публикацией
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама
    Комментарии 102
    • +8
      Отличная статья!
      • +9
        отличный карма-коммент!
        • –11
          отличный антикармакоммент
          • +1
            и действительно!
          • +4
            жополизные коменты, вперёд!
        • +4
          Вроде бы обычные мелочи для думающего дизайнера/разработчика, но все равно очень грамотно расписано.
          Спасибо за статью.
          • 0
            отличная статья — спасибо
            • +3
              а можно увидеть список сайтов, которые вы смотрели?
            • +1
              Прочитал с удовольствием, как раз под открытие нового интернет-магазина :)
              • +1
                Интернет-магазин юзабельный?:)
              • +1
                А как ответить на эти вопросы? У самого, понятное дело, мнение предвзятое… И идеале, нужен кто-то у кого на подобные штуки глаз наметан… Но где же его взять/как им стать?
                Ну или посадить за компьютер несколько «сферических юзеров» и попробовать понять на каком этапе у них трудности.
                В общем, лично я не могу ответить на эти вопросы объективно… может их как-то можно конкретизировать (или разбить на более мелкие)?
                • 0
                  Не собираюсь здесь рекламировать наши услуги, но множество компаний предоставляет аудит юзабилити и юзабилити-тестирование. В первом случае сайт как раз оценивают те, у кого наметан глаз. Во втором — несколько сферических юзеров.

                  В резюме вопросы обобщены, в самой статье каждый вопрос рассматривается подробнее вплоть до конкретных рекомендаций, сколько должно быть пунктов в меню.
                • +1
                  Самое главное, что вы забыли:
                  По этому чеклисту должен проходить не дизайнер, а кто-то другой — программист, секретарша, бухгалтер, человек из коридора, любимая девушка. Мнение должно быть непредвзятым и незамыленным.
                  • +1
                    Я в статье постарался отразить основные моменты, в которых дизайнер может проконтролировать себя сам. Этот список также предназначен владельцам сайтов, которые принимают работу у дизайнера.

                    Если же речь идет об экспертной оценке, тот тут нужно проводить юзабилити-тестирование, в рамках которого список вопросов сильно расширяется.
                    • +1
                      Использовать экспертную оценку — это все равно что использовать тяжелую артиллерию — мощно и дорого.
                      А для многих и не требуется стрелять из пушки по воробьям — «коридорного теста» будет за глаза
                      • 0
                        Я думаю, можно даже сказать, что коридорный тест — обязательная процедура.

                        Но есть нюансы. С одной стороны, если сайт не проходит коридорный тест, значит все совсем плохо. Т.е. он затрагивает фундаментальные вещи. С другой стороны, если сайт прошел коридорный тест, ему все равно необходим аудит по показателям, которые человеку из коридора неизвестны (тестирование в разных браузерах или наличие robots.txt, грамотно прописанные тайтлы и т.п.).
                        • 0
                          Наоборот, экспертная оценка, это легкий путь (быстро-дешево), по сравнению с пользовательским тестированием — долго и дорого искать нужных респондентов, исследователи и оборудование дороги, долго ставить задачу, тестировать, обрабатывать результаты. «коридорный тест» не валиден, т.к _мотив_ использования ОЧЕНЬ сильно влияет на результаты, и в случае «случайных» респондентов мы не получаем реальную картину использования сайта. Но, действительно, «для многих и не требуется».
                      • +1
                        Тоже верно.
                        Как вариант — сначала дизайнер (так как он дизайнер), потом все остальные.
                        • 0
                          Тут возможен обратный эффект — секретарша почувствует себя в главной роли и начнет усилено настаивать на какой-нибудь ей одной ведомой мелочи (хорошо если в самом деле полезной). И попробуйте потом открутиться.
                          • 0
                            Тут нужно именно человека из коридора, которому это все безразлично, и который спустя полминуты побежит дальше по своим делам.
                        • +1
                          Конечно для тех кто этим постоянно занимается в принципе ничего нового в статье нет, и тем не менее изложено все доходчиво, ясно и понятно, за что отдельное спасибо!
                          • +1
                            Нам пришло 166 заявок на конкурс юзабилити. Оказалось, для многих такие вещи в новинку:)

                            Можно было бы, конечно, дать ссылку на книгу Стивена Круга или Якоба Нильсена, но мы постарались обрисовать основные ошибки и сделать простой чеклист для владельцев сайтов и начинающих дизайнеров.
                            • +1
                              И про контакты верно, часто бывает их почему-то наоборот прячут в подвал, или скрывают в тексте, или вообще дают только в разделе «Контакты», хотя нужно бы наоборот светить где можно.
                              В общем для новыичка лист самое то :)
                          • +2
                            Мое скромное представление о юзабилити расположило бы чеклист в начале статьи. Далее объяснения по пунктам.

                            Но это лично мое мнение, я сисадмин, и претендую на мнение юзабильности вашей статьи только с точки зрения рядового пользователя. Прислушиваться к моему мнению и переставлять чеклист в начало не обязательно.
                            • 0
                              С одной стороны, не могу не согласиться. С другой стороны, хочется, чтобы читатель не останавливался на прочтении пяти пунктов, написанных достаточно общо, а вник в суть.
                              • +1
                                Что бы читатель не остановился есть такое понятие как краткость. Кратко, четко и интересно. Если содержание сайта не будет соответствовать этим понятиям, то от того где вы расположите меню продажи не случится.
                                • 0
                                  По больному бьете. И даже не могу возразить, что это не сайт, который что-то продает. Статья ведь продает идею.
                                  • 0
                                    Я больше не буду…
                                    • 0
                                      Идея должна помещаться на обратной стороне визитной карточки ;)
                                      • 0
                                        Сайт должен нравиться и продавать услуги, товары и идеи — только не вам, а вашему клиенту.
                              • +1
                                многое применимо и для соц.пректа
                                спс.
                                • 0
                                  В смысле для сайта соц. проекта? Конечно, это не только для интернет-магазинов. Мы рассматривали самые разные сайты, и это среднее арифметическое наших рекомендаций.
                                  • 0
                                    eye tracker не приходилось использовать?
                                    на мой взгляд один из самых лучших инструментов отслеживания «дружественности» интерфейса сайтов.
                                    • 0
                                      Согласен.

                                      Кстати тут есть нюанс. Поскольку человек не может не смотреть, он будет смотреть. Т.е. при помощи айтрекера мы не можем получить абсолютной информации об эффективности, только относительную (этот элемент заметнее, чем этот).
                                • +1
                                  Небольшой процент новой информации, Америк не открыто, но все хорошо и структурировано. Отличная статья. Вам бы учебники писать.
                                  • 0
                                    Спасибо:)
                                    • 0
                                      повторенье — мать ученье.
                                      Мы многое занем. но… забываем.
                                      Такие статьи хороши — помогают «освежить» память
                                    • 0
                                      Интересно, какой, на ваш взгляд, движок интернет магазинов наиболее близок к описанному в статье идеалу интернет-магазина? Престашоп, ОС коммерс, другие?
                                      Понятно, что многое зависит от шаблона, но тем не менее, если брать типовые шаблоны? Или от движка тут мало что зависит?
                                      • 0
                                        Посмотрел магазины, работающие на prestashop — они разные. Во многих превалируют горизонтальные меню, что мне не нравится. Но, вот, скажем, есть headict.com, который на первый взгляд вполне удобен. У oscommerse та же история. Дизайн отличается кардинально, но, вроде бы, все по умолчанию попроще.

                                        Тут лучше переадресовать вопрос специалистам по разработке интернет-магазинов.

                                        Свести юзабилити к нулю можно используя любой движок. Работает ли обратное правило, утверждать не берусь.
                                      • +4
                                        «у меня одно-два меню, они понятные и логичные» — «да, все поймут, 100%!»
                                        «информация дублируется, только когда это необходимо» — «вообще не дублируется, 100%!»
                                        «дизайн привычный и понятный с первого взгляда» — «конечно, 100%!»
                                        «контакты и другие транзакционные элементы на видном месте» — «да, я вижу телефон, 100%!»
                                        о чем сайт, понятно по главной; его нельзя перепутать с сайтом смежной тематики — «очевидно же, 100%!»

                                        Ответы на эти вопросы вообще не дают никакого представления об эффективности использования сайта. Сознательно избегаю слова «юзабилити».

                                        Самый лучший чек-лист — это список задач (сценариев) использования сайта, по которым прогоняются N целевых пользователей. По результатам получаются понятные метрики (задача решена\не решена, на каком этапе проблемы, время решения). С этими метриками можно предметно работать над улучшением дизайна.
                                        • 0
                                          тоже хороший интересный подход. Однако, по нашему мнению, чек листа по юзабилити это не отменяет. Написать статью про юзабилити — это реально, и она поможет.

                                          Прогонять потенциальных клиентов по сайту и составлять сценарии — да, предложение интересное, но тут мы помочь ничем не можем. Если у вас есть опыт на эту тему, напишите статью на Хабре, она многим будет полезна, в том числе и нам.
                                          • 0
                                            Метод вопросов (из которых можно вывести нужные сценарии) — это вообще наилучший вариант работы.

                                            Чеклист у нас получился менее информативен, чем сама статья, это правда.
                                            • +1
                                              Статья-топик ни о чем. Все исходит от бизнеса, если мы говорим о продающем сайте.

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

                                              Если открыть ибэй, да и даже тот же яндекс, то глаза разбегаются. Или много споров о том что фейс бук не удобный после премитивного вконтакта. Но… они успешны и если бы они воспользовались этими советами…
                                              • +1
                                                продажи есть и именно из-за того что нарушены эти выдуманные правила.


                                                Чтобы делать такой вывод, нужен сравнительный анализ.

                                                Знаете, я открываю ebay, и вижу два основных меню и по минимуму информационных блоков.

                                                Яндекс — это очень удобный пример, чтобы сказать что правила не работают. Впрочем, Яндекс недавно менял дизайн, и не всем это понравилось.

                                                Facebook имеет одно основное меню, и остальные правила также не нарушаются.
                                            • +1
                                              Всем кого интересует вопрос эффективности сайтов очень рекомендую книгу Томаса Пауэлла «Веб-дизайн»
                                              Впервые я прочел все изложенное в топике именно в ней
                                              Автору статьи спасибо за то что освежил мои знания в этой области
                                              • 0
                                                слишком длинный конспект Стива Круга. напрягает (Ц)ТС

                                                и почему не в блоге «юзабилити»?
                                                • 0
                                                  Мы приняли 166 заявок на конкурс юзабилити. Большинство из них, скорее всего, не знакомо со Стивом Кругом:) Мы постарались обобщить наиболее частые ошибки и дать рекомендации к ним.

                                                  Это был пост, выстраданный в процессе обработки заявок на этот самый конкурс, поэтому в нашем блоге. Вы не поверите, через что я прошел:)
                                                  • 0
                                                    Круг умолял не заставлять людей думать, а тут предпологается что посетители очень умные и два одинаковых пункта меню в разных местах взорвут им мозг.

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

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

                                                      Сайт должен быть удобен для всех.

                                                      Древний дизайн, может, и не помешает, но скажется на имидже.

                                                      Вы говорите, что два одинаковых пункта меню в разных местах не должны взрывать мозг тем, кто не хочет думать. Но по вашей же логике пользователю приходится искать то, что ему нужно. Так вот разросшиеся за счет дублированных разделов меню — мешают поиску. Пользователю зачастую нужно посмотреть на каждый пункт меню, чтобы понять, что искать нужно не в нем. (Контакты, как правило, действительно найти просто, но что если он ищет определенную услугу или товар?)
                                                  • 0
                                                    А почему вы используете слово юзабилити, а не удобство?

                                                    «Мам, я нашёл интересный сайт про вязание, он такой юзабельный-преюзабельный, тебе понравится». )
                                                    • +1
                                                      Потому что это устоявшийся термин. На Хабре даже блог есть одноименный, и вроде бы пока переименовывать его в «Удобство» не собираются:)
                                                      • +1
                                                        Только сейчас задумался… а ведь usabilty = use + ability => не просто «удобство», а "возможность пользоваться".
                                                      • 0
                                                        «Предположим, мы все сделали правильно, и теперь готовы заполнить главную страницу. Что на ней должно быть?»

                                                        Кажется уже всё не правильно, т.к. сначала должен быть материал, а потом оболочка.
                                                        • 0
                                                          Собственно, об этом в предложении и говорится. Сначала материал (структура сайта), а потом оболочка (структура главной).
                                                          • 0
                                                            Для меня материалом всегда были тексты, картинки, формы и графики, а оболочкой менюшки и прочие элементы управления и навигации.
                                                            • 0
                                                              Так вот мысль в том, что если вы сначала вывалите на главную все эти тексты, картинки, формы и графики, то получится бардак. Сначала нужно продумать структуру сайта, основанную на юзабилити и потребностях пользователя. А потом уже выводить на главную элементы, которые будут востребованы на главной.

                                                              Мне кажется, мы тут больше о терминах спорим, чем о сути.
                                                              • +1
                                                                Вам верно кажется, но тем не менее расскажу один печальный случай из своей работы. Приходит клиент и просит сначала нарисовать ему дизайн страниц сайта, а материал он подготовит чуть позже. Тут мы очень сильно сглупили, потому что согласились. Согласовали структура сайта (главная, услуги, проекты и прочие). Сделали дизайн, согласовали, сверстали, запрограммировали, пора уже наполнять и тут началось. Клиент уже пол года готовит материалы, сайт наполнен на 3/4 и именно из-за этой 1/4 хромает конверсия.

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

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

                                                                  Процитированной вами фразой — «Предположим, мы все сделали правильно, и теперь готовы заполнить главную страницу. Что на ней должно быть?» — мы ни в коем случае не хотели сказать, что нужно делать сайт без оглядки на контент. Смысл фразы в том, что главную нужно заполнять после того, как заполнено все остальное. То бишь все остальное должно быть заполнено контентом.
                                                                  • 0
                                                                    Ок, вероятно я с первого раза не уловил суть этой фразы. Сейчас вопрос нет.
                                                        • 0
                                                          Довольно много спорного.

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

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

                                                          Привычный дизайн? Для привычных проектов. Ya.ru или главная страница гугла в гробу видели типовой дизайн.

                                                          Последние два пункта менее спорные — связь действительно стоит упростить, если уж она есть, это пожалуй почти всегда так. А о чём сайт — человеку знать иногда полезно, но в общем не обязательно: он должен понимать, что будет на этом сайте делать, это и необходимое, и достаточное условие успешного взаимодействия.
                                                          • –1
                                                            По поводу меню у нас указано, что если в нем больше 9 пунктов, его нужно упрощать или делить на подменю. Мы сразу оговорились, что список спорный, а в любом правиле есть исключения.

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

                                                            Для поисковиков ya.ru и google.com обладают вполне привычным дизайном. Любой дизайн рассматривается не в вакууме, а в контексте сайтов смежной тематики.

                                                            О чем и что делать в данном случае вещи пересекающиеся (см. примеры мыслей при заходе на сайт).
                                                            • –6
                                                              Исключение проверяет правило. 9 пунктов — это скажем так, тоже дурацкое правило. Если у нас есть выбор из 10, ну а хоть бы и 15 производителей оборудования, ничего не может быть более глупым, чем бить список на два меню. То же — с городами, разбивкой по весу или делением по предметам одежды. Если у нас есть однотипный список — придётся делать его монолитным, хоть убейся, иначе пользователь рехнётся отыскивать разнесённые по нескольким меню элементы одного списка.

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

                                                              YA.RU обладает привычным дизайном, как и гугл? Да что Вы таки говорите, я-то думал, что оба были первые в своём роде.

                                                              О чём сайт, и что мне на нём делать — безусловно пересекающиеся понятия. Например, поняв о чём сайт, часто можно сообразить, что на нём делать. Но пересекающиеся — не значит идентичные. Если Вам надо продать товар — не обязательно выглядеть как типичный инет магазин. Достаточно показать товар и форму заказа.
                                                              • 0
                                                                В случае с городами или производителями я считаю имеет смысл использовать фильтры (если речь идет о магазине). Чекбоксы можно разместить в несколько столбцов, а меню — нет.

                                                                Если новости неинтересны, зачем они на сайте? Пишите новости интересно, делайте интересные заголовки. В конце концов, назовите этот раздел «Блог», а не «Новости». Вообще в сайдбаре можно больше, чем на самой странице. Там можно поместить баннер со ссылкой на интересный материал или важную страницу, там можно выводить ленту сообщений из твиттера и т.д. Главное не переборщить.

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

                                                                Иногда показать товар и форму заказа недостаточно. А что если доставка работает только в Екатеринбурге? А что если это не магазин, а каталог производителя? Очень часто могут быть разночтения, и их нужно пресекать, поясняя максимально конкретно, в чем суть сайта в шапке или где-то еще на видном месте. (См. примеры недоразумений в статье).
                                                                • 0
                                                                  Фильтр — тоже тип меню.

                                                                  Новости сделать интересными, если их не читают? Взаимоисключающе.

                                                                  На счёт поисковиков — таки отдельно гугл, а отдельно я ру. Их не двое, а два совершенно разных по интерфейсу примера. Яндекс кстати тоже отдельно, и тоже с нестандартным интерфейсом — пользователи привыкают, а потом глядишь — и это уже стандарт, которому Вы зовёте следовать.

                                                                  Если доставка работает только в Екатеринбурге, прочие пояснения — это не часть навигации сайта, а часть описания, связанного с формой заказа. Так что — надо показать именно товар и форму заказа.
                                                                  • 0
                                                                    Вопрос терминологии. В тексте под меню понимается меню с кнопками/вкладками, а не список чекбоксов с кнопкой выбора.

                                                                    Новости не читают потому, что они неинтересные, или потому что они новости? Если первое, нужно сделать их интересными. Если второе, переименуйте раздел в «Блог».

                                                                    У поисковиков стандарты отличаются от интернет-магазинов. Интернет-магазину брать пример с Яндекса в плане дизайна, не стоит. Не понимаю, что вы хотите тут доказать?

                                                                    Да, это не часть навигации, так мы и не про навигацию говорим, а про юзабилити в целом. Форму заказа я увижу только когда выберу товар. Я должен знать, что доставка работает в моем регионе как только я зашел на сайт.
                                                                    • 0
                                                                      Новости не читают, потому что это материалы компании. Пользователь же привык к тому, что компании обожают важные только лишь лично для них материалы в рубриках «о нас», «наша история», «новости» или «блог».

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

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

                                                                        Верно. Бездумно вообще ничего делать не стоит.

                                                                        Пользователь увидит форму заказа первой, если он пришел по запросу с указанием названия товара. А если он пришел по запросу «бытовая техника»? Сценариев поведения пользователя множество. Я сейчас рассматриваю вариант, когда он начал с главной.
                                                                        • 0
                                                                          Новости рынка ещё меньше трогают пользователя. Он купить товар пришёл. Вполне возможно, что уйдёт купив оный и не прочитав новостей — тоже неплохо. Тут важно соблюсти баланс между информационной подготовкой и конверсией.

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

                                                                            Еще раз, магазины бывают разные, запросы, по которым пользователь пришел — тоже. Если пользователь возвращается в магазин, или после первой покупки решил еще по нему побродить, ему в любом случае понадобится «оглавление книжки», и это не карта сайта, а главная. Бездумно отрицать стандарты — то же самое, что бездумно им следовать. Вопрос в том, что нужно пользователю.
                                                                            • 0
                                                                              Всегда есть другой способ заинтересовать пользователя. Но возможно, мы его не найдём ни сегодня, ни завтра, а решение требуется сегодня, и что радостно — оно уже есть. Оно не нравится только потому, что в принципе не нравится дублирование?

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

                                                                              А пользователю, ему вообще сайт не нужен. Ему нужно то, что он с помощью сайта сделает. Предоставляем не дрели, а отверстия, понимаете?
                                                                              • 0
                                                                                Нет ничего более постоянного, чем временное.

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

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

                                                                                  Меню могут присутствовать там, где хочется, цимес моей речи не в том. Цимес в том, что конверсия варианта «чувак, мы продадим тебе дрель, быстро и дёшево!» — выше, чем варианта «чувак, мы тут инструментами торгуем».

                                                                                  Пользователь — он набрал «дрель Дыродел 300», только это не значит, что он ищет эту дрель. Он отверстие ищет. Если сказать ему, что добавив всего 200 пробок от нюка-колы он может взять перфоратор, который по всем параметрам круче и значится сегодня в спецпредложениях — он запросто может выбрать именно его — причём не в выборе между дрелью и перфораторами, а в выборе между десятком магазинов, лишь в одном из которых ему предложили альтернативу, что важнее.
                                                                                  • 0
                                                                                    Если делать «как-нибудь», то в долгосрочной перспективе и успех будет «как-нибудь».

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

                                                                                    Один пользователь набрал «дрель Дыродел 300», другой «инструменты», третий еще что-то, все пришли на разные страницы. Страница должна отвечать запросу. Это не отменяет того факта, что по сайту должно быть понятно, что на нем можно делать. Чувак, который купил Дыродел 300, быть может, хочет купить лампочку еще.

                                                                                    Спецпредложения на каждой странице — это замечательно, с этим никто не спорит.
                                                                        • 0
                                                                          всегда очень много «гениев», которые говорят: не надо делать как все. Если мы будем делать как все, то мы ничего не добьемся.

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

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

                                                                          • 0
                                                                            Почему если человек работает не только с единственным типовым магазином, то он непременно витает в иных реалиях? Я описываю как раз иное: если у Вас есть типовая задача, например «делаю магазин посуды», то есть типовое решение — типовой движок и типовой готовый шаблон для него. Скорее всего для продаж останется заменить шапку — и у Вас есть абсолютно рабочий и понятный пользователю магазин. Можете похлопать в ладоши и заняться торговлей (я так некогда и делал — продажи были хорошие). Ну или предложить дизайнеру перерисовать типовую сетку, дабы радовала глаз — я делал и так, и тоже продавал.

                                                                            Но вот эти типовые магазины-блоги-сайтики со статьями — им не нужны юзабилити чеки. Они типовые. Либо соответствуют стандартным сеткам, либо нет, если нет — вопрос, ради чего изобретается велосипед?

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

                                                                            А рейтинг, он мерило того, сколько людей делает типовые сайты. Их много? Вообще-то, да, много, иначе бы они не были типовыми.
                                                                            • 0
                                                                              Вы удивитесь, но на 166 заявок, из которых было очень много магазинов-блогов-сайтиков со статьями, было крайне мало «типовых» сайтов с хорошим юзабилити.

                                                                              В конце концов, поделитесь ссылкой на нетиповой сайт, может быть, даже ваш.
                                                                              • 0
                                                                                Хороший нетиповой дизайн быстро становится типовым.
                                                                                • 0
                                                                                  Вы сказали, что чек юзабилити нужен нетиповому проекту. Вы можете привести пример, или нет?
                                                                                  • 0
                                                                                    А это наглость, учитывая, сколько примеров я уже привёл. К Вашим услугам там масса сайтов.
                                                                                    • 0
                                                                                      Я.ру и Гугл не в счет. Бинбэг? Обычный интернет-магазин, страдающий «оригинальным» дизайном.
                                                                                • 0
                                                                                  Так, предыдущее сообщение отправил по ошибке нажав ctrl-enter — вот что с людьми стандарты делают, в скайпе так, тут наоборот.

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

                                                                                  Свои сайты я пожалуй светить не буду, слишком специфические, и слишком быстро мы можем уткнуться в писькомеряние, но из недавно просмотренного весьма понравился habreffect.ru/
                                                                                  • 0
                                                                                    Присылали. Присылали сайты, работающие на livestreet, на wordpress, почти ко всем были замечания по юзабилити.

                                                                                    Зашел на хабраэффект.ру. О чем сайт, и какую картинку нужно загружать — не понял.

                                                                                    Протестируем чеклист.
                                                                                    — меню есть, но оно замусорено рекламой,
                                                                                    + информация не дублируется, тут все четко и приятно-минималистично,
                                                                                    ± дизайн привычный для фотохостинга, но непонятный в силу последнего пункта,
                                                                                    + транзакционный элемент (загрузка картинки) на видном месте,
                                                                                    — о чем сайт, непонятно.
                                                                                    • –1
                                                                                      Вот. Допустим, меню будет очищено от рекламы и перемещено на видное место, это улучшит взаимодействие с сайтом?
                                                                                      • +1
                                                                                        Начем с того, что о чем сайт — непонятно.

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

                                                                                        Конечно, поскольку основная аудитория сайта — это люди с Хабра, эти меры необязательные.

                                                                                        Однако, если ресурс рассчитывает получить известность за пределами Хабра, стоит об этом подумать.

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

                                                                                        Меню от рекламы да, имеет смысл отделить.

                                                                                        Как видите, чеклист в данном случае работает.
                                                              • –5
                                                                >Я открываю сайт и вижу размытое пятно.

                                                                www.webprojects.ru/

                                                                Ну в принципе так оно и есть :)

                                                                Если не сложно, дайте пожалуйста ссылки на работы Webprojects, которые могли бы служить примером идеального юзабилити с вашей точки зрения. Я посмотрел раздел Портфолио, к сожалению, пролистав несколько страниц, не нашел в описании «Перечень работ» упоминание про разработку юзабилити.
                                                                • 0
                                                                  Есть такая поговорка: орнитологи не летают. Необязательно быть высококлассным поваром, чтобы судить о качестве блюда.

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

                                                                  По поводу нашего сайта. Мое личное мнение: его нужно улучшать, улучшать и улучшать.
                                                                  • –2
                                                                    Так орнитологи и не учат других летать :)
                                                                    • –1
                                                                      Мой мессадж в том, что человек может одновременно разбираться в сайтах и давать рекомендации по юзабилити и при этом не быть разработчиком самых удобных сайтов на планете. Я, например, вообще ни разу не разработчик сайтов. Это не помешало мне написать эту статью.

                                                                      По существу — если вы с чем-то не согласны в самой статье, мы открыты к критике, как можете судить по остальным комментариям.
                                                                      • +1
                                                                        вообще-то учат
                                                                  • +1
                                                                    реквестирую тип лицензии на текст!
                                                                    не, не так, умоляю, ради сохранения клеток моего мозга (!!!) отдать во всеобщее пользование текст!

                                                                    ЗЫ ссылку на автора буду вставлять в начале )))
                                                                    • 0
                                                                      Вы главное пришлите сюда ссылку на перепост. :)
                                                                    • 0
                                                                      Похоже, я один долго тупил от хлебных крошек…
                                                                      А оказалось — это breadcrumb.
                                                                      Too much of English, I guess.
                                                                      • 0
                                                                        А вы бы хотели, чтобы мы использовали термин «навигационная цепочка»?:) Английский термин вполне переводим.
                                                                        • 0
                                                                          Сначала тоже не понимал. Потом быстро нагуглил. Спасибо за новый словарный запас.
                                                                      • 0
                                                                        Про минимализм — всеми руками за! Только не каждый заказчик это понимает, и после вылизанного дизайна без лишних деталей, говорит мол фи, слишком просто и заказывает нарисовать картинку у знакомого дизайнера-полиграфиста, который специфику веба ни-ни. В итоге получаются страшные уродцы, которых не только в портфель, с них ссылку на себя для сеонистических целей брезгливо ставить.
                                                                        • +1
                                                                          Да. Надеюсь, статью читают не только дизайнеры:)
                                                                        • 0
                                                                          Одно-два меню? Мне кажется, что должно быть только одно. Когда вижу на сайте больше одного меню — у меня пухнет голова и я зверею. Всё равно как два разных оглавления к одной книге.
                                                                          • +1
                                                                            Хорошо, когда одно. Однако, иногда это невозможно. Если в интернет-магазине есть каталог товаров, а также разделы типа «Доставка», «Оплата», «Гарантии» и т.д. — лучше разделить их на два меню.
                                                                          • 0
                                                                            Вроде бы правила вполне очевидны, но почему-то многие раз за разом наступают на те же грабли.
                                                                            Сайты многих крупных компаний, в которые, думаю, вложено немало денег, промахиваются чуть ли не по всем 5 пунктам. Окошко поиска, те же контакты расположены в самых неожиданных местах. Несколько меню, разбросанных по странице, пункты которых разделены по известному одним создателям принципу.
                                                                            Этим часто грешат сайты турфирм, операторов связи.
                                                                            В свое время я просмотрела несколько десятков сайтов IT-компаний в поисках примеров удачных интерфейсов. Удобных среди них, на мой взгляд, единицы. И это не сайты лидеров отрасли.
                                                                            • +1
                                                                              Чем больше понимающих людей, тем лучше:)

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

                                                                            Самое читаемое