{"id":6757,"date":"2021-05-24T11:44:52","date_gmt":"2021-05-24T10:44:52","guid":{"rendered":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/?p=6757"},"modified":"2023-07-17T17:40:32","modified_gmt":"2023-07-17T16:40:32","slug":"advantages-of-ribbon-headers-in-web-design","status":"publish","type":"post","link":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/","title":{"rendered":"Advantages of ribbon headers in web design"},"content":{"rendered":"<p>Here at <a href=\"https:\/\/www.pumpkinwebdesign.com\/website-designers-manchester\/\">Pumpkin Web Design Manchester<\/a>, we build websites specifically tailored to the requirements of companies and businesses across Manchester and the North West, including <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-blackburn\/\">Blackburn<\/a> and <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-chorley\/\">Chorley.<\/a> We provide the perfect <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/improving-website-contact-forms\/\">web design<\/a> solutions for clients in all areas of business and industry. As a result, we have produced this guide to everything you should know about using ribbon headers in web design.<\/p>\n<h2><span style=\"font-weight: 400;\">What is a ribbon header in web design?<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">A ribbon header is a thin header that runs along the top of the page. This is not very deep and takes up only a little of the room, so that the main bulk of your above the fold content can grab the attention visually. For such a thin header you might not think this is worthwhile, but actually this can bring a number of key benefits to your website.\u00a0<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">What are the advantages of ribbon headers in web design?<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">There are a number of advantages and benefits to using ribbon headers in web design. These advantages include:<\/span><\/p>\n<ul>\n<li><span style=\"font-weight: 400;\">Space for contact details\u00a0<\/span><\/li>\n<li><span style=\"font-weight: 400;\">\u00a0Contrasting background colour\u00a0<\/span><\/li>\n<li><span style=\"font-weight: 400;\">\u00a0Space for company logo<\/span><\/li>\n<\/ul>\n<h3><span style=\"font-weight: 400;\">A ribbon header allows space for contact details<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Using a ribbon header across the very top of your page allows you to add contact details to the very front of your website where it cannot be missed. These contact details could include:<\/span><\/p>\n<ul>\n<li><span style=\"font-weight: 400;\"><strong><em>The company phone number-<\/em><\/strong> adding a company phone number to the the top of your landing page is a good way to build immediate trust with your potential customers. It can be very beneficial for the user experience if you add your contact phone number as a direct link for mobile users. This means that they can simply\u00a0 click on the mobile phone icon or number, and have this open immediately to dial.<\/span><\/li>\n<li><span style=\"font-weight: 400;\"><em><strong>Social media links-<\/strong><\/em> If your company uses social media platforms for social media marketing and engaging with your customers or clients it can be a good idea to include your social media icons in the ribbon header. This gives your potential customers or clients an immediate link to check out your company presents online and builds trust.<\/span><\/li>\n<\/ul>\n<h3><span style=\"font-weight: 400;\">A ribbon header can be a contrasting background colour<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Using a ribbon header with a contrasting background colour, usually the accent colour used on the rest of your website, can be an effective artistic touch. This helps to create a slight border between the very top of your above the fold content and the address bar at the top of the screen. This visual barrier draws the eye down the page and can make your website look more professional.<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">A ribbon header can add space for a company logo<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Making sure the company logo is one of the first things that your potential customers or clients see when your website loads is an important design consideration. However, when using design techniques such as minimalist design and large stunning hero images, adding your company logo on top of this content can be a design issue. A ribbon header can remove this problem altogether by providing space for your company logo or company name to be displayed immediately, without obstructing the design of the rest of the space.<\/span><\/p>\n<p>For more information, or professional web design support, get in touch with the experts today, here at <a href=\"https:\/\/www.pumpkinwebdesign.com\/website-designers-manchester\/\">Pumpkin Web Design Manchester.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here at Pumpkin Web Design Manchester, we build websites specifically tailored to the requirements of companies and businesses across Manchester and the North West, including Blackburn and Chorley. We provide the perfect web design solutions for clients in all areas of business and industry. As a result, we have produced this guide to everything you [&#8230;]\n","protected":false},"author":2,"featured_media":3244,"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>Advantages of ribbon headers 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\/advantages-of-ribbon-headers-in-web-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Advantages of ribbon headers in web design - Pumpkin Web Design Manchester\" \/>\n<meta property=\"og:description\" content=\"Here at Pumpkin Web Design Manchester, we build websites specifically tailored to the requirements of companies and businesses across Manchester and the North West, including Blackburn and Chorley. We provide the perfect web design solutions for clients in all areas of business and industry. As a result, we have produced this guide to everything you [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Pumpkin Web Design Manchester\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-24T10:44:52+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-17T16:40:32+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-content\/uploads\/2020\/05\/laptop-1209008_1280.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\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\/advantages-of-ribbon-headers-in-web-design\/\",\"url\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/\",\"name\":\"Advantages of ribbon headers in web design - Pumpkin Web Design Manchester\",\"isPartOf\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website\"},\"datePublished\":\"2021-05-24T10:44:52+00:00\",\"dateModified\":\"2023-07-17T16:40:32+00:00\",\"author\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Advantages of ribbon headers 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":"Advantages of ribbon headers 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\/advantages-of-ribbon-headers-in-web-design\/","og_locale":"en_GB","og_type":"article","og_title":"Advantages of ribbon headers in web design - Pumpkin Web Design Manchester","og_description":"Here at Pumpkin Web Design Manchester, we build websites specifically tailored to the requirements of companies and businesses across Manchester and the North West, including Blackburn and Chorley. We provide the perfect web design solutions for clients in all areas of business and industry. As a result, we have produced this guide to everything you [...]","og_url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/","og_site_name":"Pumpkin Web Design Manchester","article_published_time":"2021-05-24T10:44:52+00:00","article_modified_time":"2023-07-17T16:40:32+00:00","og_image":[{"width":1280,"height":720,"url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-content\/uploads\/2020\/05\/laptop-1209008_1280.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\/advantages-of-ribbon-headers-in-web-design\/","url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/","name":"Advantages of ribbon headers in web design - Pumpkin Web Design Manchester","isPartOf":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website"},"datePublished":"2021-05-24T10:44:52+00:00","dateModified":"2023-07-17T16:40:32+00:00","author":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28"},"breadcrumb":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/advantages-of-ribbon-headers-in-web-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/"},{"@type":"ListItem","position":2,"name":"Advantages of ribbon headers 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\/6757"}],"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=6757"}],"version-history":[{"count":2,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/6757\/revisions"}],"predecessor-version":[{"id":12206,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/6757\/revisions\/12206"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/media\/3244"}],"wp:attachment":[{"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/media?parent=6757"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/categories?post=6757"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/tags?post=6757"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}