Бесконечная прокрутка: Бесконечная прокрутка против разбивки на страницы / Хабр

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

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

Бесконечная прокрутка может также хорошо работать для приложений в стиле чата, таких как текстовые сообщения или Slack, где пользователям обычно не нужно находить определенные сообщения или беспокоиться о том, чтобы увидеть все. «Это всего лишь моменты времени, вы то погружаетесь, то уходите», — сказал Роселли.

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

Прикрепление нижнего колонтитула веб-сайта под морем бесконечно загружаемого контента ставит перед пользователями сизифову задачу. Они рассердятся на вас за это. И это правильно. Размещайте важную информацию в легкодоступном месте.

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

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

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

«Прежде чем тратить время на написание кода, выясните, какую проблему вы пытаетесь решить», — сказал Роселли. Например, если дизайнеры хотят увеличить время пребывания на сайте и снизить показатель отказов, им следует создать прототип, протестировать его на большом количестве пользователей (включая пользователей с ограниченными возможностями) и посмотреть, действительно ли дизайн соответствует поставленной цели.

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

Читать NextFormer Консультант Twitter по этичному UX-дизайну

Давайте докопаемся до сути — журнал Smashing Magazine Тенденции, Веб-дизайн, Навигация, UX

Об авторе

Йогев Ахувиа — старший инженер по работе с клиентами в Fundbox. Йогев — эксперт по UX и художник по коду (см. его профиль на CodePen), он пишет и выступает в блогах и… Больше о Yogev ↬

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

Бесконечная прокрутка, нумерация страниц или кнопки «Загрузить еще»?

Какой шаблон UX лучше всего подходит для отображения продуктов на веб-сайте электронной коммерции? Мы протестировали три различных шаблона дизайна для загрузки продуктов. Читать статью по теме →

Больше после прыжка! Продолжить чтение ниже ↓

Хороший

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

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

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

Twitter эффективно интегрирует бесконечную прокрутку. Его фид соответствует критериям: большой объем данных (твитов) и платформа в реальном времени. С точки зрения пользователя все твиты одинаково релевантны, а это означает, что они имеют одинаковый потенциал быть интересными или неинтересными; поэтому пользователи часто прокручивают все твиты в своей ленте. Будучи платформой реального времени, Twitter постоянно обновляется, даже если пользователь оставляет свою ленту без присмотра. Бесконечная прокрутка, кажется, была создана специально для таких веб-сайтов, как Twitter, который успешно использует эту технологию.

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

Плохое и уродливое

При просмотре такого большого количества данных пользователи должны сосредоточиться на информации, которую они ищут. (Помните о том, что нужно быть целеустремленным?) Всегда ли пользователи хотят нескончаемого потока данных? Аналитика показывает, что когда пользователи ищут информацию в Google, только 6% переходят на вторую страницу. Итак, 94% пользователей удовлетворены получением только 10 результатов, что говорит о том, что пользователи считают ранжирование результатов Google релевантным.

Нажимать или не нажимать

Google реализовал бесконечную прокрутку для результатов поиска изображений, но еще не реализовал ее для своих общих результатов. Это избавит пользователей от необходимости щелкать, чтобы перейти на вторую страницу. Google, вероятно, сохранит нумерацию страниц, потому что этот шаблон весьма символичен для его бренда. Если он переключится на бесконечную прокрутку, когда пользователи обычно прекращают прокрутку? После 20 результатов? 50? Когда простой просмотр становится более сложным?

Поиск лучшего результата поиска может занять секунду или час, в зависимости от ваших исследований. Но когда вы решите прекратить поиск в текущем формате Google, вы будете знать точное количество результатов поиска. Вы можете принять обоснованное решение о том, где остановиться или сколько результатов просмотреть, потому что вы знаете, где конец. Согласно исследованиям, проведенным в области взаимодействия человека с компьютером, достижение конечной точки дает ощущение контроля ; вы знаете, что получили все соответствующие результаты, и знаете, есть ли тот, который вы ищете, или нет. Знание количества доступных результатов дает ощущение контроля и помогает пользователю принять более обоснованное решение, а не рыскать по бесконечно прокручиваемому списку.

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

Если вы прокручиваете один и тот же список результатов с бесконечной прокруткой, вы остаетесь без этого чувства контроля, потому что вы прокручиваете список, который концептуально бесконечен. Допустим, вы считаете себя одним из 94% перестают читать после первой страницы (то есть 10 результатов) поиска в Google. Когда список прокручивается бесконечно, первой странице практически нет конца. Вместо того, чтобы искать конец страницы, которого все равно не существует, вы решаете остановить прокрутку на 10-м элементе. Это создает проблему с бесконечной прокруткой, потому что 11-й элемент находится прямо в поле зрения. Со списком с разбивкой на страницы, в котором вы не увидите 11-й результат, проще решить не продолжать просмотр. Однако, когда очередные результаты уже есть, вы, вероятно, просто продолжали бы прокручивать и прокручивать .

