در یک صفحه وب منوی اصلی یا آن هم Navigation یکی از مهمترین اجزا آن هم صفحه می باشد که بایستی و حتما به طراحی و همچنین پیاده سازی آن هم توجه قابل ملاحظه ای می شود. از آنجایی تقریبا قستی از کاربران وب از گوشی های همراه خود جهت مرور صفحات وب بهره بری و استفاده می کنند بایستی و حتما به نحوه دیدن کردن و نمایش و همچنین عملکرد آن منو در دستگاه هایی با عرض صفحه دیدن کردن و نمایش کمتر نیز اهمیت بدهیم.
در آن مطلب تعدادی از ایده های خلاقانه و همچنین زیبا را جهت پیاده سازی منوی اصلی صفحه جهت دستگاه هایی با عرض دیدن کردن و نمایش کوچک را بررسی کردن میکنیم.
طراح: iamvdo
۲:
طراح: Virgil Pana
See the Pen dPKavr by Virgil Pana (@virgilpana) on CodePen.
۳:
طراح: Virgil Pana
See the Pen Menu 1 by Virgil Pana (@virgilpana) on CodePen.
۴:
طراح: Virgil Pana
See the Pen Menu 2 by Virgil Pana (@virgilpana) on CodePen.
۵: Page Tilt Effect
طراح: Marco Fugaro
See the Pen Page Tilt Effect by Marco Fugaro (@marco_fugaro) on CodePen.
طراح: Victor Belozyorov
See the Pen Burger menu transformation by Victor Belozyorov (@WispProxy) on CodePen.
۷: UI with UX improvements with only CSS
طراح: Twikito
See the Pen UI with UX improvements with only CSS by Twikito (@Twikito) on CodePen.
۸: Open/Close SVG Drawer
طراح: John Choura Jr.
See the Pen Open/Close SVG Drawer by John Choura Jr. (@jchoura) on CodePen.
۹: Unnamed Menu
طراح: Zoë
See the Pen Unnamed Menu – CSS by Zoë (@z-) on CodePen.
۱۰: Offcanvas sidebar menu with a twist
طراح: Devilish Alchemist
See the Pen Offcanvas sidebar menu with a twist by Devilish Alchemist (@devilishalchemist) on CodePen.
۱۱: Full width navigation
طراح: codyhouse.co
۱۲: Smart Fixed Navigation
طراح: codyhouse.co
۱۳: Rounded Animated Navigation
طراح: codyhouse.co
۱۴: ۳D Bold Navigation
طراح: codyhouse.co
۱۵: Stretchy Navigation
طراح: codyhouse.co
مثالهایی از دنیای واقعی
در ادامه لیستی از وبسایت و مرکز خبرهای جدید هایی را دیدن میکنید که آن ایده ها و همچنین شبیه به آنها را در خود جای داده اند: