{"id":17229,"date":"2017-02-16T16:03:36","date_gmt":"2017-02-16T21:03:36","guid":{"rendered":"http:\/\/mjtsai.com\/blog\/?p=17229"},"modified":"2017-02-16T16:03:36","modified_gmt":"2017-02-16T21:03:36","slug":"great-alternatives-to-hamburger-menus","status":"publish","type":"post","link":"https:\/\/mjtsai.com\/blog\/2017\/02\/16\/great-alternatives-to-hamburger-menus\/","title":{"rendered":"Great Alternatives to Hamburger Menus"},"content":{"rendered":"<p><a href=\"https:\/\/www.nngroup.com\/articles\/hamburger-menus\/\">Kara Pernice and Raluca Budiu<\/a>:<\/p>\n<blockquote cite=\"https:\/\/www.nngroup.com\/articles\/hamburger-menus\/\"><p>Hidden navigation, such as the hamburger menu, is one of the many patterns inspired by mobile designs. Screen space is a precious commodity on mobile. To meet the challenge of prioritizing content while still making navigation (and other chrome) accessible, designers commonly rely on hiding the navigation under a menu &mdash; often indicated by the infamous hamburger icon. Like a cheap fast food chain, it got designers addicted to its convenience, and now serves millions each day, both on mobile devices and on desktops.<\/p>\n<p>While our qualitative user testing has repeatedly shown that navigation hidden under a drop-down menu is less discoverable on the desktop, we wanted to measure the size of this effect in a quantitative study and assess the relative impact of hidden navigation on the desktop versus mobile.<\/p><\/blockquote>\n\n<p><a href=\"https:\/\/uxplanet.org\/great-alternatives-to-hamburger-menus-d4c76d9414dd\">Mobiscroll<\/a> (via <a href=\"https:\/\/andybargh.com\/newsletter-issue-75\/\">Andy Bargh<\/a>):<\/p>\n<blockquote cite=\"https:\/\/uxplanet.org\/great-alternatives-to-hamburger-menus-d4c76d9414dd\">\n<p>Hamburger menus drive engagement down, slow down exploration and confuse people. If you are reading this, it won&rsquo;t confuse you, but it damn will confuse others who might be happy to consume your content.<\/p>\n<p>[&#8230;]<\/p>\n<p>I cannot stress this enough. Always design with real content, otherwise you&rsquo;ll end up with placeholders, lorem ipsums and hamburger menus inside hamburger menus. Content on its own doesn&rsquo;t make sense, and layouts without content either.<\/p>\n<\/blockquote>\n<p>Previously: <a href=\"http:\/\/mjtsai.com\/blog\/2015\/11\/10\/apple-on-hamburger-menus\/\">Apple on Hamburger Menus<\/a>, <a href=\"http:\/\/mjtsai.com\/blog\/2015\/08\/18\/the-hamburger-menu-doesnt-work\/\">The Hamburger Menu Doesn&rsquo;t Work<\/a>, <a href=\"http:\/\/mjtsai.com\/blog\/2015\/05\/04\/ex-microsoft-designer-explains-the-move-away-from-metro\/\">Ex-Microsoft Designer Explains the Move Away From Metro<\/a>, <a href=\"http:\/\/mjtsai.com\/blog\/2014\/04\/14\/hamburgers-and-basements\/\">Hamburgers and Basements<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"<p>Kara Pernice and Raluca Budiu: Hidden navigation, such as the hamburger menu, is one of the many patterns inspired by mobile designs. Screen space is a precious commodity on mobile. To meet the challenge of prioritizing content while still making navigation (and other chrome) accessible, designers commonly rely on hiding the navigation under a menu [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"apple_news_api_created_at":"","apple_news_api_id":"","apple_news_api_modified_at":"","apple_news_api_revision":"","apple_news_api_share_url":"","apple_news_coverimage":0,"apple_news_coverimage_caption":"","apple_news_is_hidden":false,"apple_news_is_paid":false,"apple_news_is_preview":false,"apple_news_is_sponsored":false,"apple_news_maturity_rating":"","apple_news_metadata":"\"\"","apple_news_pullquote":"","apple_news_pullquote_position":"","apple_news_slug":"","apple_news_sections":"\"\"","apple_news_suppress_video_url":false,"apple_news_use_image_component":false,"footnotes":""},"categories":[2],"tags":[77,31,96],"class_list":["post-17229","post","type-post","status-publish","format-standard","hentry","category-technology","tag-design","tag-ios","tag-web"],"apple_news_notices":[],"_links":{"self":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/17229","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/comments?post=17229"}],"version-history":[{"count":1,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/17229\/revisions"}],"predecessor-version":[{"id":17230,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/17229\/revisions\/17230"}],"wp:attachment":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/media?parent=17229"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/categories?post=17229"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/tags?post=17229"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}