Раскраска «зебра»: действительно ли она помогает пользователям?
Zebra Striping: Does it Really Help?
Автор:
Источник:
«Зебра» – метод, заключающийся в раскраске в различные цвета строк в формах или таблицах. Сайты, которые используют такую раскраску – . Зебра, которая сейчас популярна в интернете, пришла из бумажной печати: одно из первых упоминаний этого метода относится к 1961 году.
Многие считают, что полоски разного цвета помогают читателям двигать взгляд вдоль строки. Однако, несмотря на то, что этот метод используется почти половину столетия, практически нет доказательств того, что он действительно помогает читателям. В июне-июле 2007 года мы провели обзор источников, таких как Международная ассоциация историков бумаги (International Association of Paper Historians), Ассоциация форм документов (Business and Forms Management Association), журнал «IEEE Annals of the History of Computing», но не нашли никакой информации о происхождении или обоснования «зебры».
Тем не менее, применение «зебры» в электронной форме является нетривиальной задачей. A List Apart один раз публиковал . Как web-дизайнеры, мы не можем позволить тратить время на реализацию, которая на самом деле не приносит пользы. Итак, мы решили провести исследование с целью убедиться, что «зебра» действительно делает вещи проще.
Измерение упрощения
«Зебра» используется, когда данные представлены в табличной форме. Пользователь, работающий с таблицей, должен найти в ней одно или несколько значений (точек). Его цель состоит в том, чтобы правильно найти точку и сделать это как можно быстрее. Поэтому, если мы ставим пользователю при работе с таблицей такую задачу и предполагаем, что «зебра» должна эту задачу облегчить, мы рассчитываем, что увеличится либо точность, либо скорость.
Эксперимент
Мы разработали эксперимент, в котором участники работали с табличными данными, и попросил использовать эти данные для ответа на шесть вопросов. Три вопроса были заданы, когда таблица была раскрашена «зеброй», и три вопроса, когда таблица была без раскраски.
Вопросы, задаваемые, когда таблица была раскрашена, повторяли вопросы, когда таблица была чистая. То есть, вопросы были парными: для каждого вопроса была версия для обеих таблиц. Это позволило нам оценить влияние раскраски.
Порядок, в котором шли таблицы, выбирался для каждого участника случайным образом (чтобы устранить влияние порядка следования). Эксперимент описывался просто как «исследование форматирования таблиц». Эксперимент проводился через интернет, но при всех проблемах, оказался действенным и экономически эффективным. За две недели эксперимента были собраны данные с 244 человек.
Таблица с данными, как показано ниже, состояла из 15 строк (включая заголовочную строку) и 9 столбцов. В ней содержатся искусственные данные, которые плохо соотносятся с общими свойствами винтов.
Цель состояла в том, чтобы построить таблицу которая:
- Не была бы слишком простой для участников.
- Не была бы слишком большой, чтобы требовалась горизонтальная или вертикальная прокрутка.
- Содержала данные, с которыми участники не особенно знакомы, чтобы снизить вероятность того, что участник будет знать ответ и без таблицы.
- Содержать данные различных типов – числа, строки, символы, цены и т.д.
Помимо наличия или отсутствия раскраски, во время эксперимента никаких других изменений не вносилось.
Выводы
Мы не стали включать статистические данные, лежащих в основе выводов, в статью (вы можете скачать их отдельно).
Точность
Несмотря на то, что мы постарались сделать сложными, большинство участников давали правильные ответы – количество ошибок по всем вопросам составило 12% или меньше.
Вопросы, по которым было особенно мало ошибок (например, вопрос, на который была всего одна ошибка или менее 2%), были исключены из анализа, так как общие выводы из-за них могут быть недостоверными. На графике ниже видно: практически никакой разницы в точности по этим вопросам между двумя таблицами нет.
Дальнейший анализ этих данных показывает, что действительно нет никаких статистически значимых различий в точности ответов для раскрашенной и чистой таблицы.
Скорость
Даже без повышения точности, увеличение по скорости тоже оказалось бы полезным.
Из графика ниже видно, что среднее время на ответы по первым двум вопросам больше, когда таблица была раскрашена, но для остальных четырех вопросов при раскрашенной таблице требовалось меньше времени. Однако только разница во времени по шестому вопросу была статистически значима.
Предпочтение
После шести вопросов, которые касались данных в таблицах, участникам было предложено ответить об их предпочтениях относительно «зебры». Большинство участников предпочли «зебру» (46%), однако значительная часть не имеет предпочтений вообще (33%).
Так имеет ли смысл использовать «зебру»?
Этот эксперимент не дает никаких доказательств того, что использование «зебры» гарантированно повышает точность и скорость при решении задач. Это, по-видимому, указывает на то, что нам не нужно больше беспокоиться относительно раскраски таблиц.
Тем не менее, существует несколько аргументов против отказа от зебры в целом.
Во-первых, в этом исследовании субъективное предпочтение было на стороне раскрашенных таблиц. Наши исследования и обсуждения позволяют предположить, что большинство людей находят раскрашенные таблицы более эстетичными. Если большинству пользователей «зебра» нравится (а другая большая группа не имеет ничего против нее), то почему бы не применять этот метод?
Во-вторых, это был один эксперимент, причем на одном объеме данных. Не исключено, что особенности дизайна в этом эксперименте привели к низкой эффективности «зебры». В других случаях, например при значительном расстоянии между столбцами или при необходимости горизонтальной прокрутки, может наблюдаться более выраженный положительный эффект.
И наконец, пожалуй самое интересное, некоторые участники сообщили, что водили пальцем по экрану, чтобы находить пересечения строк и столбцов. Другие использовали мышь, чтобы выделять нужные ряды. Эти люди, по сути, создавали свои временные «зебры». Так что возможно, мы уменьшим нагрузку на пользователей, если создадим «зебру» за них.
Решение остается за вами
К сожалению, это исследование не дает четкого ответа, следует ли продолжать применять раскраску «зебра» для табличных данных. Впрочем, нет никаких данных, что «зебра» ухудшает работу, и мы знаем, что большинству пользователей она нравится.
В конце концов, решение о том, следует ли использовать «зебру», вероятно сводится к субъективной оценке издержек и возможных выгод.
Участие в дальнейших исследованиях
Formulate в настоящее время проводит новые исследования, которые помогут решить некоторые вопросы, возникшие по ходу описанных экспериментов. Эксперимент занимает меньше пяти минут. Большое число участников необходимо для получения достоверных данных.
Чтобы принять участие в исследовании, посетите http://surveys.formulate.com.au/dtfu/.
Translated with the permission of A List Apart Magazine and the author[s].
Комментарии
Предполагаю, что в постановке эксперимента есть неточность. Таблица не слишком широкая, и глаз не сбивается при движении вдоль строки. Может стоит попробовать сделать таблицу вытянутой в ширину (то есть, например, не 9 а 18 колонок) Кажется, что тогда зебра проявит себя в большей степени
Эксперимент очень ошибочен. Зебра нужна когда столбцы очень широко расставлены, и когда строк очень много. Список из 14 элементов практически удерживается мозгом на месте и поэтому движение глаз удерживается на идельной горизонтальной линии и так.
Сделайте 500 строк в таблице и прокрутите её так, чтобы не было видно заголовков. Тогда сравните таблицу с зеброй и без неё.
Зебра, имеет мало смысла если не сделана подсветка строк при наведении курсора мыши. в статье об этом ничего не сказано тк что предполагаю, что этот вопрос не обсуждался.
Если пользователь водил пальцем по экрану - это именно тот звоночек что ему без разницы что есть зебра что её нет, ему нужна чёткая индикация.
подсветка строки при наведении курсора мыши - полностью решает проблему “удобности” поиска данных в таблице, и зебра в таком случае может использоваться только как элемент дизайна и не более.
Судя по тому, как ставится эксперимент, насчитать по результатам можно будет чего угодно: успеть за короткое время просканировать форму, переместить фокус на инпут и забить туда без ошибок правильный вариант — это что-то…
Если на сайте используется резиновый макет, и при этом у пользователя широкий монитор, то зебра очень помогает. Особенно, если это панель какого-нибудь файлового менеджера в панели управления сервером.. Ошибиться галочкой при удалении файла ой как не хочется…
[...] что он действительно помогает читателям” (читайте интересное исследование о “зебре”). По поводу таблиц у меня нет однозначного мнения, хотя [...]
[...] Действительно ли «зебра» помогает пользователям? Прохождение исследования «зебры»Многие считают, что полоски разного цвета помогают читателям трепать(ся) (жидкость) взгляд вдоль строки. Однако, несмотря держи в таком случае, что этот метод используется примерно половину столетия, ан нет доказательств того, отчего он действительно помогает читателям. пишущий эти строки решили осуществить исследование с целью убедиться, точно «зебра» действительно делает принадлежности проще. [...]
Оставьте комментарий
You must be logged in to post a comment. Log in