طراحی صفحه بندی برای سایت

طراحی صفحه بندی برای سایت

اصول طراحی صفحه بندی سایت

یکی از المانای شناخته شده و عادی در طراحی سایت، صفحه بندی یا همون Paginationه که در صفحات مربوط به دسته بندی، برچسب، فروشگاه و … کاربرد زیادی داره. میشه گفت تقریبا ۹۰ درصد وب سایتا در بخشی از خود صفحه بندی رو استفاده کردن؛ ولی چقدر به اصول طراحی اون و افزایش کاربری توجه داشتن؟ در این مقاله می خوایم مهمترین نکات در طراحی یه صفحه بندی مناسب رو مرور کنیم. ممکنه بعضی از اونا روشن و ساده بنظر برسن ولی مطمئن باشین که در فضای وب، سایتای پرطرفداری هستن که همین اصول ساده رو ندیده گرفتن.

صفحه بندی در سایت چیه؟

زمانیکه محتوای یه صفحه طولانی میشه طراح سایت تلاش میکنه که اونو در دو یا چند صفحه در دسترس کاربر بذاره، این روش هم موجب میشه که صفحات سایت زیادتر از اندازه طولانی نشن و هم حجم کلی صفحه رو کم می کنه. فرض کنین که تموم اجناس یه فروشگاه اینترنتی تو یه صفحه نشون داده شن. در این صورت ممکنه زمان بسیار زیادی واسه نمایش کامل صفحه لازم باشه و یا کاربر هنگام اسکرول کردن در صفحه میان اجناس سردرگم شه.

از طرف دیگه صفحه بندی سایت واسه گوگل و در نتیجه سئو هم چیزی مهم و حیاتیه. گوگل صفحاتی رو دوست داره که ۱۰ نتیجه مربوط به جستجوی کاربر رو در اختیار اون قرار می ده؛ دقیقا همونطور که سیستم جستجوی خود بکار گرفته.

۸ نکته در طراحی صفحه بندی سایت

در ادامه ۸ نکته مهم واسه طراحی صفحه بندی رو جمع آوری کردیم. دقت کنین که این موارد بدون در نظر گرفتن خلاقیت و براساس اصول تجربه کاربری بیان شدن، اگه شما ایده جدیدی واسه طراحی دکمه های Pagination دارین حتما ازش استفاده کنین.

خلاقیت

۱- محتوای صفحه زیادتر از اندازه کوتاه نباشه

صفحات وب مثل صفحه یه کتاب یا مجله محدود نیستن، کاربران میتونن با اسکرول کردن، مطالب بیشتری ببینن و به این رفتار در فضای وب عادت کردن. تعداد نمایش یافتهات یه صفحه دسته بندی یا فروشگاه بستگی به طراحی شما و نوع اطلاعات ارائه شده داره. معمولا صفحات وب به شکلی طراحی می شن که کاربر دست کم به اندازه ارتفاع صفحه نمایشگر خود فضای اسکرول در اختیار داشته باشه.

کوتاه بودن صفحات ممکنه کاربر رو به این باور برسونه که محتوای سایت شما محدوده. هم اینکه از نظر سئو صفحات با محتوای کم شانس کمتری واسه کسب جایگاه در یافته های جستجوی گوگل دارن.

۲- دکمه های صفحه بندی ریز نباشه

بعضی سایتا واسه نمایش تعداد صفحات بیشتر و یا ایجاد همخوانی با بقیه بخشای سایت از دکمه های ظریف و کوچیک در طراحی صفحه بندی استفاده میکنن. ممکنه این روش زیبایی سایت شما رو زیاد کنه ولی موجب کاهش کارایی اون می شه. این موارد وقتی خود رو بیشتر نمایان میکنه که کاربران از گوشی موبایل واسه نمایش سایت شما استفاده کنن. تکمها در گوشی موبایل باید دست کم به اندازه یه لمس انگشت باشن.

موبایل

من کجا هستم؟ زمانیکه کاربر از صفحه بندی سایت شما استفاده میکنه باید بدونه که الان در چه صفحه ای قرار گرفته. غلطه که نگهداشتن شماره صفحه رو به خود کاربر بسپاریم و توقع داشته باشیم که با تموم  حواس خود از سایت استفاده کنه.

