Миф о первом экране: данные тестирования
09-04-2013. Раздел:Перевод. Теги:тестирование, юзабилити. |
Что такое первый экран?
Понятие первого экрана пришло из газетного дизайна: фраза «above the fold» по-английски означает важные материалы, которые располагают в верхней части первой страницы газеты. В веб-дизайне этот термин обычно применяют к той области страницы сайта, которую вы видите на экране до того, как начнете прокручивать страницу.Почему нас не волнует проблема первого экрана
Люди сообщают нам, что они не против прокручивания, и поведение испытуемых в тестах пользователей подтверждает эти слова. Мы видим, что посетители чувствуют себя более чем комфортно, листая длинные-предлинные страницы в поисках интересующей их информации. Не слишком долгий поиск в Интернете выведет вас на преуспевающие бренды, которых также совершенно не смущает проблема первого экрана:Как веб-профессионалы, мы все знаем, что концепция первого экрана, ниже которого пользователи ничего не читают, — это миф. За последние шесть лет мы изучили данные более 800 тестов пользователей, и только в трех случаях первый экран стал барьером, отделившим посетителей от контента, с которым они хотели познакомиться.Теперь добавим результаты тестирования пользователей
Когда мы проводим тестирование пользователей здесь, на cxpartners, мы отслеживаем движение их глаз. Это позволяет нам увидеть то, что видит пользователь. Затем мы берем обобщенные данные о движении глаз в каждом исследовании и создаем наборы карт интенсивности внимания. Эти карты показывают нам, на что смотрит группа пользователей в целом.Полоса прокрутки используется для передвижения по странице, а также указывает на наличие контента за первым экраном
Карта интенсивности внимания с данными о движении глаз подтверждает — полоса прокрутки является знаком, указывающим на длину страницы.Одна из самых распространенных вещей на карте интенсивности внимания — четко выраженное яркое пятно над полосой прокрутки. Полоса прокрутки используется для передвижения по странице. Пользователи ожидают, что им придется прокручивать страницу. Это подтверждает приведенная ниже карта интенсивности внимания.Меньший объем контента на первом экране может сильнее побуждать пользователя к изучению той части страницы, что находится ниже первого экрана
Исследование движения глаз на сайте аэропорта Бристоля показывает, как пользователи действуют на странице в случае уменьшения объема контента на первом экране. На изображении слева первый экран содержит больший объем контента, а на изображении справа — меньший.Приведенная картинка показывает некоторые результаты последней работы по исследованию движения глаз, которую мы сделали для сайта аэропорта Бристоля. Здесь вы можете видеть два варианта дизайна ключевой области (зоны с крупным, бросающимся в глаза изображением) главной страницы. Неожиданным для нас стало следующее открытие: фактически уменьшение объема контента на первом экране (один большой блок контента вместо двух меньших по размеру) побуждает посетителей проследовать по странице ниже первого экрана.Когда пользователь не смотрит ниже первого экрана
Как мы упомянули во введении, было три случая, когда пользователи практически не просматривали контент ниже первого экрана. В каждом случае причина была одна и та же.Одним из таких случаев стало тестирование пользователей, которое мы выполнили в прошлом году для First Choice. Приведенная ниже страница, довольно длинная, вызвала затруднения, поскольку посетители не прокручивали страницу.Голубая горизонтальная панель стала препятствием к прокруткеДлинный голубой заголовок «Accommodation» действовал как барьер. Это — обычное дело: бросающиеся в глаза горизонтальные линии поперек страницы отбивают охоту к прокрутке.Теперь First Choice убрал со страницы горизонтальную линию и просто показывает контент на первом экране.Набор изображений залезает немного на первый экран и тем самым показывает, что ниже также есть контентСоветы по созданию дизайна, побуждающего пользователя прокручивать страницу
Предлагаем вашему вниманию три совета по созданию дизайна, который гарантирует просмотр контента, расположенного ниже первого экрана.1. Лучше меньше, да лучше: не поддавайтесь соблазну запихнуть все на первый экран, Разумное использование пустого пространства и изображений побуждает посетителя заглянуть ниже первого экрана.2. Решительные горизонтальные линии отбивают охоту к прокрутке страницы, хотя из-за этого не следует прекращать использование элементов, занимающих всю ширину страницы по горизонтали. Сделайте так, чтобы небольшой объем контента немного выглядывал, выдавался из-за границы первого экрана — это будет побуждать посетителя к прокрутке.3. Избегайте использования встроенных в страницу полос прокрутки — полосы прокрутки браузера являются индикатором объема контента, размещенного на странице. iframe и другие элементы страницы с полосами прокрутки могут нарушить эту условность и привести к тому, что весь контент не будет просмотрен.Необходимое пояснение. Во всех своих тестах мы использовали размер браузера 1024 х 740 пикселей. Таким образом, на изображениях, приведенных выше, высота первого экрана в среднем составляет около 700 пикселей.Наши исследования показывают, что наиболее эффективное место для размещения контента — первый экран, и это никого не удивит. При этом люди таки прокручивают страницу. Пользователи прокручивают страницу, если на странице есть знаки, указывающие на эту возможность, а в дизайне отсутствуют барьеры для прокрутки.по материалам cxpartners.co.ukЧитайте также:
Поисковое продвижение никогда не было проще!
Система автоматизированного продвижения SeoPult быстро выведет ваш сайт в ТОП поисковых систем, сохраняя деньги и время. Автоматика полностью исключает ручной труд, наценки посредников, ошибки или непрофессионализм.Источник: http://feedproxy.google.com/~r/Seopult/~3/2VuDjf0w4Nw/mif-o-pervom-ekrane-dannye-testirovaniya.html
Дайджест новых статей по интернет-маркетингу на ваш email
Новые статьи и публикации
- 2024-11-26 » Капитан грузового судна, или Как начать использовать Docker в своих проектах
- 2024-11-26 » Обеспечение безопасности ваших веб-приложений с помощью PHP OOP и PDO
- 2024-11-22 » Ошибки в Яндекс Вебмастере: как найти и исправить
- 2024-11-22 » Ошибки в Яндекс Вебмастере: как найти и исправить
- 2024-11-15 » Перенос сайта на WordPress с одного домена на другой
- 2024-11-08 » OSPanel 6: быстрый старт
- 2024-11-08 » Как установить PhpMyAdmin в Open Server Panel
- 2024-09-30 » Как быстро запустить Laravel на Windows
- 2024-09-25 » Next.js
- 2024-09-05 » OpenAI рассказал, как запретить ChatGPT использовать содержимое сайта для обучения
- 2024-08-28 » Чек-лист: как увеличить конверсию интернет-магазина на примере спортпита
- 2024-08-01 » WebSocket
- 2024-07-26 » Интеграция с Яндекс Еда
- 2024-07-26 » Интеграция с Эквайринг
- 2024-07-26 » Интеграция с СДЕК
- 2024-07-26 » Интеграция с Битрикс-24
- 2024-07-26 » Интеграция с Travelline
- 2024-07-26 » Интеграция с Iiko
- 2024-07-26 » Интеграция с Delivery Club
- 2024-07-26 » Интеграция с CRM
- 2024-07-26 » Интеграция с 1C-Бухгалтерия
- 2024-07-24 » Что такое сторителлинг: техники и примеры
- 2024-07-17 » Ошибка 404: что это такое и как ее использовать для бизнеса
- 2024-07-03 » Размещайте прайс-листы на FarPost.ru и продавайте товары быстро и выгодно
- 2024-07-01 » Профилирование кода в PHP
- 2024-06-28 » Изучаем ABC/XYZ-анализ: что это такое и какие решения с помощью него принимают
- 2024-06-17 » Зачем вам знать потребности клиента
- 2024-06-11 » Что нового в работе Яндекс Метрики: полный обзор обновления
- 2024-06-11 » Поведенческие факторы ранжирования в Яндексе
- 2024-06-11 » Скорость загрузки сайта: почему это важно и как влияет на ранжирование
Есть три способа отвечать на вопросы: сказать необходимое, отвечать с приветливостью и – наговорить лишнего Плутарх - (ок. 46 — ок.120) - древнегреческий писатель, историк |
Мы создаем сайты, которые работают! Профессионально обслуживаем и продвигаем их , а также по всей России и ближнему зарубежью с 2006 года!
Как мы работаем
Заявка
Позвоните или оставьте заявку на сайте.
Консультация
Обсуждаем что именно Вам нужно и помогаем определить как это лучше сделать!
Договор
Заключаем договор на оказание услуг, в котором прописаны условия и обязанности обеих сторон.
Выполнение работ
Непосредственно оказание требующихся услуг и работ по вашему заданию.
Поддержка
Сдача выполненых работ, последующие корректировки и поддержка при необходимости.