Размеры экранов современных мобильных устройств весьма разны, и при создании адаптивного дизайна в полной мере резонно появляется вопрос: как ответственна информация «выше линии сгиба» (от англ. above направляться fold — термин случился из полиграфии, по аналогии со сгибом газетного страницы), либо та часть страницы, которую мы видим до скроллинга?
Не обращая внимания на то, что правильное расположение «линии сгиба» в гаджетах может различаться в зависимости от их экрана, с технической точки зрения «сгиб» для самые популярных моделей возможно задать заблаговременно — адаптивный дизайн включает 2, 3, 4 либо более пропорций для разных их размеров и устройств.
Но размещение «сгиба» не так принципиально важно, как само его понятие — важная роль «первого экрана» содержится в том, что он определяет итоговую глубину просмотра. Как показывает практика, 84% пользователей изучают лишь верхнюю часть страницы, и в случае если информация их не «зацепила», то скроллить дальше уже не будут.
Разглядим эту обстановку с позиций «цены» сотрудничества для пользователя:
- Видимая часть страницы без каких-либо дополнительных действий (та, что выше сгиба) — дешевизна сотрудничества.
- Невидимая часть страницы, требующая упрочнения, дабы сделать ее видимой (та, что находится ниже сгиба) — более большая цена сотрудничества, складывающаяся из готовности изучать данные дальше и конкретно самого скроллинга.
ppТо, что человек видит в верхней части страницы, определяет его предстоящие действия: листать ниже, перейти к второй странице, к второму сайту либо по большому счету прекратить поиски. Вот из-за чего принципиально важно для удобства пользователей в верхней части долгих страниц делать указатели, к примеру, в виде ссылок либо содержания.
Потому, что экраны становятся меньше, люди довольно часто вынуждены скроллить больше — но не вследствие того что им это нравится, а в надежде заметить больше главной информации по запросу.
- Имеется ли жизнь ниже линии сгиба, либо Как ответствен контент в первом окне лендинга?
Поощряйте скроллинг
Дабы заинтересовать пользователя и убедить его прокрутить страницу до конца, применяйте разные визуальные элементы, «цепляющие» взор, и грамотное содержание, которое окажет помощь им остаться на ней продолжительнее.
Кроме того привлекательный первый экран сайта, если он не содержит подсказок о вероятном продолжении, может и не привести к листать страницу ниже, потому, что пользователь не будет уверен, что отыщет нужную ему данные ниже. Таковой дизайн формирует «фальшивое дно», либо иллюзию финиша страницы, заставляющую визитёров думать, что они уже просмотрели целый сайт до конца.
Узнаваемый сайт Mod начинается с изображения на целый экран и ссылкой на видео, и единственный визуальный показатель, говорящий, что ниже кроме этого содержится информация — стрелка. Старайтесь создавать таковой дизайн, дабы вам были не необходимы подобные указатели.
Но в то время, когда пользователь начинает скроллить, то чувствует все громадную заинтересованность изучать сайт дальше. Благодаря «якорям» навигация по странице весьма эргономична, разрешает скоро перейти к интересующим местам, а всевозможный размер шрифта, картинки и текст предоставляют подробную данные о продукте
В то время, когда пользователи не видят сокровище в контенте, они прекращают скроллинг. И не смотря на то, что, как продемонстрировал один юзабилити-тест, кое-какие люди перед прочтением прокручивают всю страницу полностью, и только затем приступают к изучению информации, это далеко не обычное поведение — как правило пользователям нужна обстоятельство для скроллинга.
«Линия сгиба» исходя из этого и серьёзна, потому, что равно как и ожидание загрузки сайта, прокручивание «карусели» либо открытие «аккордеона» для чтения текста — скроллинг относится к дополнительным шагам, каковые пользователи должны предпринять для получения нужной им информации.
Непременно, существует минималистичный дизайн верхней части страницы, убеждающий скроллить дальше, намекая на увлекательное содержание методом заманчивого введения либо вовлекающих изображений. Умелые дизайнеры, создающие подобные сайты, замечательно знают о «линии сгиба» — и способах, талантливых мотивировать пользователей на предстоящее изучение.
В то время, когда пользователи не видят сокровище в контенте, они прекращают скроллинг лендинга
Твитнуть цитату
- Стратегия первого экрана, либо Жизнь выше «линии сгиба»
Доказательства влияния «линии сгиба»
Бессчётные наблюдения за пользователями продемонстрировали, что частенько люди не только покидали сайты, не дойдя до нужной информации, но иногда и вовсе не догадывались, что она может в том месте быть.
Так, какое количество изучение, в котором участвовало 57 453 пользователя, установило: верхние 100 пикселей страницы до сгиба привлекли к себе на 102% больше взоров, чем те, что пребывали сразу после него. По тепловой карте видно, где больше всего было «приковано» взоров пользователей:
Тепловая карта, составленная на базе наблюдений за 57 453 пользователями. Красный цвет говорит о большом заинтересованности, желтый — на среднюю, белый — на низкую. Тёмные полосы говорят о сгибе страницы в изучении.
Гугл совершил анализ дисплейной рекламы (display ads) на большом количестве веб-сайтов. Изучение продемонстрировало, как «видима» была реклама, появляющаяся на экране в течение 1 секунды. У рекламных объявлений чуть выше сгиба было 73% просмотров, в то время как у объявлений чуть ниже сгиба — только 44%, другими словами отличие составила 66%.
Так, размещение контента относительно «линии сгиба» вправду воздействует на поведение пользователей. Но так как все данные нереально разместить на первом экране, не забывайте: дабы визитёры прокрутили ваш сайт до конца, вам нужно дать им для этого вескую обстоятельство.
Высоких вам конверсий!
По данным: nngroup.com