{"id":27771,"date":"2021-04-08T06:25:16","date_gmt":"2021-04-08T11:25:16","guid":{"rendered":"https:\/\/www.hostgator.com\/blog\/?p=27771"},"modified":"2021-03-29T13:44:29","modified_gmt":"2021-03-29T18:44:29","slug":"hamburger-menu-design","status":"publish","type":"post","link":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/","title":{"rendered":"Controversial Design: The Pros and Cons of the Hamburger Menu"},"content":{"rendered":"\n<p>Any website that has more than one page needs a <a href=\"https:\/\/www.hostgator.com\/blog\/create-website-navigation-menu\/\">menu<\/a>. It\u2019s a standard website element and one of the few things almost all websites have in common. <\/p>\n\n\n\n<p>Your menu is often one of the first things visitors look for on your website, since it\u2019s the easiest path to learning what the site contains and how to find the parts of it they care about.&nbsp;<\/p>\n\n\n\n<p>Which is all to say: your menu is important.&nbsp;<\/p>\n\n\n\n<p>That may have something to do with why a deviation from the norm in menu design can be a controversial topic. The hamburger menu has been around now for a while, but it\u2019s been a controversial design choice from early on. Back in 2014, <a href=\"https:\/\/techcrunch.com\/2014\/05\/24\/before-the-hamburger-button-kills-you\/\" target=\"_blank\" rel=\"noopener noreferrer\">TechCrunch<\/a> straight up called it the devil. But as smartphone use has grown, use of the hamburger menu has become a common design choice.&nbsp;<\/p>\n\n\n\n<p>What is this tiny icon that gets people so riled up?&nbsp;<\/p>\n\n\n<div class=\"hgrp\"><h4>You might like&#8230;<\/h4><ul><li><span class=\"prod-icon\"><a href=\"https:\/\/www.hostgator.com\/services\/web-design\" data-element-location=\"body.post_content.related_prod_block\" data-element-type=\"button\" data-element-label=\"web_design_services\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/web-design-150x150.png\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" srcset=\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/web-design-150x150.png 150w, https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/web-design-300x300.png 300w, https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/web-design.png 500w\" sizes=\"(max-width: 150px) 100vw, 150px\" \/><\/a><\/span><a href=\"https:\/\/www.hostgator.com\/services\/web-design\" class=\"hgrp-link\" data-element-location=\"body.post_content.related_prod_block\" data-element-type=\"link\" data-element-label=\"web_design_services\">Web Design Services<\/a><\/li><li><span class=\"prod-icon\"><a href=\"https:\/\/www.hostgator.com\/website-builder\" data-element-location=\"body.post_content.related_prod_block\" data-element-type=\"button\" data-element-label=\"website_builder\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/website-builder-150x150.png\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" srcset=\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/website-builder-150x150.png 150w, https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/website-builder-300x300.png 300w, https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2020\/11\/website-builder.png 500w\" sizes=\"(max-width: 150px) 100vw, 150px\" \/><\/a><\/span><a href=\"https:\/\/www.hostgator.com\/website-builder\" class=\"hgrp-link\" data-element-location=\"body.post_content.related_prod_block\" data-element-type=\"link\" data-element-label=\"website_builder\">Website Builder<\/a><\/li><\/ul><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"h-what-is-the-hamburger-menu\">What is the Hamburger Menu?<\/h2>\n\n\n\n<p>The hamburger menu is the common term used to describe the little three-lined icon used on many websites and apps to represent the larger menu. It most often shows up in the top left corner (but not exclusively), and clicking on it opens up the full menu.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/xgcu5heKyvuvWtd9fjjoE-usFzDqW_m-iyY2RQFo1f4CVSI-rbzdJXgLQ8kn5atdmT4jFAA1hAOWEj2wwwWaxH9cWeykwra8yJIVkE4hMxvueI8uX2G_qvnV9j7AGIuPAoVh_B6H\" alt=\"hamburger menu on mobile website\"\/><\/figure>\n\n\n\n<p>Hamburger menus are especially popular on mobile websites and apps, where space is at a premium and getting a menu with several options to fit is challenging. But you\u2019ll also often see it on the desktop version of websites as well.&nbsp;&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-5-pros-of-using-a-hamburger-menu\">5 Pros of Using a Hamburger Menu<\/h2>\n\n\n\n<p>Hamburger menus have their share of haters, but they serve a purpose. They\u2019ve had staying power in the face of critics for a few main reasons.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-hamburger-menus-take-up-less-space\">1. Hamburger menus take up less space.<\/h3>\n\n\n\n<p>This is the reason hamburger menus exist to begin with, and why most websites that deploy them choose to do so. When creating a website, you have to figure out how to pack all the important information your visitors may need in a small amount of space. Hamburger menus are an efficient way to get more navigation options into a smaller package.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-2-they-allow-for-a-cleaner-webpage\">2. They allow for a cleaner webpage.&nbsp;<\/h3>\n\n\n\n<p>Many visitors (and designers) prefer a <a href=\"https:\/\/www.hostgator.com\/blog\/web-design-trends\/\">minimalist aesthetic<\/a>-websites that are cleaner and only include the design elements required for basic communication and functionality. When a website has too many images and information packed into a small screen, it can look sloppy and confusing. Using a hamburger menu cuts down on how much visitors have to process when taking in your web page at a glance.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-3-for-menus-with-a-lot-of-pages-they-mean-less-clutter\">3. For menus with a lot of pages, they mean less clutter.&nbsp;<\/h3>\n\n\n\n<p>If you have a simple website with five pages or less, including them all in your main menu on desktop may not be a visual challenge. But for websites that have a lot of different pages and categories, figuring out how to communicate all that to your visitors without overwhelming the page is a design challenge. And an overly complex menu can end up distracting visitors from the main part of the page you want their attention on.<\/p>\n\n\n\n<p>For instance, on an eCommerce website-you want them to focus on your products and information that makes them more likely to buy. But if your eCommerce store has products that fall into a dozen or more categories, you also want visitors to be able to easily find the ones they\u2019re interested in. A hamburger menu gives you a way to make sure visitors can find the full list of categories, while still designing each page to draw attention to the product you want them to focus on.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-4-by-now-they-re-familiar-to-most-people\">4. By now, they\u2019re familiar to most people.&nbsp;<\/h3>\n\n\n\n<p>Any design element that contains functionality needs to be intuitive to visitors, or it defeats the purpose. Using a hamburger menu to save space on your web page would backfire if your visitors couldn\u2019t figure out to click on it to see their menu options. That was a valid concern a few years ago, but by now <em>most<\/em> visitors know what a hamburger menu means when they see it. You can reasonably assume that they won\u2019t leave your website confused about how to find the menu.<\/p>\n\n\n\n<p>The emphasis on <em>most<\/em> here is intentional though. Hamburger menus are intuitive to anyone who uses a smartphone regularly, or anyone who spends enough time online to be used to common web design elements. If your target audience includes people who likely don\u2019t spend much time on a mobile device or browsing the web, there\u2019s a chance they may still be baffled by your hamburger menu. As in all things web design, think first about who your audience is and what makes sense for them.&nbsp;&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-5-you-can-use-them-to-remove-distractions-without-losing-functionality\">5. You can use them to remove distractions, without losing functionality.<\/h3>\n\n\n\n<p>Hamburger menus are often used to replace a website\u2019s main menu, but that\u2019s not their only possible use. Some websites use them alongside their main menu to provide additional options or more information that doesn\u2019t fit easily on the main page.<\/p>\n\n\n\n<p>By removing visual distractions from the page, you can more effectively keep visitors\u2019 attention on the main piece of information you most want them to notice. A hamburger menu can be a tool to help you do that, without removing the other options visitors may want to take entirely.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-5-cons-of-a-hamburger-menu\">5 Cons of a Hamburger Menu<\/h2>\n\n\n\n<p>We\u2019ve covered the reasons to like it, so why does it still have a bad rap? Critics of the hamburger menu cite a few main issues with it.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-it-makes-your-navigation-options-less-visible\">1. It makes your navigation options less visible.<\/h3>\n\n\n\n<p>When<strong> <\/strong>your main menu is visible on the page at all times, every visitor can quickly see what the main category and page options are without doing any extra work. When you put all that information behind a hamburger icon, suddenly only a subset of visitors-those that make the choice to click-will have that information.<\/p>\n\n\n\n<p>That can make finding what they\u2019re looking for a bit more difficult and unintuitive for visitors. And it could mean some visitors don\u2019t seek out pages they\u2019d be interested in if they knew they were an option, because they never see a link to them.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-2-it-adds-extra-steps-for-the-user\">2. It adds extra steps for the user.<\/h3>\n\n\n\n<p>An extra click doesn\u2019t <em>sound<\/em> like that much work. But in terms of how we use the internet, adding any extra step to the process-no matter how simple-becomes a barrier that many users simply won\u2019t take. Ease of use is paramount to <a href=\"https:\/\/www.hostgator.com\/blog\/web-design-best-practices-guide\/\">web design<\/a>. You want to make it as simple as possible for visitors to see and do everything on your site you want them to.<\/p>\n\n\n\n<p>Noticing a website has a hamburger menu, going to click on it, and then looking over your navigation options-that\u2019s all more work for your visitors. Many won\u2019t mind doing it at all, but some won\u2019t bother. And for those people, you lose the chance of them seeing important navigation information.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-3-people-may-overlook-it\">3. People may overlook it.<\/h3>\n\n\n\n<p>Part of the appeal of the hamburger icon is that it\u2019s small and out of the way, but that can also be a weakness. That\u2019s what makes it so easy to overlook completely. Many of your visitors-especially those that spend a lot of time on mobile devices-will instinctively know to look for it when looking for menu options. <\/p>\n\n\n\n<p>But your audience may well include people who don\u2019t automatically seek out that hamburger icon. For them, hiding your menu behind the icon could mean they never notice your menu options, and don\u2019t bother exploring your website as much as they may have otherwise.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-4-it-s-harder-to-include-tiered-menus\">4. It\u2019s harder to include tiered menus.<\/h3>\n\n\n\n<p>Many websites not only use categories to organize their pages or products, but also have a number of subcategories. A pet store may have animal types as its main level of categories (dogs, cats, rabbits, etc.), but then subcategories under each for the types of products they sell for each animal.&nbsp;<\/p>\n\n\n\n<p>When your main menu is spread across the top of the screen, it\u2019s easy to add those subcategories in the dropdown menu. With a hamburger menu, it\u2019s possible to add subcategories underneath each main menu item in your list, but the design structure doesn\u2019t lend itself as naturally to this type of tiered menu. If your <a href=\"https:\/\/www.hostgator.com\/blog\/best-url-structure-seo\/\">website structure<\/a> includes a lot of subcategories, a hamburger menu might not make as much sense for you.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-5-it-can-reduce-engagement\">5. It can reduce engagement.<\/h3>\n\n\n\n<p>A 2016 <a href=\"https:\/\/www.nngroup.com\/articles\/hamburger-menus\/\" target=\"_blank\" rel=\"noopener noreferrer\">study by Nielsen Norman Group<\/a> looked at how likely visitors are to actually use hidden navigation options, like those behind a hamburger menu. They found that desktop users only did so in 27% of cases, and that they used more visible menus almost twice as much. On mobile, hidden navigation options fared better, but were still outperformed by websites that used a combo of hidden and visible navigation options.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/BRR-RwYz0wHAWmblcETadbgccQapO-WeT_enU9qDAupHC8cnEn53o22agH1fQ-WxirkPpOwSm4epEFr_SAqTkkdwY89l7Q7K4-8KbvA5b2PaNzGIUckDYh7H6KevYSgfYjDBFWIN\" alt=\"chart showing hamburger menus can reduce site engagement\"\/><\/figure>\n\n\n\n<p>This suggests that many of your visitors simply won\u2019t bother taking that extra step of finding and clicking on the links you put behind a hamburger menu, which may translate into lower engagement rates on your website.&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-should-you-use-a-hamburger-menu-on-your-website\">Should You Use a Hamburger Menu on Your Website?<\/h2>\n\n\n\n<p>Knowing general pros and cons is useful in measuring the choice for you, but ultimately it depends on what makes sense for your audience. And if you\u2019re not sure, the best option is to test.&nbsp;&nbsp;<\/p>\n\n\n\n<p>While the Nielsen Norman Group found clear evidence for avoiding hidden menus, a more <a href=\"https:\/\/cxl.com\/blog\/testing-hamburger-icon-revenue\/\" target=\"_blank\" rel=\"noopener noreferrer\">recent test reported in CXL<\/a> found that use of a hamburger menu actually increased revenue for an eCommerce business. In this particular case, the website\u2019s visitors predominantly used the website on mobile devices. And they found that putting the icon on a pink background and adding the word 'Menu'\u009d got even better results.<\/p>\n\n\n\n<p>Does that mean you should add a pink hamburger menu on your website right now? Nope!&nbsp;<\/p>\n\n\n\n<p>They decided what menu variations to try out based on their current website\u2019s design and data on how people were viewing the site. To figure out what makes sense for your website, take these 3 steps:<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Look at what your current analytics tell you about your visitors: who they are, what devices they use to visit your website, and how they interact with the site now.<\/li><li>Based on your current data, develop a hypothesis about what menu options you think may perform better than what you have now (if any).<\/li><li>Set up A\/B tests to see if your hypothesis is right.<\/li><\/ol>\n\n\n\n<p>You never want to add a design element to your website because you heard it\u2019s trendy or you feel like you\u2019re supposed to. Always consider what makes sense for your particular site and, even more importantly, your visitors.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-how-to-add-a-hamburger-menu-to-your-website\">How to Add a Hamburger Menu to Your Website<\/h2>\n\n\n\n<p>If you\u2019ve weighed all the pros and cons, analyzed your analytics, considered your audience, and have decided a hamburger menu is the right choice for your website, now you need to know how.&nbsp;<\/p>\n\n\n\n<p>If you have a WordPress site, you have two main methods for <a href=\"https:\/\/www.hostgator.com\/blog\/setup-wordpress-menu\/\">adding a menu<\/a>:<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Choose a theme that has a hamburger menu<\/li><li>Use a plugin<\/li><\/ol>\n\n\n\n<p>The first option probably makes the most sense if you\u2019re building a new website, or considering a full redesign. In that case, when perusing your theme options, look specifically for one that already includes a hamburger menu. You can find a list of popular options that already have a <a href=\"https:\/\/codeless.co\/wordpress-hamburger-menu-themes\/\" target=\"_blank\" rel=\"noopener noreferrer\">hamburger menu here<\/a>.<\/p>\n\n\n\n<p>If you want to add a hamburger menu to your existing website without having to do a full overhaul of the site, you have a few different plugin options to choose from. Two of the most popular options are the <a href=\"https:\/\/responsive.menu\/blog\/how-to-create-wordpress-hamburger-menu-for-desktop\/\" target=\"_blank\" rel=\"noopener noreferrer\">Responsive Menu plugin<\/a> and <a href=\"https:\/\/slickmenu.net\/\" target=\"_blank\" rel=\"noopener noreferrer\">Slick Menu plugin<\/a>. Both will let you customize how your menu looks, and ensure you can get it set up without having to do any coding.&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-hamburger-or-not-up-to-you\">Hamburger or Not? Up to You<\/h2>\n\n\n\n<p>Every website is different, and deciding what will work for yours is up to you. Hamburger menus are one more design element to add to the possibilities for your site. They may help you do more with less in the space you have available, or you may determine they\u2019re likely to be more confusing than they\u2019re worth for your visitors. <\/p>\n\n\n\n<p>Whatever choice you make, keep your visitors top of mind and make sure you\u2019re building a website that will work for them.&nbsp;&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Any website that has more than one page needs a menu. It\u2019s a standard website element and one of the&#8230;<\/p>\n","protected":false},"author":166,"featured_media":27814,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[127,122,131],"class_list":["post-27771","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-and-hosting-tips","tag-web-design-services","tag-website-builder","tag-wordpress-plugins"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.2 (Yoast SEO v23.2) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Controversial Design: The Pros and Cons of the Hamburger Menu - HostGator<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Controversial Design: The Pros and Cons of the Hamburger Menu\" \/>\n<meta property=\"og:description\" content=\"Any website that has more than one page needs a menu. It\u2019s a standard website element and one of the...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\" \/>\n<meta property=\"og:site_name\" content=\"HostGator\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/HostGator\" \/>\n<meta property=\"article:published_time\" content=\"2021-04-08T11:25:16+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-03-29T18:44:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.hostgator.com\/blog\/wp-content\/\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1155\" \/>\n\t<meta property=\"og:image:height\" content=\"605\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Kristen Hicks\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/atxcopywriter\" \/>\n<meta name=\"twitter:site\" content=\"@HostGator\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kristen Hicks\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\"},\"author\":{\"name\":\"Kristen Hicks\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/9ab81f8120a12dcfbd7d2ab946dab0a5\"},\"headline\":\"Controversial Design: The Pros and Cons of the Hamburger Menu\",\"datePublished\":\"2021-04-08T11:25:16+00:00\",\"dateModified\":\"2021-03-29T18:44:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\"},\"wordCount\":2115,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg\",\"keywords\":[\"Web Design Services\",\"Website Builder\",\"WordPress Plugins\"],\"articleSection\":[\"Web Hosting Tips\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\",\"url\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\",\"name\":\"Controversial Design: The Pros and Cons of the Hamburger Menu - HostGator\",\"isPartOf\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg\",\"datePublished\":\"2021-04-08T11:25:16+00:00\",\"dateModified\":\"2021-03-29T18:44:29+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage\",\"url\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg\",\"contentUrl\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg\",\"width\":1155,\"height\":605,\"caption\":\"Should You Use a Hamburger Menu on Your Desktop Website-\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.hostgator.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Controversial Design: The Pros and Cons of the Hamburger Menu\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#website\",\"url\":\"https:\/\/www.hostgator.com\/blog\/\",\"name\":\"HostGtaor\",\"description\":\"Web Hosting and Marketing Tips for Entrepreneurs\",\"publisher\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.hostgator.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#organization\",\"name\":\"HostGtaor\",\"url\":\"https:\/\/www.hostgator.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2019\/04\/cropped-HG-Logo_default-default.png\",\"contentUrl\":\"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2019\/04\/cropped-HG-Logo_default-default.png\",\"width\":1092,\"height\":215,\"caption\":\"HostGtaor\"},\"image\":{\"@id\":\"https:\/\/www.hostgator.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/HostGator\",\"https:\/\/x.com\/HostGator\",\"https:\/\/www.instagram.com\/hostgator\",\"https:\/\/www.linkedin.com\/company\/hostgator-com\",\"https:\/\/www.pinterest.com\/hostgator\/\",\"https:\/\/www.youtube.com\/user\/hostgator\"],\"email\":\"support@gator.com\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/9ab81f8120a12dcfbd7d2ab946dab0a5\",\"name\":\"Kristen Hicks\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/457ef8a7379a7f4f39d7810b58ef0a0f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/457ef8a7379a7f4f39d7810b58ef0a0f?s=96&d=mm&r=g\",\"caption\":\"Kristen Hicks\"},\"description\":\"Kristen Hicks is an Austin-based freelance content writer and lifelong learner with an ongoing curiosity to learn new things. She uses that curiosity, combined with her experience as a freelance business owner, to write about subjects valuable to small business owners on the HostGator blog. You can find her on Twitter at @atxcopywriter.\",\"sameAs\":[\"http:\/\/austin-copywriter.com\/\",\"https:\/\/x.com\/https:\/\/twitter.com\/atxcopywriter\"],\"url\":\"https:\/\/www.hostgator.com\/blog\/author\/khicks\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Controversial Design: The Pros and Cons of the Hamburger Menu - HostGator","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/","og_locale":"en_US","og_type":"article","og_title":"Controversial Design: The Pros and Cons of the Hamburger Menu","og_description":"Any website that has more than one page needs a menu. It\u2019s a standard website element and one of the...","og_url":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/","og_site_name":"HostGator","article_publisher":"https:\/\/www.facebook.com\/HostGator","article_published_time":"2021-04-08T11:25:16+00:00","article_modified_time":"2021-03-29T18:44:29+00:00","og_image":[{"width":1155,"height":605,"url":"https:\/\/www.hostgator.com\/blog\/wp-content\/\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg","type":"image\/jpeg"}],"author":"Kristen Hicks","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/atxcopywriter","twitter_site":"@HostGator","twitter_misc":{"Written by":"Kristen Hicks","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#article","isPartOf":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/"},"author":{"name":"Kristen Hicks","@id":"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/9ab81f8120a12dcfbd7d2ab946dab0a5"},"headline":"Controversial Design: The Pros and Cons of the Hamburger Menu","datePublished":"2021-04-08T11:25:16+00:00","dateModified":"2021-03-29T18:44:29+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/"},"wordCount":2115,"commentCount":0,"publisher":{"@id":"https:\/\/www.hostgator.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg","keywords":["Web Design Services","Website Builder","WordPress Plugins"],"articleSection":["Web Hosting Tips"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/","url":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/","name":"Controversial Design: The Pros and Cons of the Hamburger Menu - HostGator","isPartOf":{"@id":"https:\/\/www.hostgator.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage"},"image":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg","datePublished":"2021-04-08T11:25:16+00:00","dateModified":"2021-03-29T18:44:29+00:00","breadcrumb":{"@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#primaryimage","url":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg","contentUrl":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2021\/03\/Should-You-Use-a-Hamburger-Menu-on-Your-Desktop-Website-.jpg","width":1155,"height":605,"caption":"Should You Use a Hamburger Menu on Your Desktop Website-"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hostgator.com\/blog\/hamburger-menu-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hostgator.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Controversial Design: The Pros and Cons of the Hamburger Menu"}]},{"@type":"WebSite","@id":"https:\/\/www.hostgator.com\/blog\/#website","url":"https:\/\/www.hostgator.com\/blog\/","name":"HostGtaor","description":"Web Hosting and Marketing Tips for Entrepreneurs","publisher":{"@id":"https:\/\/www.hostgator.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hostgator.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hostgator.com\/blog\/#organization","name":"HostGtaor","url":"https:\/\/www.hostgator.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostgator.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2019\/04\/cropped-HG-Logo_default-default.png","contentUrl":"https:\/\/www.hostgator.com\/blog\/wp-content\/uploads\/2019\/04\/cropped-HG-Logo_default-default.png","width":1092,"height":215,"caption":"HostGtaor"},"image":{"@id":"https:\/\/www.hostgator.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/HostGator","https:\/\/x.com\/HostGator","https:\/\/www.instagram.com\/hostgator","https:\/\/www.linkedin.com\/company\/hostgator-com","https:\/\/www.pinterest.com\/hostgator\/","https:\/\/www.youtube.com\/user\/hostgator"],"email":"support@gator.com"},{"@type":"Person","@id":"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/9ab81f8120a12dcfbd7d2ab946dab0a5","name":"Kristen Hicks","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostgator.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/457ef8a7379a7f4f39d7810b58ef0a0f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/457ef8a7379a7f4f39d7810b58ef0a0f?s=96&d=mm&r=g","caption":"Kristen Hicks"},"description":"Kristen Hicks is an Austin-based freelance content writer and lifelong learner with an ongoing curiosity to learn new things. She uses that curiosity, combined with her experience as a freelance business owner, to write about subjects valuable to small business owners on the HostGator blog. You can find her on Twitter at @atxcopywriter.","sameAs":["http:\/\/austin-copywriter.com\/","https:\/\/x.com\/https:\/\/twitter.com\/atxcopywriter"],"url":"https:\/\/www.hostgator.com\/blog\/author\/khicks\/"}]}},"_links":{"self":[{"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/posts\/27771"}],"collection":[{"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/users\/166"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/comments?post=27771"}],"version-history":[{"count":2,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/posts\/27771\/revisions"}],"predecessor-version":[{"id":27816,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/posts\/27771\/revisions\/27816"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/media\/27814"}],"wp:attachment":[{"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/media?parent=27771"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/categories?post=27771"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostgator.com\/blog\/wp-json\/wp\/v2\/tags?post=27771"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}