0
0 مورد در سبد خدمات
0
0 مورد در سبد خدمات
0
0 مورد در سبد خدمات
0
0 مورد در سبد خدمات

طراحی مگا منو

[vc_row][vc_column][vc_column_text]

طراحی مگا منو در سایت های مدرن

 

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

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

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

 

سطح بندی دسته بندی سایت در مگا منو

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

در وب سایت Wayfair میتوانید یک مگا منوی فوق العاده را ببینید که بهترین استفاده را از فضای موجود برای تعداد لینکهای بالا، داشته ست.

طراحی مگا منو

 

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

 

 

همین ساختار برای مگا منو در سایت  Lucky Brand هم رعایت شده است، با استفاده از تایپوگرافی های مختلف، بازدید کننده میتواند اطلاعات مورد نظر خود را سریعا از طریق مگا منو در این سایت پیدا کند.

طراحی مگا منو

طراحی مگا منو به صورت تمام صفحه (Full-Width)

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

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

 

 

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

 

طراحی مگا منو

 

 

همچنین میتوانید ساختار ستونی را با این روش ترکیب کنید، نمونه ای که میتوانید در وب سایت  OARS website مشاهده کنید.

 

طراحی مگا منو

طراحی مگا منو با ترکیب متن و عکس

 

مسلما جذابیت تصویر برای هر کاربری بیشتر از متن است، همچنین در بعضی مواقع پیام توسط تصویر بسیار سریعتر از متن کوتاه منتقل میشود.

 

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

 

طزاحی مگا منو

 

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

 

وب سایت  PlayStation هم نمونه خوبی از ترکیب عکس و متن در مگا منو ست.

در صورتی که تعداد لینک های سایت شما کم است، میتوانید با قرار دادن آیکون برای هر لینک، زیبایی دو چندان به وب سایت خود ببخشید.

 

 

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

 

[/vc_column_text][/vc_column][/vc_row]

    0