Newsha Karimi
Newsha Karimi
خواندن ۷ دقیقه·۴ سال پیش

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

در این پست به مثالهای مدرن و نکات مربوط به تجربه ی کاربری با منو های همبرگری می پردازیم.

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

منوی همبرگر چیست؟

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

دلایل مخالفت با منوی همبرگری

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

  • منو همبرگری بالای صفحه قرار میگیرد که باعث میشود کاربران به راحتی نتوانند روی آن ضربه بزنند.
  • منو ی همبرگری برای برخی از کاربران غیر حرفه ای یا افرادی با سن بالاتر از 40-50 سال ناشناخته است.
  • منوی همبرگری باعث میشود که اطلاعات از نظر کاربران پنهان بمانند و در صورتی که کاربران به این بخش رجوع نکنند ممکن است هرگز متوجه یکسری از قابلیت های محصول نشوند.

دلایل موافقت با منوی همبرگری

اما چرا هنوز بسیاری از طراحان از آنها استفاده میکنند؟ همه چیز به بحث دسترسی متوالی(progressive disclosure) در مقابل دسترسی مستقیم برمی گردد. در دسترسی متوالی معمولا زمانی اطلاعات به کاربر نشان داده میشوند که به دیدن آن احتیاج داشته باشد و یا نیاز باشد که اطلاعات اضافی از کاربر گرفته شود به این معنی که اطلاعات به مرور و در صورت نیاز به کاربر نمایش داده میشود از طرف دیگر ، اگر ما به کاربران خود دسترسی مستقیم بدهیم ، بدین معنی است که آنها محتوا یا پیوند مورد نظر خود را پیدا میکنند و تمامی اطلاعات را یکجا میبینند.

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

با این وجود ، این نماد همه جا اکنون دارای محبوبیتی است که می تواند تقریباً برابر با محبوبیت ذره بین برای جستجوها و آیکون چرخ دنده برای تنظیمات باشد.


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

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

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

بهترین زمان برای استفاده از منو ی همبرگری:

هنگامی که گزینه ها و ویژگی های اصلی را پنهان نمیکند

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

در صورتی که میخواهید وبسایت ساده تری داشته باشید

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

در چه صورتی از منو همبرگری بپرهیزیم؟

محصول شامل تعاملات(interaction) بسیاری است.

اگر کاربر شما با تعاملات زیاد و پیچیده ای در وبسایت سر و کار دارد او را با کلیک اضافه رو منوی همبرگری اذیت نکنید! سعی کنید در این صورت مراحل استفاده از پلتفرم را کمتر کنید.

اگر کاربرد پذیری را کاهش میدهد

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

منو همبرگری راست یا چپ؟

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

استدلال برای قرار دادن آن در سمت چپ ، این است که افرادی که زبان مادری چپ به راست دارند متمایل هستند که برای بررسی محتوای صفحه از سمت چپ شروع کنند و به شکل F صفحهع را از نظر بگزرانند. با توجه به این واقعیت ، بسیاری از منوها در سمت چپ قرار داده شده اند ، همچنین کاربران معمولاً به چپ بودن منوها عادت دارند. در واقع ، دستورالعمل های طراحی گوگل ، که از منوی همبرگری به عنوان (navigation drawer) یاد می کند ، استاندارد استفاده از آن را سمت چپ در نظر گرفته است.


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

با این حال در صورتی که این منو سمت راست قرار گیرد به علت اینکه اکثر کاربران راست دست هستند برای کلیک کردن روی این منو در گوشی موبایلشان به زحمت کمتری نیاز دارند و بسیار ساده تر میتوانند این کار را انجام دهند.


سخن پایانی

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

مزایای استفاده از آن:

فضای زیادی اشغال نمیکند: منوی همبرگری به کاهش اشغال فضا در رابط‌ کاربری کمک می‌کند، اجزای اضافی را مخفی کرده و فضای بیشتری برای محتوای اصلی فراهم می‌کند.

استفاده از آن آسان است: برای کاربران که با رابط‌ کاربری موبایل مواجه هستند، منوی همبرگری راهی ساده و قابل فهم برای دسترسی به گزینه‌های اصلی و سایر اجزای وبسایت یا برنامه است.

ظاهر حرفه‌ای دارد: استفاده از منوی همبرگری ممکن است به طراحی رابط کاربری یک پیشنهاد مدرن و حرفه‌ای بدهد.

معایب استفاده از آن:

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

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

شناخته شده نیست :بسیاری از کاربران در رنج سنی بالا کارکرد این دکمه را نمیشناسند و نمیدانند که دنبال چه چیزی در این بخش باید باشند.

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

منابع

https://www.goodworklabs.com/striking-advantages-and-disadvantages-of-hamburger-menu-with-examples

https://htmlburger.com/blog/hamburger-menu

https://uxdesign.cc/the-state-of-hamburger-menu-a0a0c0a93aec

طراحی uiطراحی uxطراحی تجربه ی کاربریمنو های همبرگریطراحی
طراحی تجربه ی کاربری
شاید از این پست‌ها خوشتان بیاید