Как отмечает Дмитрий Фадеев:

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

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

— Дмитрий Фадеев, Когда не работает бесконечная прокрутка

Лучшие компании постоянно тестируют и изучают новые взаимодействия со своими пользователями. Растущее число этих исследований показывает, что бесконечная прокрутка не находит отклика у пользователей, если она не поддерживает их цели на веб-сайте.

Искушение

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

Оптимизм

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

Истощение

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

Pogosticking

Бесконечная прокрутка часто приводит к тому, что ваша позиция на странице теряется. «Погостик» происходит, когда вы щелкаете по бесконечно прокручиваемому списку и, когда вы возвращаетесь, нажимая «Назад», возвращаетесь к началу предыдущей страницы, а не к тому месту, где вы остановились. Это происходит из-за того, что позиция прокрутки теряется, когда вы уходите со страницы с бесконечной прокруткой, что вынуждает вас каждый раз прокручивать вниз.

Потеря контроля

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

Отвлечение

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

Недоступно

Пытались ли вы в последнее время добраться до нижнего колонтитула Facebook? Блок нижнего колонтитула находится под лентой новостей, но поскольку лента прокручивается бесконечно, как только вы достигаете нижней части, загружается больше данных, каждый раз выталкивая нижний колонтитул из поля зрения. Нижние колонтитулы существуют не просто так: они содержат контент, который иногда нужен пользователю. В случае с Facebook пользователь не может до него добраться. Ссылки повторяются в других местах, но их труднее найти. Бесконечная прокрутка мешает пользователю, делая важную информацию недоступной.

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

Not Exclusive

Pinterest вообще не имеет нижнего колонтитула, что имеет смысл, учитывая проблему, которую мы только что видели с Facebook. Благодаря бесконечной прокрутке Pinterest подчеркивает изобилие данных, бесконечное море вдохновения, взятое со всего Интернета.

Изображения прокручиваются быстрее и проще, чем текст, поэтому Pinterest и Google Images до некоторой степени преуспели в бесконечной прокрутке. Однако в Сети находятся миллиарды изображений, и пользователи предпочли бы видеть только лучшие из них. Есть что сказать об эксклюзивности, которой, похоже, не хватает в макете Pinterest.

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

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

Когда удобство использования побеждает

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

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

Твиттер не единственный. Discourse, новая дискуссионная платформа, также имеет бесконечную прокрутку, которая расширяет возможности пользователя. Компания учла важность бесконечной прокрутки для своего пользовательского опыта и внедрила интригующий и уникальный индикатор прогресса. Индикатор появляется при необходимости и остается на виду (не мешая), пока пользователь читает содержимое. Индикатор нумерует элемент, просматриваемый в данный момент, из общего количества элементов. Это отличный способ заставить пользователя чувствовать себя под контролем даже при большом количестве данных.

Go Hybrid

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

Поскольку бесконечная прокрутка требует, чтобы веб-сайт загружал так много контента, иногда используется гибридное решение для управления нагрузкой данных. В новостной ленте Facebook и поиске изображений Google бесконечная прокрутка сначала выполняется автоматически, но становится активной после загрузки определенного количества элементов. Это поддерживает интерфейс при ограничении нагрузки на сервер.

Бесконечные страницы

Бесконечные страницы выводят концепцию бесконечной прокрутки на новый уровень. Веб-сайты, использующие эту концепцию, являются «одностраничными». Чтобы убрать барьер перехода на следующую страницу, дизайнер превращает весь сайт в одну длинную прокручиваемую страницу. Примерами являются Unfold и Lost World’s Fairs.

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

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

UX-инженерам необходимо проявлять особую осторожность при разработке бесконечных страниц. Они должны учитывать доступность; сообщить пользователям, где они находятся, показывая длину страницы и сколько они просмотрели. Решения могут включать фиксированное меню, карту страницы или индикатор выполнения прокрутки.

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

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

Избегайте следующих провалов, чтобы добиться надежной бесконечной прокрутки:

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

Правильное использование

