اسکرول بینهایت (Infinite scrolling - Endless scrolling) نظیر صفحه‌ی جستجوی عکس در گوگل یا پینترنست به کاربر اجازه می‌دهد که تنها با اسکرول کردن محتوای بیشتری ببیند. هر چند این مدل، نسل جدید صفحه‌بندی (Pagination) به نظر می‌رسد اما مناسب هر وبسایتی نیست. اگر بود گوگل در جستجوی متنی نیز مطابق جستجوی تصویری از آن استفاده می‌کرد.
در ادامه می‌خواهیم به مزایا و معایب این دو بپردازیم. بدیهی است که این مزایا و معایب در تقابل این دو گزینه نوشته شده است و در نتیجه مزیت اسکرول بینهایت عیب صفحه‌بندی است و بلعکس.
این مقاله برداشت آزاد مقاله UX: Infinite Scrolling vs. Pagination است.
اسکرول بینهایت به کاربران اجازه می‌دهد تنها با اسکرول کردن به حجم زیادی از دیتا دسترسی داشته باشند.
استفاده از اسکرول بینهایت باعث درگیر شدن بیشتر کاربر با محتوا می‌شود و در نتیجه کاربر بیشتر در صفحه باقی بماند. با فراگیر شدن شبکه‌های اجتماعی حجم زیادی از اطلاعات برای کشف شدن وجود دارد که اسکرول بینهایت دسترسی به این اقیانوس اطلاعات را با حذف زمان بارگذاری مجدد صفحه ممکن می‌کند.
زمانی که کاربر به دنبال چیز به خصوصی نیست، اسکرول بینهایت بهترین گزینه برای اکتشاف اطلاعات است.
همانطور که در مقاله‌ی 8 خطای شناختی معروف در طراحی Progress Bar در توضیح اثر زی‌گارنیک (Zeigarnik Effect) توضیح دادم افراد برای انجام کارهای ناتمام انگیزه‌ی بیشتری دارند. تصاویر سایت پینترست همیشه به نوعی چینش شده‌اند که در یک خط افقی تمام نشوند، در نتیجه کاربر همیشه با یک عکس ناتمام مواجه است که باعث می‌شود به اسکرول کردن ادامه دهد.
لغزنده‌ی اسکرول موس و صفحه‌ی لمسی موبایل تجربه راحتر و سریعتری نسبت به کلیک کردن برای اکتشاف اطلاعات فراهم می‌کنند.
کلیک کردن تابع قانون Fitts است و از آنجایی که Pagination عموما در پایین سایت و دور از نشانگر موس قرار دارد و نیز سایز کوچیک‌تری دارد کلیک کردن آن سخت‌تر و زمان‌بر تر است.
در حال حاضر بیش از 70% اینترنت گردی به وسیله موبایل انجام می‌شود و تجربه استفاده از اینستاگرام، Mental Model افراد برای پیمایش صفحات بی‌انتها را سازگار کرده است.
از طرفی کاربر برای پیمایش بین صفحات در Pagination محدود به قسمت پایینی موبایل است اما برای اسکرول کردن می‌تواند از کل صفحه استفاده کند.
از طرفی مطابق تصویر بالا هر چقدر به سمت گوشه‌ها حرکت کنیم دقت لمس به خصوص در افراد با انگشت بزرگتر کمتر می‌شود.
بدیهی است که سرعت بارگذاری صفحات در تجربه کاربری تاثیر بسیار زیادی دارد. تحقیقات بسیاری نشان داده‌اند که سرعت کم صفحات باعث ترک وبسایت و حتی حذف اپلیکیشن می‌شود.
در Endless scrolling با هر بار اسکرول، دیتای بیشتر در صفحه بارگذاری شده که باعث کاهش عملکرد و افزایش منابع سیستم کاربر می‌شود، به خصوص اگر محتوا شامل تعداد زیادی عکس و ویدئو باشد. در نتیجه تجربه بدی را برای کاربر رقم می‌زند.
در مقاله‌ی اصول طراحی Splash Screen اشاره کردم که اگر کاربر باید منتظر دریافت اطلاعات باشد حتما از Indicator یا Skeleton screens (مشابه صفحه‌ی اول ویرگول) استفاده کنید.
مشکل دیگر در اسکرول بی‌پایان، این است که وقتی کاربر تا قسمت خاصی پیشرفته است امکان ذخیره آن برای آینده را ندارد و سری بعدی که سر می‌زند باید مجددا اسکرول کند تا به نقطه‌ی قبلی برسد و از آنجا پیمایش اطلاعات جدید را از سر بگیرد.
در سال 2012 سایت Etsy از مدل پیمایش خود را به اسکرول بینهایت تغییر داد و خیلی زود متوجه شد که مدل جدید کارایی کمتری نسبت به صفحه‌بندی دارد و کاربران از جستجو کمتر استفاده می‌کردند.
بر اساس مقاله‌ی Dmitry Fadeyev کاربران به لیست نتایج جستجو برمی‌گردند تا اقلامی را که مشاهده کرده‌اند را با آنچه که لیست دیگری کشف کرده‌اند مقایسه کنند و ذات اسکرول بینهایت با این موضوع در تضاد است.
به عنوان یک راهکار غیر مستقیم می‌توان مشابه پینترست امکان نشان دار کردن محتوای مورد علاقه را برای رجوع مجدد فراهم کرد.
فرض کنید مشغول دیدن یک لیست ناتمام هستید و یکی از گزینه‌های لیست شما را به کلیک کردن جذب می‌کند. با کلیک وارد صفحه‌ی مختص به آن محتوا می‌شوید. پس از اتمام کار اگر دکمه‌ی برگشت را بزنید مجددا به بالای لیست می‌روید و باید دوباره تا نقطه‌ی خروج اسکرول کنید تا بتوانید ادامه‌ی آن را لیست را ببینید.
سایت Flickr با ذخیره کردن مکان اسکرول کاربر این مشکل را حل کرده است. همچنین می‌توان هر لینک را در صفحه‌ی جدیدی بارگذاری کرد که پیمایش فعلی باقی بماند.
مشکل دیگر اسکرول بینهایت این است که Scroll Bar مرورگر، میزان واقعی داده‌ی موجود را نمایش نمی‌دهد. و هر زمان که به نزدیکی انتهای صفحه می‌رسیم دیتای بیشتری نمایش داده می‌شود و نوار اسکرول مجددا تغییر وضعیت می‌دهد.
در مقاله‌ی 8 خطای شناختی معروف در طراحی Progress Bar توضیح دادم افراد تمایل به کامل کردن کارها دارند و نوار اسکرول بی‌پایان مانع آزادسازی اندورفین و کسب رضایت می‌شود. این موضوع در اپلیکیشن‌ها با حذف صورت مسئله حل شده است.
البته در آن مقاله من باب اثر نزدیک شدن به هدف و تجسم هدف هم صحبت کردم و به نظر می‌رسد این ضعف مرورگرها مطابق این 2 اثر همچنان می‌تواند علاقه به پیمایش در صفحه را افزایش دهد.
هنگامی که از پیمایش بینهایت استفاده می‌کنید، بهتر است که Navigation bar شناور و همیشه قابل مشاهده باشد. اگر نوار ناوبری خارج از دسترس باشد، کاربران زمانی که در انتهای لیست هستند باید تمام مسیر را به بالا بازگردند.
از آنجا که صفحه نمایش موبایل‌ها کوچک است، نمایش نوار ناوبری می‌تواند بخش نسبتا زیادی از صفحه را همواره اشغال کند. برای این موضوع نیز می‌توان مانند اپلیکیشن فیسبوک زمانی که کاربر برای محتوای جدید پیمایش می‌کند، آن را پنهان کرد و به محض پیمایش به بالا مجددا آن را نمایش داد.
پاورقی‌ها حاوی محتوایی هستند که کاربر گاهی اوقات نیاز دارد. اگر کاربران نتوانند چیزی که می‌خواهند را پیدا کنند اغلب به آنجا می‌روند. اما اسکرول بینهایت باعث می‌شود به محض اینکه کاربر به پایین می‌رسد، دوباره دیتا بارگذاری شده و فوتر مجددا از دسترس خارج می‌شود.
البته این موضوع هم راهکاری دارد. مثلا ویرگول فوتر خود را در Side Bar قرار داده است.
برای من دیدن آیکون HEAP در پایین صفحه گاهی گیمیفیکیشنی ایجاد می‌کند که بیشتر اسکرول کنم.
همچنین می‌توان footer را در پایین صفحه شناور کرد و یا مشابه نسخه‌ی قبلی اینستاگرام از گزینه‌ی نمایش بیشتر در پایین صفحه استفاده کرد که از طرفی این موضوع در تضاد با اسکرول کردن بهتر از کلیک‌کردن است.
در زمانی که این مقاله نوشته شده است این دکمه حذف شده است و این مشکل در نسخه‌ی تحت وب اینستاگرام وجود دارد.
صفحه‌بندی یک الگوی رابط کاربری است که محتوا را در صفحات جداگانه تقسیم می‌کند. صفحه‌ی جستجوی متنی گوگل مثال خوبی برای این مدل است.
صفحه‌بندی، مناسب زمانی است که کاربر برای چیز خاصی در لیست نتایج جستجو می‌کند، نه فقط اسکن چشمی و مصرف جریان اطلاعات.
زمانی که کاربران تعداد کل نتایج را مشاهده می‌کنند (البته زمانی که مقدار کل داده‌ها بینهایت نیست)، قادرخواهند بود مقدار زمان لازم برای پیدا کردن موضوع مورد نظر خود را تخمین بزنند و احتمال بیشتری وجود دارد تا حصول به نتیجه در وبسایت باقی بمانند.
در مقاله‌ی 10 خطای شناختی اثرگذار در طراحی Pricing Page من باب این موضوع صحبت کردم.
پیمایش بینهایت مثل یک بازی بی پایان است. مهم نیست که تا چه حد به پیشروی ادامه دهید، هرگز به انتها نخواهید رسید. هنگامی که کاربران تعداد نتایج موجود را می‌دانند، می‌توانند تصمیم‌گیری دقیقتری انجام دهند.
با توجه به تحقیق روانشناسی David Kieras در تعامل انسان و کامپیوتر، رسیدن به یک نقطه پایانی احساس کنترل را فراهم می‌کند.
هر چقدر هزینه‌ی تعامل کمتری (کلیک کمتر) به کاربر تحمیل کنیم تجربه‌ی بهتری خواهد داشت. توضیح دادیم که اسکرول از کلیک راحت‌تر است در نتیجه Pagination به این دلیل که Interaction cost بیشتری برای کاربر ایجاد می‌کند در موضع ضعف است.
اگر که تصمیم به استفاده از صفحه‌بندی گرفیتم باید تعداد محتوای صفحه را در حد بهینه‌ای قرار دهیم که کاربر برای دیدن محتوا نیاز به کلیک کمتری داشته باشد.
همچنین می‌توان تعداد محتوای نمایش داده شده در هر صفحه را به انتخاب کاربر واگذار کنید.
فارغ از تمامی موارد عمومی، مشکل بزرگتری نیز در زبان فارسی وجود دارد. در مقاله‌ی چه پترن‌هایی در زبان فارسی قرینه می‌شوند؟ توضیح دادم که چشم در وب‌سایت‌های فارسی، صفحه از راست به چپ رصد می‌کند.
در نتیجه در صفحه حرکت رو به جلو به سمت چپ برداشت می‌شود. با این توضیح تصویر سمت راست درست‌تر به نظر می‌رسد.
از طرفی اعداد در زبان انگلیسی از چپ به راست نوشته و خوانده می‌شوند و حرکت رو به جلو به سمت راست است.
همچنین در مدل ذهنی افرد، پیمایش رو به جلو به سمت راست است. به عنوان مثال زمانی که کنار خیابان ایستاده‌ایم و یا منتظر مترو هستیم، ماشین‌های رو به جلو، به سمت راست ما حرکت می‌کنند برای همین در خیابان‌های یکطرفه که ماشین‌ها در خلاف جهت ذهنی ما حرکت می‌کنند حس غریبی داریم.
با این توضیحات و مقاله‌ی چه پترن‌هایی در زبان فارسی قرینه می‌شوند؟ به نظر گزینه‌ی سمت چپ منطقی‌تر است.
نظر شما چیست؟
اگر به طراحی رابط کاربری UI علاقه‌مندید پیشنهاد می‌کنم دوره‌ی UI Weekend را از دست ندهید.
انتخاب هر یک از این دو گزینه وابسته به زمینه‌ی وبسایت مورد طراحی و نحوه‌ی ارائه‌ی محتوا دارد. مثال‌های موفق زیادی از اسکرول بینهایت وجود ندارد. به طور کلی، اسکرول بینهایت برای چیزی شبیه توییتر کار می‌کند که کاربران از یک جریان بی‌پایان داده‌ها در زمان واقعی استفاده می‌کنند، بدون اینکه به دنبال چیزی خاص باشند. در حالی که رابط صفحه‌بندی برای صفحات نتایج جستجو که افراد به دنبال یک آیتم خاص هستند مفید است.
تجربه Google یک مثال خوب برای این نکته است. Google Images از اسکرول نامحدود استفاده می‌کند، زیرا کاربران قادر به اسکن و پردازش تصاویر بسیار سریعتر از متن هستند. خواندن یک نتیجه‌ی جستجو بسیار طولانی‌تر است. به همین دلیل است که نتایج جستجوی متنی گوگل هنوز با تکنیک صفحه‌بندی سنتی نمایش داده می‌شود.
