در زمان‌های قبل‌تر که طراحی سایت و فضای مجازی به این شکل گسترده و پیچیده نبود اکثر سایت‌ها تک‌صفحه‌ای بودند و مطالب در یک صفحه خلاصه می‌شد ولی باگذشت زمان و گسترده شدن فضای وب، مطالبی که در سایت‌ها منتشر می‌شد افزایش یافت. در نتیجه مطالب در یک صفحه خلاصه نمیشد و ما نیاز داشتیم به قابلیتی به نام اسکرول که بتوان صفحه را به پایین کشید و ادامه مطلب منتشر شده را مشاهده کرد.
اسکرول‌کردن فقط منحصربه فضای وب نیست بلکه شما هنگام کار با یک نرم‌افزار هم وقتی به پایین صفحه می‌روید در واقع دارید اسکرول می‌کنید.
کاربرد اسکرول در طراحی سایت
ابتدا بیایید اسکرول را معنی کنیم… اسکرول یعنی هنگامی که بازدیدکننده به‌وسیله غلتک وسط موس، دکمه‌های کیبورد و در تلفن‌های همراه با حرکت انگشت به‌صورت عمودی صفحه را بالا و پایین می‌کند اسکرول‌کردن می‌گویند.
افزایش سرعت وبسایت و بهینه‌شدن سئو
در طراحی سایت یک تکنولوژی بنام Lazy loading وجود دارد که نقش اصلی آن را اسکرول ایفا می‌کند. باتوجه به وجود اسکرول وقتی کاربر برای اولین‌بار وبسایت را باز می‌کند نیاز نیست که تمامی مطالب درج شده در وبسایت باز شود و همین امر افزایش سرعت را به همراه دارد. وقتی سایت شما از سرعت خوب برخوردار باشد قطعاً تجربه لذت بخشی را به کاربر می‌دهد که همین امر باعث میشود که سئو سایت شما بالاتر رود.
افزایش تعامل با کاربر
وقتی از اسکرول استفاده می‌کنید، کاربر برای مشاهده ادامه مطالب باید صفحه را به بالا یا پایین بکشد و همین امر باعث افزایش تعامل کاربر با وبسایت شما میشود و قطعاً این افزایش تعامل موجب بهبود تجربه کاربری (UX) خواهد شد درصورتی که اگر تمامی مطالب در یک صفحه جا دهید نه تنها سایت شما شلوغ میشود بلکه از تجربه کاربری خوبی هم برخوردار نخواهد بود.
نکات مهم در استفاده از اسکرول برای وبسایت
نکته‌ای که حائز اهمیت است این است که صفحات شما با وجود اسکرول نباید بیش از اندازه طولانی باشد و مطالب گسترده باشد چون برای کاربر احساس پیچیدگی و ناخوشایندی را به وجود می‌آورد.
حتماً برای شما هم پیش‌آمده که وقتی وارد یک وبسایتی شده‌اید بعد از تعامل با آن متوجه میشید که مطالب هر صفحه سایت زیاد است و شما به مقدار زیادی به پایین اسکرول کردید، حال نیاز به نوار بالایی وبسایت یا همان منو سایت دارید. در اینجا دو راهکار استفاده میشود:
- شما می‌توانید منوی بالایی وبسایت را طوری طراحی کنید که با اسکرول‌کردن ثابت بماند و به‌صورت چسبنده به بالای سایت شما بچسبد به‌این‌ترتیب کاربر هرچقدر به پایین اسکرول کند منوی بالایی هم به پایین منتقل میشود.
- استفاده از دکمه انتقال‌دهنده: در بعضی از وب‌سایت‌ها از جمله پرشیا وب زمانی که شما به سمت پایین اسکرول می‌کنید دکمه‌ای باحالت فلش مانند به سمت بالا در دسترتان قرار می‌گیرد که شما می‌توانید با کلیک بر روی این دکمه به قسمت بالایی وبسایت منتقل شوید.
حل مشکل طولانی شدن اسکرول سایت
برای اینکه طول صفحات زیاد نشود و سرعت لود وبسایت هم افزایش پیدا کند معمولاً وب‌سایت‌ها از ابزاری به نام Pagination استفاده می‌کنند که اصطلاحاً به آن صفحه‌بندی می‌گویند به‌این‌ترتیب که در پایین مطالب اعدادی قرار می‌گیرد که کاربر با کلیک بر روی آن میتواند محصولات دیگر را ببیند با استفاده از این روش می‌توانیم تمام محصولات را بدون کاهش سرعت وبسایت وارد کنیم و کاربر به‌راحتی مشاهده کند.
انواع اسکرول
۱- اسکرول نامحدود (Infinite Scroll)
در اسکرول نامحدود یا Infinite Scroll دیگر خبری از صفحه‌بندی (Pagination) نیست و نیازی نیست که کاربر بر روی دکمه‌های انتهای هر مطلب کلیک کند تا به صفحه بعدی منتقل شود بلکه مطالب به‌گونه‌ای بارگذاری می‌شوند که وقتی کاربر به انتهای صفحه می‌رسد به طور اتومات تعدادی از محصولات به انتهای آن اضافه میشود.
اخیراً گوگل نیز در صفحات نتایج خود به روش عمل می‌کند و وقتی به انتهای صفحه رسیدید بدون آنکه کلیکی کنید نتایج جدید ظاهر میشود.
مزیت اسکرول نامحدود
کاربردی که این نوع اسکرول دارد باعث میشود که کاربر زودتر به هدف خود برسد و محصول خود را راحت‌تر پیدا کند مخصوصاً در تلفن‌های همراه، کاربرانی که با تلفن همراه وارد سایت شما می‌شوند بیشتر علاقه‌مند به اسکرول‌کردن هستند تا اینکه روی دکمه‌ها کلیک کنند پس این نوع طراحی اسکرول میتواند به بازدیدکنندگان شما تجربه کاربری خوبی ارائه دهد.
همچنین وقتی کاربر به انتهای صفحه می‌رسد و به طور خودکار مطالب بارگذاری می‌شوند معمولاً برایش جالب است تا ادامه محصولات را هم ببیند و بررسی کند ولی وقتی از دکمه استفاده میکنیم چون کاربر باید مقدار زمانی را صرف لود مجدد وبسایت کند در نتیجه ممکن است هنگام انتقال به صفحات دیگر کاربر از وبسایت ما خارج شود و نرخ پرش را افزایش دهد.
معایب اسکرول نامحدود
کاهش نرخ دسترسی به محصولات
یکی از معایبی که می‌توان نام برد این است که گاهی خریدار به یک محصول علاقه‌مند میشود ولی باز هم دوست دارد مابقی محصولات را ببیند و وقتی کاربر به ادامه راه می‌پردازد در این نوع اسکرول ممکن است که محصول را که در بین نتایج پسندیده بود را گم کند و نتواند آن را سفارش دهد. در واقع نمی‌داند که محصول مورد علاقه‌اش در کدام صفحه بود.
دسترسی نداشتن به فوتر سایت
دسترسی‌نداشتن به انتهای سایت نیز مشکل بزرگی است زیرا اکثر کاربران عادت کرده‌اند برای مشاهده اطلاعات تماس، آدرس و یا مجوزهای وبسایت مثل اینماد به قسمت فوتر مراجعه کنند و وقتی این قسمت در دسترس نباشد، حس خوبی را به بازدیدکننده نمی‌دهد.
۲- اسکرول پارالاکس (Parallax)
هنگام استفاده از این افکت محتوای پس‌زمینه نسبت به متن اصلی با سرعت متفاوتی حرکت می‌کنند و همین امر یک حس ۲ بعدی خوشایند به کاربر دست می‌دهد و باعث جلب‌توجه و علاقه مندی او به اسکرول کردن میشود.
این نوع اسکرول بیشتر برای سایت‌های رزومه شخصی، فروشگاه‌هایی با محصولات محدود و سازمان‌های دولتی استفاده میشود.
مزایای اسکرول پارالاکاس
- باعث افزایش جلب‌توجه کاربر میشود و این‌گونه محصولات بیشتری از وبسایت شما مشاهده میشود.
- ذهن بازدیدکننده را درگیر جلوه‌های بصری خود می‌کند و حس دوبعدی بودن وبسایت را می‌دهد.
- استفاده خلاقانه این روش نسبت به اسکرول ساده سایت شما را متمایز می‌کند.
- معمولا در سایت‌های مربوط به رزومه به دلیل تک صفحه بودن آن، این نوع اسکرول میتواند زیبایی بصری خوبی را ارائه دهد.
معایب اسکرول پارالاکاس
شاید از مزایای آن شگفت‌زده شده باشید ولی یک عیب بزرگی که این روش دارد تک‌صفحه‌ای بودن آن است که وقتی سایت شما تک‌صفحه‌ای باشد عیب خود را به نمایش میگذارد که عبارت است از:
- کاهش سرعت وبسایت به دلیل تک‌صفحه‌ای بودن و زیاد بودن مطالب و تصاویر و… که گاهی این کاهش سرعت موجب خروج کاربر از وبسایت شما میشود.
۳- اسکرول هایجک (Scroll Hijacking)
وقتی شما در یک وبسایت معمولی از اسکرول استفاده می‌کنید با هر بار تکان‌دادن غلتک موس به یک اندازه خاصی جابه‌جا می‌شوید و حساسیت یکسانی را تجربه می‌کنید. در اسکرول Hijack با کوچک‌ترین لغزش به قسمت زیادی جابه‌جا می‌شوید.
این نوع اسکرول معمولاً در سایت‌هایی با انیمیشن، ویدئو و تصاویر زیاد کاربرد دارد و استفاده میشود و در سایت‌های معمولی استفاده‌ای ندارد.
چه کنیم تا کاربر به اسکرول کردن و خواندن ادامه سایتمان تشویق شود؟
درج محتوای اصلی در ابتدای صفحه
اگر دقت کرده باشید به‌محض اینکه هر وبسایتی باز میشود شما به‌صورت ناخودآگاه به سمت پایین اسکرول می‌کنید. اگر مطالب اولیه جذاب باشند و بتواند ذهن کاربر را درگیر کند قطعاً کاربر به مسیر و بازدید مطالب یا محصولات تشویق میشود؛ اما اگر محتوای اولیه جذاب نباشد کاربر از سایت شما خارج میشود و این‌گونه نرخ پرش سایت افزایش پیدا می‌کند.
همچنین محتواهای اول صفحه نیز تأثیر بسیار زیادی بر سئو وبسایت شما دارد به‌طوری‌که خزنده‌های گوگل بیشتر به این مطالب توجه می‌کنند و اگر از مطالب کاربردی استفاده کرده باشید بهبود سئو را به همراه دارد.
استفاده از آیکون‌ها
می‌توانید در قسمت بالایی وبسایت خود از آیکون‌ها و فلش‌هایی به‌صورت انیمیشن و متحرک استفاده کنید تا کاربر را راهنمایی کنید که اسکرول کند و به سمت ادامه سایت پیش برود. این روش شاید ساده باشد ولی استفاده از آیکون‌های جذاب میتواند تأثیر زیادی داشته باشد.
استفاده از انیمیشن‌های اسکرول مثل پارالاکاس
استفاده از این افکت به کاربر احساس کنجکاوی می‌دهد و هرچقدر که پایین‌تر می‌رود چینش المان‌ها تغییر می‌کند و جلوه‌های بصری جدیدی را مشاهده می‌کند همین امر حس کنجکاوی کاربر را تحریک کرده و باعث افزایش اسکرولینگ میشود.