Пользователи целеустремленны и находят удовлетворение в достижении конца своего исследования. Чтобы быть эффективной, бесконечная прокрутка должна учитывать это. На самом деле ничто не бесконечно , даже те списки с бесконечной прокруткой, которые мы рассматривали. Пользователи всегда должны знать, где они находятся, даже если контент еще не закончил загрузку. Они должны знать, каков общий объем данных, и уметь легко ориентироваться в списке. Бесконечная прокрутка должна быть реализована наилучшим образом, чтобы пользователи всегда могли найти свой путь.

Бесконечный свиток: почему он так затягивает и как освободиться

28 февраля 2022 г. , Erin Rupp

Представьте себе легендарный ресторан, предлагающий бесконечный шведский стол.

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

Прежде чем вы это узнаете, вы заболели.

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

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

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

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

Шаблон дизайна с бесконечной прокруткой был создан инженером Азой Раскиным в 2006 году. Позднее Пол Айриш усовершенствовал и доработал до плагина JavaScript. Эта функция (также называемая бесконечной прокруткой, отложенной загрузкой и непрерывной прокруткой) направлена ​​на решение проблем с нумерацией страниц. .

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

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

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

Появление бесконечной прокрутки ознаменовало значительный сдвиг в том, как мы потребляем контент. Когда вы смотрите видео на YouTube, сразу же загружается следующее видео. Netflix сразу же запускает следующую серию вашего любимого шоу. Просмотр Reddit показывает бесконечный поток контента социальных сетей.

Платформы социальных сетей являются одними из самых популярных мест для бесконечной прокрутки. You can scroll endlessly without ever reaching the end, viewing content and interacting with others on popular sites like:

• Facebook
• Instagram
• Twitter
• LinkedIn
• Tumblr
• Pinterest

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

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

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

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

И это правда, что этот тип прокрутки может быть полезен как для владельцев веб-сайтов, так и для посетителей. Среди этих преимуществ:

