{"id":953,"date":"2022-03-04T15:24:54","date_gmt":"2022-03-04T15:24:54","guid":{"rendered":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/?p=953"},"modified":"2023-07-11T13:39:06","modified_gmt":"2023-07-11T12:39:06","slug":"using-slide-out-menus-in-web-design","status":"publish","type":"post","link":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/","title":{"rendered":"Using slide out menus in web design"},"content":{"rendered":"<p>Navigation bars and different types of menus in web design are vital for website users to move between pages, and for effective internal linking and structure. But you don&#8217;t need to opt only for a static menu, or a hamburger menu. Instead you could consider a slide out menu. But what is this? And what are the different options for designing effective slide out menus? Well, here at <a href=\"https:\/\/www.pumpkinwebdesign.com\/website-designers-manchester\/\">Pumpkin Web Design Manchester<\/a>, we are Manchester&#8217;s leading <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/designing-under-construction-web-pages\/\">web design<\/a> experts. We provide, high quality, effective, <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/vintage-web-design-features\/\">web design<\/a> solutions for local companies and businesses across Manchester, and the surrounding area, including <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-wigan\/\">Wigan<\/a> and <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-southport\/\">Southport.<\/a> As a result, we have produced this guide to everything you should know about\u00a0using slide out menus in web design.<\/p>\n<h2>What are slide out menus in web design?<\/h2>\n<p>Slide out menus are a fairly popular way to display your navigation menu. Especially on a mobile device where the screen size is rarely optimal. With a slide out menu, the navigation menu simply slides out, either at the touch of a button (desktop) or the swipe of a thumb (mobile). This is an interactive feature that can actually be quite pleasing.<\/p>\n<p>However, using a slide out menu does mean that a user, or a potential customer, in a hurry,\u00a0 might not be able to find the information or page they need instantly. Which could lead to more people leaving your website. And missed opportunities for sales. In a lot of cases though, this is unlikely. The slide out menu has been around for a number of years, and a lot of your users will be used to the format.<\/p>\n<h3>What are the important considerations when using slide out menus in web design?<\/h3>\n<p>So when it comes to using slide out menus in web design, there are a number of tips and considerations that could help you get the most out of your design. These include:<\/p>\n<ul>\n<li><strong><em>Using the whole space available-<\/em><\/strong> Instead of just settling for a list of pages, why not make better use of the space? A slide out menu essentially provides a whole other screen for you to use. So why not use a call to action button on this screen? After all, it&#8217;s the first thing that users will open after your website has loaded.<\/li>\n<li><strong><em>Design to fit with your style-<\/em><\/strong> So the slide out menu might provide a whole new screen, but that doesn&#8217;t mean you need a whole new design. Make sure you stick to the web design and branding you have already been using. This includes the colour scheme, typography and style of the images used.<\/li>\n<li><strong><em>Make it visual-<\/em><\/strong> While you will need some text labels to identify the pages, your slide out menu can also be visually effective. Go for illustrations or images that sum up the content of that page, or even just some really good pictures of your product. Just make sure they fit with the rest of your web design, across the rest of the website.<\/li>\n<\/ul>\n<p>For more information, or for professional web design solutions that really get results, get in touch with <a href=\"https:\/\/www.pumpkinwebdesign.com\/website-designers-manchester\/\">Pumpkin Web Design Manchester<\/a> today.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Navigation bars and different types of menus in web design are vital for website users to move between pages, and for effective internal linking and structure. But you don&#8217;t need to opt only for a static menu, or a hamburger menu. Instead you could consider a slide out menu. But what is this? And what [&#8230;]\n","protected":false},"author":2,"featured_media":837,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[17],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.10 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Using slide out menus in web design - Pumpkin Web Design Manchester<\/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.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Using slide out menus in web design - Pumpkin Web Design Manchester\" \/>\n<meta property=\"og:description\" content=\"Navigation bars and different types of menus in web design are vital for website users to move between pages, and for effective internal linking and structure. But you don&#8217;t need to opt only for a static menu, or a hamburger menu. Instead you could consider a slide out menu. But what is this? And what [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Pumpkin Web Design Manchester\" \/>\n<meta property=\"article:published_time\" content=\"2022-03-04T15:24:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-11T12:39:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-content\/uploads\/2018\/07\/freebie___3d_web_presentation_mock_up_by_graphberry-d88jove.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2240\" \/>\n\t<meta property=\"og:image:height\" content=\"1680\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Pumpkin Web Design Manchester\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Pumpkin Web Design Manchester\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/\",\"url\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/\",\"name\":\"Using slide out menus in web design - Pumpkin Web Design Manchester\",\"isPartOf\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website\"},\"datePublished\":\"2022-03-04T15:24:54+00:00\",\"dateModified\":\"2023-07-11T12:39:06+00:00\",\"author\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Using slide out menus in web design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website\",\"url\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/\",\"name\":\"Pumpkin Web Design Manchester\",\"description\":\"Full service digital agency\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28\",\"name\":\"Pumpkin Web Design Manchester\",\"description\":\"Providing top notch web design, across Manchester, since 2009\",\"url\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/author\/g4oyprjmpvh3epn\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Using slide out menus in web design - Pumpkin Web Design Manchester","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.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/","og_locale":"en_GB","og_type":"article","og_title":"Using slide out menus in web design - Pumpkin Web Design Manchester","og_description":"Navigation bars and different types of menus in web design are vital for website users to move between pages, and for effective internal linking and structure. But you don&#8217;t need to opt only for a static menu, or a hamburger menu. Instead you could consider a slide out menu. But what is this? And what [...]","og_url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/","og_site_name":"Pumpkin Web Design Manchester","article_published_time":"2022-03-04T15:24:54+00:00","article_modified_time":"2023-07-11T12:39:06+00:00","og_image":[{"width":2240,"height":1680,"url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-content\/uploads\/2018\/07\/freebie___3d_web_presentation_mock_up_by_graphberry-d88jove.jpg","type":"image\/jpeg"}],"author":"Pumpkin Web Design Manchester","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Pumpkin Web Design Manchester","Estimated reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/","url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/","name":"Using slide out menus in web design - Pumpkin Web Design Manchester","isPartOf":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website"},"datePublished":"2022-03-04T15:24:54+00:00","dateModified":"2023-07-11T12:39:06+00:00","author":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28"},"breadcrumb":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/using-slide-out-menus-in-web-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/"},{"@type":"ListItem","position":2,"name":"Using slide out menus in web design"}]},{"@type":"WebSite","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website","url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/","name":"Pumpkin Web Design Manchester","description":"Full service digital agency","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28","name":"Pumpkin Web Design Manchester","description":"Providing top notch web design, across Manchester, since 2009","url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/author\/g4oyprjmpvh3epn\/"}]}},"_links":{"self":[{"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/953"}],"collection":[{"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/comments?post=953"}],"version-history":[{"count":4,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/953\/revisions"}],"predecessor-version":[{"id":11921,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/953\/revisions\/11921"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/media\/837"}],"wp:attachment":[{"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/media?parent=953"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/categories?post=953"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/tags?post=953"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}