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

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

مگا منو چیست ؟

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

مگا منو هم به صورت عمودی ادامه پیدا می‌کند هم به صورت افقی و معمولا بیشتر صفحه نمایش را پر می‌کند. بعضی از توسعه‌دهنده‌های وب Mega Menu را به چند Section یا بخش تقسیم می‌کنند و هر بخش را به یک دسته اختصاص می‌دهند. انجام این کار کاملا اختیاری است.

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

یک نمونه مگامنو در سایت کیمیا آنلاین

یک مگا منو چه ویژگی‌هایی دارد؟

جالا که فهمیدیم مگا منو چیست بهتر است به چند ویژگی کلی آن اشاره کنیم:

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

اینم بخونید بد نیست: معرفی 5 افزونه حرفه ای برای ساخت فرم تماس با ما در وردپرس

استفاده از مگا منو چه تاثیری در تجربه کاربر دارد؟

قبل از این که از مگا منو استفاده کنید باید به یسوال زیر خوب فکر کنید:

آیا استفاده از مگا منو به کاربران من کمک می‌کند که راحت‌تر با سایت تعامل داشته باشند؟

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

اگر استفاده از این منو یک تجربه شیرین و جذاب‌ به بازدیدکنندگان انتقال دهد عالی است. حتما از آن استفاده کنید. باید مگا منو در تجربه کاربری (User Experience) تاثیر مثبتی داشته باشد وگرنه همان منوی drop-down هیچ ایرادی ندارد.

استفاده از مگا منو همیشه معرکه است؟

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

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

سایت آمازون در بریتانیا از مگا منو استفاده می‌کند

اما در نسخه مخصوص ایالات متحده به یک منوی ساده Drop-down راضی شده است و هیچ خبری از Mega Menu نیست. تصویر زیر را مشاهده کنید.

آمازون در آمریکا مگا منو را حذف کرده و از drop-down-menu استفاده می‌کند

خب چه نتیجه‌ای می‌گیریم؟

اگر Mega Menu همیشه جواب می‌داد، پس چرا آمازون با این پیشینه قوی بعضی جاها آن را کنار می‌گذارد؟ دقیقا این موضوع به همان هدف سایت برمی‌گردد که راجع به آن صحبت کردیم و ایجاد یک تجربه کاربری مفید بسیار مهم است.

اینم بخونید بد نیست: معرفی 10 افزونه برتر برای امتیازدهی به مطالب وردپرس


چه زمانی از Mega Menu استفاده کنیم؟

1 – جایی که کاربران انتظارش را داشته باشند

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

2 – وقتی منوی Drop-Down بیش از حد طولانی شود

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

منطقی هم هست. چون کاربر مجبور است مرتب بین گزینه‌ها بالا و پایین شده و کمی گیج می‌شود. و این که یک فشار نسبی هم به حافظه کوتاه مدت می‌آورد. چون احتمال فراموش کردن گزینه‌ها بیشتر است. اما در مگا منو همه چیز جلوی چشم کاربر است.

3 – وقتی باعث بهبود طراحی سایت شود

من خودم به شخصه سایت‌های متفاوت و خاص را دوست دارم. مدیران سایتی که جرئت دارند ساختارها را بشکنند و چیزهای جدید معرفی کنند برای من باارزش هستند.

یک سری سایتها برای این که پوسته سایت را بهتر پیاده کنند از Mega Menu استفاده می‌کنند. مثلا سایت Moleskine بعضی از دسته‌بندی‌هایش آنقدر زیرشاخه ندارند که نیازی به مگامنو داشته باشد. اما با یک حرکت خلاقانه از آن استفاده کرده است. در هر دسته تعدادی عکس با لینک قرار داده که کاربر می‌تواند روی آن‌ها کلیک کند.

یک حرکت خلاقانه در طراحی mega menu از سایت moleskine

اینم بخونید بد نیست: نمایش مدت زمان تقریبی مطالعه در وردپرس با افزونه Reading Time WP


چه زمانی Mega Menu به کار نمی‌آید؟

1 – وقتی تعداد لینک‌هایتان بسیار کم است

اگر سایتتان کمتر از صد Page دارد آن وقت استفاده از مگا منو یک حرکت غیرمنطقی است. برای کسب و کارهای کوچک تا متوسط و بلاگهای جمع و جور، استفاده از مگا منو فقط کاربران را گیج می‌کند. همینطور منو خیلی خالی به نظر می‌رسد و از نظر روانی روی کاربر تاثیر منفی دارد.

حل این مشکل Mega Menu و Drop-Down Menu را با هم ترکیب می‌کنند. یعنی برای بخش‌هایی که لینک کمی دارند منوی استاندارد کشویی را در نظر می‌گیرند. باز استفاده از این کار به سلیقه شما و اهداف سایتتان برمی‌گردد.

2 – وقتی می‌خواهید کاربران را به صفحات خاصی هدایت کنید

بعضی وقت‌ها سایت شما یک یا دو محصول برای فروش دارد. یا تمرکزش روی سرویس ایمیل مارکتینگ سایت یا ثبت نام کاربران است. در این حالت استفاده از مگا منو هوشمندانه نیست. چون انتخاب زیادی به کاربران می‌دهد و کار را برایشان سخت می‌کند. در این شرایط باید گشت و گذار بین صفحات سایت را به حداقل برسانید و تمرکزتان روی هدایت کاربران به Landing Pageهای هدف باشد.

3 – در موبایل اصلا به کار نمی‌آید

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

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


جمع و جور کنیم

تا اینجا درک کردیم که مگا منو چیست و چطور کار می‌کند. چه سایتهایی مناسب این نوع منو هستند یا چه سایتهایی بهتر است از آن استفاده نکنند. طبق رسم همیشه باز هم باید بگویم که اولویت با کاربران است. ببینید بازدیدکنندگان از این تغییر استقبال می‌کنند؟ اگر منوی drop-down دارید و می‌خواهید به mega menu کوچ کنید، یک نظرسنجی از کابران می‌تواند بسیار مفید باشد.

امتیاز ما یادت نره!