• Сниженные показатели отскока
• Эффективные просмотр
• Лучшее воздействие контента в реальном времени
• Улучшенный мобильный. Это может вызвать такие проблемы, как:
  • проблемы с доступностью
  • громоздкая навигация
  • не подходит для SEO
  • отсутствие чувства завершенности

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

  Человеку свойственно искать предсказуемость и закономерности. В случае их отсутствия мы ищем их.

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

  Почему это так затягивает?

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

  Можете винить в этом наши мозги.

  Человеку свойственно искать предсказуемость и закономерности. В случае их отсутствия мы ищем их. Итак, тянем, чтобы обновить. Награды не гарантированы, и в большинстве случаев мы не обнаруживаем ничего примечательного. Точно так же, как мы играем, мы продолжаем освежаться в надежде на быстрый прилив дофамина.

  Исследования показывают, что пользователи переходят от одного поста к другому в социальных сетях каждые 19 секунд. Когда мы просматриваем наши ленты, переключаясь между контентом так быстро, мозг каждый раз получает выброс дофамина, создавая своего рода неврологический «кайф». Это как любая зависимость, будь то наркотики, алкоголь или игровые автоматы. Один хит влечет за собой другой, что приводит к циклу, похожему на зависимость, когда пользователи подсаживаются на непрерывный поток.

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

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

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

  Здесь все становится опасно.

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

  «Один из моих уроков бесконечной прокрутки: оптимизация чего-либо для простоты использования не означает наилучшего для пользователя или человечества»,

  он написал в Твиттере в 2019 году.

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

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

  Потеря производительности

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

  Сенсорная перегрузка

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

  Вопросы психического здоровья

  Непрерывная прокрутка также вредна для психического здоровья. Зависимость может привести к обсессивно-компульсивному поведению, тревоге и депрессии. Постоянная бомбардировка историями и изображениями создает иллюзию бесконечных возможностей, что приводит к ощущению безотлагательности и FOMO (страху упустить что-то).

  Вопросы физического здоровья

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

  Мы позволяем себя покупать бесконечной прокруткой? Если да, то какой ценой?

  Какую часть нашей жизни мы фактически отдаем бесплатно?

  Бесконечный свиток представляет угрозу для нашей жизни. Учитывая, что 85% американцев находятся в сети ежедневно (а 31% — почти постоянно), это может показаться непреодолимой силой.

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

  Практика осознанности

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

  Это прекрасная возможность убедиться во многих преимуществах практики внимательности. Поскольку осознанность делает упор на преднамеренное сосредоточение внимания (и намеренное перенаправление внимания), она может предотвратить злоупотребление прокруткой.

  Установка ограничений

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

  • Время. Ограничьте время, которое вы проводите в сети. Вы можете ограничить свое время в день, за сеанс или даже за веб-сайт. Попробуйте расширение для браузера Limit, чтобы легко контролировать сайты, которые вас больше всего отвлекают.
  • Цель: Ограничьте количество и тип информации, которую вы потребляете. Вместо того, чтобы прыгать от ссылки к ссылке, сосредоточьтесь на своей цели, выполните поставленную задачу, а затем закройте ноутбук или телефон. Не нажимайте видео с милыми котиками (знаю, тяжело!).
  • Социальные сети: Остановите зависимость у источника. Отключите уведомления, установите расширение «Пауза», чтобы запретить открытие определенных сайтов, или полностью удалите приложения с телефона. Просто не забудьте установить разумные для вас ограничения. Чтобы разорвать порочный круг зависимости, потребуется время.
  Используйте полезные инструменты

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

  Используйте подключаемый модуль браузера для управления бесконечной прокруткой в ​​веб-браузере. Чтобы избежать использования дополнительной памяти, вы можете полностью заблокировать весь JavaScript на своем компьютере в настройках системы. Имейте в виду, что отключение JavaScript может также отключить функциональность других веб-сайтов.

  Более простое решение? Используйте Свободу. Приложение дает вам гораздо больше контроля над бесконечной прокруткой простыми в использовании способами. Вы можете установить ограничения по времени для определенных веб-сайтов, создать несколько черных списков для разных сеансов и синхронизировать свои сеансы на нескольких устройствах. Просто добавьте свои веб-сайты в черный список и соответствующим образом запланируйте доступ.

  » Если вы не платите за продукт, вы являетесь продуктом, »

  сказал Джарон Ланье.

  Применительно к бесконечной прокрутке слова компьютерного философа приобретают новое значение. Позволяем ли мы себя покупать бесконечной прокруткой? Если да, то какой ценой? Какую часть нашей жизни мы фактически отдаем бесплатно?

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

  Когда использовать, а когда избегать

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

  Adidas.com: Adidas для своих страниц со списком использует разбивку на страницы, чтобы отображать выбор продуктов для своих пользователей. Nike.com: В отличие от своего конкурента Adidas, Nike использует бесконечную прокрутку для отображения своих продуктов на страницах со списком.

  С момента своего изобретения в 2006 году популярность бесконечной прокрутки резко возросла. Сегодня он в основном используется на веб-сайтах и ​​в приложениях с плоской структурой, где контент постоянно течет и в равной степени актуален для пользователя — например, на сайтах социальных сетей (например, TikTok, Instagram, Twitter), а также на сайтах новостей или электронной коммерции ( например, Apple News, Nike.com). Каковы преимущества и недостатки бесконечной прокрутки?  

  С момента его изобретения были разработаны некоторые варианты классической бесконечной прокрутки (как описано выше). Один вариант требует, чтобы пользователь явно нажимал кнопку Загрузить еще или Посмотреть еще , чтобы увидеть больше контента, добавленного в нижнюю часть страницы. Другой вариант разбивает бесконечную прокрутку на страницы, которые служат ценными ориентирами для ориентации и позволяют пользователям быстро перемещаться по содержимому, поскольку они могут переходить с одной страницы на другую.

  Преимущества классической бесконечной прокрутки

  1. Сокращение перерывов. Возможно, самым большим преимуществом бесконечной прокрутки по сравнению с нумерацией страниц является то, что она сокращает количество прерываний для пользователя. Исследование, опубликованное в журнале Information Systems Journal, показало, что даже короткие перерывы (например, нажатие кнопки Далее для перехода на другую страницу для получения дополнительного контента) могут побудить пользователей на платформе социальной электронной коммерции изменить свою задачу. Хотя последствия перерывов могут различаться в зависимости от типа активности пользователя (например, он может быть менее значительным, если пользователи ищут определенный элемент или часть информации), сведение к минимуму перерывов важно для социальных сетей, развлекательных и новостных сайтов, поскольку это помогает создать беспроблемный опыт и побуждает пользователей оставаться вовлеченными.
  2. Снижение стоимости взаимодействия . Если страница загружает новые элементы непрерывно и быстро, и пользователям не приходится нажимать кнопку и ждать загрузки новой страницы, стоимость взаимодействия уменьшается. Более того, если пользователи хотят вернуться к элементам, которые они уже видели, им не нужно нажимать кнопку Назад и ждать загрузки предыдущей страницы — они могут просто прокрутить страницу вверх.
  3. Подходит для мобильных устройств. Рост популярности бесконечной прокрутки был связан с резким ростом числа мобильных устройств. Поскольку мобильные области просмотра невелики, пользователи уже активно используют прокрутку (если им есть что прокручивать), держа палец близко к экрану и готовый провести пальцем вниз.

  Проблемы удобства использования, вызванные бесконечной прокруткой

  Несмотря на описанные выше преимущества, бесконечная прокрутка имеет несколько недостатков, которые могут ухудшить работу пользователя:  

  • Проблемы с повторным поиском контента
  • Иллюзия полноты
  • Невозможность доступа к концу страницы
  • Проблемы доступности
  • Увеличение загрузки страницы
  • Низкая производительность SEO

  Сложность повторного поиска содержимого

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

  Это особенно мешает работе пользователей, когда веб-сайты  не сохраняют место пользователя в списке во время  pogo sticking . Часто пользователи нажимают на элемент в бесконечном списке или ленте, чтобы перейти на страницу сведений о нем, а когда они возвращаются, используя кнопку Назад , они оказываются вверху списка, и им приходится прокручивать вниз. полноэкранные и полноэкранные режимы уже просмотренного контента. Напротив, при нумерации страниц пользователи возвращаются на одну страницу контента. Даже если они вернутся в начало страницы, этот сокращенный набор элементов более управляем, чем на странице с бесконечной прокруткой.

  bmwusa.com :  Позиция в списке товаров не сохранялась, когда пользователь выбирал товар, а затем возвращался к списку товаров с помощью кнопки  Назад  . Вместо этого кнопка  Назад  переводила пользователя наверх страницы и давала ему трудоемкую задачу найти свою старую позицию в списке продуктов.

  Иллюзия полноты

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

  Miamifc.com:   Большое пустое пространство внизу страницы в сочетании с рекламой создавало иллюзию законченности. Пользователи могли подумать, что они дошли до конца страницы, хотя на самом деле ниже сгиба загружалось больше контента .

  Невозможно получить доступ к нижнему колонтитулу

  Бесконечная прокрутка (без Загрузить еще ) может сделать невозможным доступ к нижнему колонтитулу веб-сайта . Постоянный поток контента не позволяет пользователям получать полезную информацию, обычно размещенную в нижнем колонтитуле (например, контактную информацию, правила возврата).

  Nike.com: постоянный поток новинок не позволял пользователю получить доступ к разделу нижнего колонтитула.

  Проблемы доступности

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

  Однако в последние годы произошли положительные изменения в поддержке бесконечной прокрутки для пользователей с особыми потребностями. Например, роль «ленты» ARIA, представленная Консорциумом World Wide Web (W3C), позволяет программам чтения с экрана прокручивать ленту бесконечно прокручиваемого контента. Эта роль также позволяет пользователям клавиатуры переходить от бесконечной ленты к первому фокусируемому элементу, следующему за ней.

  Увеличенная загрузка страницы

  Сайты с бесконечной прокруткой часто загружаются дольше из-за бесконечного потока нового контента. Если сайты будут стараться поступать правильно и отслеживать местоположение пользователей на странице, пока пользователи будут выполнять pogo sticking (см. выше), тогда каждый раз, когда пользователь возвращается к списку, будет загружаться тонна контента.

  Низкая скорость обычно является проблемой для мобильных пользователей (из-за непостоянства подключения) или для любого пользователя в зоне с низкой пропускной способностью или с ограниченными тарифными планами.

  Некоторые компании, такие как Facebook, пытаются преодолеть эти проблемы с загрузкой страниц, запуская «облегченные» версии своих продуктов (например, Facebook lite и Instagram lite), которым для работы требуется меньше данных. Хотя это отличный подход к тому, чтобы сделать продукты доступными для более широкого круга пользователей, для небольших компаний может быть невозможно разработать дополнительную облегченную версию своего продукта.

  Низкая производительность SEO

  И последнее, но не менее важное:  бесконечная прокрутка может негативно повлиять на эффективность SEO вашего сайта.  Это связано с тем, что сканеры поисковых систем не всегда могут получить доступ ко всему содержимому, скрытому под первым разделом вашей страницы, а скорость страницы (важный фактор SEO) может снизиться из-за бесконечной прокрутки.

  Компромисс: бесконечная прокрутка с помощью кнопки

  Загрузить еще

  Чтобы избежать некоторых недостатков бесконечной прокрутки, не возвращаясь к традиционной нумерации страниц, многие сайты и приложения реализуют вариант подхода с бесконечной прокруткой —  бесконечная прокрутка с помощью кнопки Загрузить еще . Кнопки «Загрузить еще» в последнее время приобрели популярность, особенно на мобильных сайтах и ​​в приложениях. Этот подход используется не только на веб-сайтах электронной коммерции, но и на страницах результатов мобильного поиска Google.

  Asos.com: кнопка «Загрузить еще» давала пользователям возможность загружать дополнительные элементы. Этот подход удобен для пользователей в регионах с низкой пропускной способностью и дает всем пользователям легкий доступ к нижнему колонтитулу страницы. Указание того, сколько товаров уже было просмотрено, а также общее количество товаров, помогает пользователям ориентироваться на странице и является отличным примером того, как улучшить взаимодействие с пользователем.

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

  • Доступ к нижнему колонтитулу. Кнопка  Загрузить еще  останавливает постоянный поток нового контента и, таким образом, позволяет пользователям получить доступ к разделу нижнего колонтитула веб-сайта.
  • Иллюзия полноты. Кнопка  Загрузить еще  на видном месте в нижней части страницы является явным признаком того, что есть еще контент, который нужно открыть, и что пользователь еще не видел весь контент.
  • Низкая пропускная способность и ограниченные тарифные планы.   Кнопки «Загрузить больше» позволяют загружать меньше контента заранее. Это помогает пользователям с низкой пропускной способностью или ограниченными тарифными планами. Этот подход особенно полезен, когда пользователи контролируют количество контента, загружаемого каждый раз.

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

  Новая альтернатива: бесконечная прокрутка со встроенной нумерацией страниц

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

  Google.com :  На мобильной странице Покупки использовалась бесконечная прокрутка со встроенной нумерацией страниц. Номера страниц действуют как ориентиры, которые могут улучшить возможность повторного поиска и навигацию.

  Этот подход  может уменьшить некоторые проблемы с удобством использования, возникающие при классической бесконечной прокрутке –  , в частности:

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

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

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

  Подходит ли бесконечная прокрутка для вашего дизайна?

  Из-за проблем с удобством использования, которые может вызвать бесконечная прокрутка, мы не рекомендуем ее, когда пользователи захотят использовать содержимое страницы со списком для:

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

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

  Не существует решения (бесконечная прокрутка, разбиение на страницы, Загрузить еще или встроенное разбиение на страницы), которое было бы в целом превосходным и идеально подходило для любого веб-сайта.  Это всегда зависит от конкретных обстоятельств вашего веб-сайта и целей, которых хотят достичь ваши пользователи. Чтобы оценить, какое решение лучше всего подходит для вашего веб-сайта, рассмотрите преимущества и ограничения каждого из четырех вариантов. Вы должны задать себе такие вопросы, как:

  • Кто ваши пользователи?
  • Каковы цели ваших пользователей при посещении вашего сайта?
  • Какие устройства в основном используют ваши пользователи для доступа к вашему веб-сайту?
  • Имеются ли другие ограничивающие факторы (например, большая группа пользователей с низкой пропускной способностью или большое количество пользователей, нуждающихся в специальных возможностях)?

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

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

  Ссылки

  Ким, Дж. и др. 2016. Разбиение на страницы и прокрутка в мобильном веб-поиске. Материалы 25-й Международной конференции ACM по управлению информацией и знаниями. (2016).

  Шарма, С. и Мурано, П. 2020.  Оценка удобства использования типов прокрутки пользовательского веб-интерфейса. Первый понедельник. 25, 3 (2020).

  Чжан Ю. и др. 2019.  Как прерывания влияют на вклад пользователей в социальную коммерцию? Журнал информационных систем. 30, 3 (2019), 535-565.

  UX: бесконечная прокрутка против нумерации страниц | Ник Бабич

  Изображение предоставлено: smashingmagazine

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

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

  Бесконечная прокрутка
  Плюсы №1: Вовлечение пользователей и обнаружение контента

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

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

  Океан пинов Pinterest

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

  Новостная лента Facebook заставляет пользователя все больше и больше прокручивать страницу для обновления контента

  Плюсы №2: прокрутка лучше, чем нажатие

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

  Для щелчка/нажатия: для каждого обновления контента требуется дополнительное действие щелчка и время ожидания для загрузки страницы. Для прокрутки: одно действие прокрутки для обновления содержимого. Изображение предоставлено: gfycat

  Плюсы №3: Прокрутка полезна для мобильных устройств

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

  . Источник: Dribbble.0018 . Многочисленные исследования показали, что медленное время загрузки приводит к тому, что люди покидают ваш сайт или удаляют ваше приложение, что приводит к низким показателям конверсии. И это плохая новость для тех, кто использует бесконечную прокрутку. Чем больше пользователей прокручивают страницу вниз, тем больше контента должно загружаться на той же странице. В результате производительность страниц будет все больше замедляться .

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

  Минусы № 2: Поиск и расположение элементов

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

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

  Поисковый интерфейс Etsy с бесконечной прокруткой. Текущая версия имеет пагинацию.

  Недостатки № 3: Неуместная полоса прокрутки

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

  Полоса прокрутки должна отражать реальную длину страницы

  Минус № 4: Отсутствие нижнего колонтитула

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

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

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

  Facebook переместил все ссылки из нижнего колонтитула (например, «Юриспруденция», «Карьера») на правую боковую панель.

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

  Instagram использует кнопку «Загрузить еще», чтобы сделать нижний колонтитул доступным для пользователей.

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

  Пагинация
  Плюсы №1: Хорошая конверсия

  Пагинация хороша, когда пользователь ищет что-то конкретное в списке результатов, а не просто просматривает контент. «Прокрутка — это продолжение, а клик — это решение» (Джошуа Портер)

  Вы можете измерить преимущества нумерации страниц на примере поиска Google. Как пользователь, вы можете решить, сколько страниц результатов проверять.

  Данные результатов поиска Google
  Плюсы №2: Чувство контроля

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

  Кроме того, когда пользователи увидят общее количество результатов (конечно, если общий объем данных не бесконечен), они смогут оценить, сколько времени потребуется, чтобы найти то, что они действительно ищут.

  Плюсы № 3: Расположение элемента

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

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

  Пагинация хороша для сайтов и приложений электронной коммерции. Когда пользователи делают покупки в Интернете, они хотят иметь возможность вернуться туда, где они остановились, и продолжить покупки.

  Сайт MR Porter использует разбиение на страницы для элементов

  Минусы: Дополнительные действия

  Чтобы перейти на следующую страницу в разбиении на страницы, пользователь должен найти цель ссылки (например, «Далее»), навести на нее указатель мыши, щелкнуть по ней и дождитесь загрузки новой страницы.

  Нажатие на контент

  Основная проблема здесь заключается в том, что большинство сайтов показывают пользователям очень ограниченный контент на одной странице (т.е. 10-20 элементов на странице). Делая ваши страницы длиннее без ущерба для скорости загрузки, пользователи будут получать больше контента на странице, и им не нужно будет так часто нажимать или нажимать кнопку разбивки на страницы.

  Есть только несколько случаев, когда бесконечная прокрутка эффективна. Он лучше всего подходит для сайтов и приложений, которые представляют собой больших потоков пользовательского контента (Twitter, Facebook, Pinterest, Instagram). Пагинация, с другой стороны, хорошо подходит для целевых сайтов и приложений, где пользователи ищут что-то конкретное.

  Тип содержимого также влияет на выбор метода просмотра. У вас больше визуальных эффектов, чем текста? Продукты Google являются хорошей иллюстрацией этого момента. Google Images использует бесконечную прокрутку, потому что пользователи могут сканировать и обрабатывать изображения гораздо быстрее, чем текст. Чтение результатов поиска занимает гораздо больше времени. Именно по этой причине их результаты поиска Google по-прежнему используют более традиционную технику разбиения на страницы.

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

  Спасибо!

  Подпишитесь на UX Planet: Twitter | Facebook

  Первоначально опубликовано на babich.biz

  Learn UX Design

  Пройдите все наши онлайн-курсы. Внесите фиксированную плату Получите признанные в отрасли сертификаты о прохождении курса (см. пример) Самостоятельный темп: никогда…

  www.interaction-design.org

  Этот пост содержит партнерские ссылки

  Эффект бесконечной прокрутки — Как дизайн может взломать ваш мозг | by Josep Ferrer

  И почему технологические компании хотят привлечь ваше внимание

  Изображение Keith Lobo на Pexels

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

  Теперь вы можете проверить следующие истории о модели крючка и Ваш личный игровой автомат .

  Возможно, вы не знаете, что такое бесконечная прокрутка. Но вы, безусловно, использовали его — ежедневно — как и везде. Вы заканчиваете серию на Netflix, и тут же начинается следующая. Вы смотрите одно видео в Tik Tok, а следующее выскакивает прежде, чем вы успеваете его закрыть. Вы слушаете одну песню на Spotify — а следующую… уже знаете. Бесконечная прокрутка здесь, чтобы заблокировать любую малейшую возможность сознательно подумать о том, хотите ли вы по-прежнему потреблять какой-либо контент. Вы открыли Instagram только для того, чтобы проверить, что опубликовал ваш друг — О боже… полчаса уже прошло — или, может быть, вы попали в кроличью нору видео с котятами и потеряли час — или три.

  В век цифровых технологий социальные сети становятся все более важной частью нашей повседневной жизни. Он произвел революцию в общении до такой степени, что теперь он является нашим предпочтительным средством повседневного общения. Социальные сети полностью изменили наше современное общество. От первых запусков едва намеченных цифровых сервисов, таких как Messenger или Facebook, до их современных преемников произошел значительный скачок в качестве. Цифровые услуги были улучшены и усовершенствованы в каждой отдельной функции, которую только можно себе представить, — среди прочего, в возможностях подключения, скорости, дизайне или полезности. Однако большинство из них подвели нас — людей.

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

  Infinite Scroll — один из самых удачных — никогда.

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

  Бесконечная прокрутка — это метод, который загружает больше контента по мере того, как пользователь прокручивает страницу вниз, создавая впечатление, что она бесконечна. Он используется некоторыми современными цифровыми и популярными сервисами, такими как Twitter, Tik Tok или Instagram. Это позволяет вам продолжать прокрутку до бесконечности и обычно называется бесконечной прокруткой как 9.0017 он постоянно загружает все больше и больше содержимого t — и никогда не останавливается.

  Gif от Claudio Scotto на Dribble

  Infinite Scroll — Origins

  Infinite Scroll был впервые разработан и разработан Азой Раскин в 2006 году, когда он работал в Humanized, небольшой компании, занимающейся пользовательскими интерфейсами. Оригинальную статью о его реализации все еще можно найти здесь. Позже он был доработан и доработан Полом Айришем в плагин JavaScript. Идея состояла в том, чтобы заменить макет, известный как нумерация страниц, который является традиционным подходом, разбивающим большие списки на несколько меньших страниц, обычно пронумерованных, более интуитивно понятным. Эта разбивка на страницы обычно позволяет пользователям выбирать индивидуальный и конкретный контент — однако эта концепция довольно утомительна — поскольку заставляет пользователей слишком много думать о том, что им смотреть. На самом деле намерением Раскина было еще больше очеловечить интерфейсы и упростить их использование с Infinite Scroll 9.0025 — улучшение пользовательского опыта .

  Image by smashingmagazine

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

  Он никогда не предвидел последствий этого изменения.

  Разбивка на страницы была способом дать пользователям понять, сколько контента они просмотрели. Расширенные возможности Бесконечного свитка полностью противоположны — он позволяет пользователей потребляют цифровую услугу, не осознавая, сколько контента они уже потребляют. А это одна из золотых черт этого совершенно нового Бесконечного Свитка. Точно так же, как в казино не пропускают естественный свет, современные социальные сети предпочитают не напоминать вам о том, что вне экрана существует жизнь. Раскин был показан в «Социальной дилемме» Netflix, в которой обсуждается, как компании, работающие в социальных сетях, пытаются настроить свои алгоритмы , чтобы выжать больше вовлеченности из своих пользователей . Как говорит Аза Раскин, «, если вы не дадите своему мозгу время догнать ваши импульсы, вы просто продолжите прокручивать вниз».

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

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

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

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

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

  В общем и целом, Infinite Scroll изначально задумывался как огромный скачок вперед в пользовательском опыте — и в итоге превратился в захватывающую функцию, которая значительно увеличила вовлеченность пользователей — за счет их благополучия. Это прекрасно показывает, что проектирование пользовательского опыта сопряжено с большой ответственностью — влияние на время и поведение людей — это не то, к чему стоит относиться легкомысленно. Бесконечная прокрутка по-прежнему широко используется во многих приложениях, хотя доказано, что в лучшем случае она вызывает привыкание, а в худшем — вредна. Следовательно, компании, которые используют такого рода методы для удержания внимания пользователей, должны нести за это ответственность и предлагать эффективные способы и инструменты для повышения осведомленности среди них.

  Например, и IOS, и Android предприняли некоторые шаги в этом направлении, выпустив Use Tim e и Digital Wellbeing соответственно, которые позволяют пользователям управлять автомобилем и понимать, сколько времени они проводят, приклеившись к своим телефонам. Однако без предварительного информирования пользователя о проблеме эти улучшения не очень помогают.

  Вот почему в следующий раз, когда вы обнаружите, что застряли в цикле цифрового потребления — будь то Instagram, Tik Tok или что-то еще — просто постарайтесь осознавать количество времени, которое вы тратите. Попробуйте спросить себя, стоит ли это того — или это было вашим первоначальным намерением. Если ответ «Нет», закройте приложение и попытайтесь остановить цикл. Проявив немного внимательности и самоконтроля, вы сможете вырваться из хватки Бесконечного свитка и вернуть свое время и внимание.

  Не стесняйтесь делиться своими мыслями и опытом в комментариях! ✨

  Вы можете подписаться на мой Medium Newsletter , чтобы следить за обновлениями и получать мой контент . Обещаю, он будет уникальным!

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

  No related posts.