Всем нам знакомо правило первого экрана гласящее «Пользователь не прокручивает страницу, поэтому вся информация должна быть на верху», основано оно на том, что пользователь не использует полосы прокрутки, потому что ему лень.Ребята в компании cxpartners (Великобритания, Бристоль) решили проверить это утверждение и провели исследование, представляю перевод их отчёта.
Как профессионалы веб-разработки мы знаем, что правило первогоэкрана — миф. На протяжении последних 3 лет, нами было проведено около 800 пользовательских тестов и лишь в трёх случаях нижняя граница окна стала реальной преградой для пользователей.
В этой статье мы докажем что правило первого экрана не работает!
Что такое правило первого экрана?
Вообще это правило пришло из газет: самый важный материал в газетах всегда располагается на верхней половине первой страницы. В интернете оно используется для описания части страницы, которую пользователь видит первой.Почему мы не переживаем из-за правила первого экрана
Пользователи сказали нам, что их ни сколько не волнует полоса прокрутки, и мы убедились в этом сами. Пользователи чувствовали себя более чем комфортно прокручивая длинные, очень длинные страницы, для того чтобы найти то что им нужно. Даже беглый взгляд позволяет увидеть множество успешных сайтов, создатели которых не переживают из-за правила первого экрана.
Добавляем доказательства
Когда мы в компании cxpartners проводим тесты, то используем eye trecker (система слежения за взглядом). Eye trecker позволяет видеть то, что видит пользователь. На основе получаемых данных мы создаём температурные карты, которые показывают нам, куда смотрели пользователи.Полосы прокрутки
Когда мы проанализировали результаты, то увидели чёткое пятно в правом углу карты. Это была полоса прокрутки, из этого можно было легко сделать вывод, что прокрутка используется для оценки длины страницы и скрытого от глаз содержимого.Небольшое количество контента даёт стимул к дальнейшему исследованию страницы
Изображение ниже показывает два варианта страницы Бристольского аэропорта: на первом макете информация сразу делится на две колонки, а на втором макете имеется основной элемент в виде иллюстрации. В итоге на втором макете люди чаще использовали прокрутку, и добирались ниже.
Тормоза для глаз
Одним из трёх случаев, когда пользователи не исследовали страницу дальше, был сайт компании First Choice, в остальных случаях ситуация была аналогичной.Мы проводили исследование сайта First Choice, который сделали год назад, страница была очень длинной и пользователи ни за что не хотели просматривать её до конца.
Заголовок «Accomodation» растянутый на всю страницу тормозил взгляд пользователя. Тогда мы поместили контент на «линию сгиба»,
что привело к нужному результату.
Советы дизайнерам
В результате наблюдений мы пришли к таким выводам:- большое количество свободного пространства между элементами облегчает движение глаз.
- горизонтальные линии тормозят читателя и препятствуют дальнейшему просмотру страницы, поэтому элементы должны находиться чуть выше нижней границы
- избегайте полос прокрутки внутри страницы, так как они мешают читателю оценить высоту страницы.
Примечания авторов
- Мы рассматривали не вопрос размещения контента, а вопрос просмотра контента расположенного ниже границы.
- За стандартный размер области просмотра был приняты значения 1024*700 пикселей. 700 — средняя высота области просмотра.
Примечание переводчика
- Это вольный перевод статьи максимально близкий к оригиналу, возможно некоторые термины мной были переведены неправильно.
- Место окончания области просмотра авторы называют fold, что в переводе с английского означает сгиб, но это английский термин, аналог которого в русском языке мне не известен, поэтому он переведён условно.