۴- تعداد نمایش صفحات رو محدود کنین

در بعضی سایتای دانلود مشاهده میکنیم که شماره صفحات تا اعداد بسیار بالا مثل ۵۰۰ و … ادامه پیدا کرده و در هر صفحه امکان انتخاب ۲۰ تا ۳۰ صفحه هست. این حق انتخاب به سود کاربر شما نیس. بهتره تعداد نمایش صفحات رو محدود کنین. هم اینکه در نظر داشته باشین که فاصله میان لینک دو صفحه به اندازه ای انتخاب شه که کاربر به اشتباه روی لینکای بغل دستی کلیک نکنه. نمونه زیر یه روش اشتباه واسه نمایش لینکا و فاصله میان اوناس.

در بسیاری موارد به کار گیری دکمه های صفحه بعد و صفحه قبل میتونه به کاربران شما کمک کنه که سریعتر محتوای سایت رو مشاهد و بررسی کنن. در این روش دیگه نیاز نیس کاربر بدونه الان در چه صفحه ای قرار گرفته و چند صفحه پیش رو داره. دقت کنین که دکمه های بعد و قبل طراحی متفاوتی نسبت به صفحه بندی شماره ای سایت شما داشته باشن تا سریعتر به وسیله کاربران شناسایی شن و خیلی راحت قابل کلیک باشن.

۶- آخرین و اولین رو از یاد ببرین

در گذشته عادی بود که علاوه بر دکمه های بعد و قبل لینک به آخرین و اولین صفحه هم قرار داده میشد. در حالیکه بررسیای آماری نشون می ده کاربرد این لینکا خیلی کم بوده و عموما کاربران به اشتباه روی اونا کلیک میکنن. خیلی از کاربران در نگاه اول این تکمها رو با صفحه قبل و بعد اشتباه گرفته و به سرعت روی اون کلیک میکنن که نتیجه حاصل شده مورد انتظارشون نیس.

اگه کاربران شما به اینجور امکانی نیاز دارن بهتره که صفحه اول و آخر رو مشابه با صفحه بندی شماره ای نمایش بدین و لینک این دو صفحه رو همیشه در اختیار کاربران خود بذارین. نمونه زیر یه کاربرد درست از صفحه اول و آخر در طراحی صفحه بندی سایت حساب میشه.

صفحه نمایش تلفنای هوشمند و تبلتا فضای کمتری در مقایسه با کامپیوترای شخصی دارن. در نتیجه کارایی صفحه بندی شما در این شرایط بسیار پایین میشه. در اینجور شرایطی شماره ها با آیکونا جانشین شده و تنها المانای اصلی مانند شماره صفحه الان، دکمه صفحه بعد و دکمه صفحه قبل به کاربر نشون داده می شن. صفحه جستجوی گوگل یه نمونه عالی از صحفه بندی واسه نسخه موبایل حساب میشه.

اگه تعداد صفحات در سایت شما بسیار بالاست، نمایش اونا رو محدود کرده و فقط لینکای لازم کاربر رو به اون نمایش بدین. فاصله میان صفحه جاری تا صفحه اول و آخر رو با به کار گیری سه نقطه پر کرده و صفحه بندی خود رو ساده و کوتاه نمایش بدین.

درجه بندی اهمیت لینکا در صفحه بندی

در طراحی صفحه بندی سایت تنها لینکای به درد بخور و کاربردی رو به کاربران نمایش بدین و هر دسترسی اضافی رو از دید اون خارج کنین مهمترین بخشایی که باید در صفحه بندی سایت نشون داده شن به ترتیب اولویت عبارتند از:

  • صفحه جاری
  • دکمه های صفحه بعد و صفحه قبل
  • نمایش شماره صفحه قبلی و بعدی نسبت به صفحه جاری
  • نمایش لینک صفحه آخر و صفحه آخر به شکل شماره ای

چند مورد از نکته های بالا الان در سایت شما رعایت شده؟ بنظر شما تغییر صفحه بندی سایت چقدر در کارایی اون موثر میشه؟

اگه نمونه های خوب یا بد از صفحه بندی در سایتای مطرح ایرونی می شناسین در بخش نظرات همین مقاله به ما و بقیه خوانندگان معرفی کنین.