{"id":8293,"date":"2021-10-07T11:16:10","date_gmt":"2021-10-07T10:16:10","guid":{"rendered":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/?p=8293"},"modified":"2023-07-17T16:57:01","modified_gmt":"2023-07-17T15:57:01","slug":"important-features-for-effective-hero-typography","status":"publish","type":"post","link":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/","title":{"rendered":"Important features for effective hero typography"},"content":{"rendered":"<p>Hero content is one of the most important areas for any website as this is what your potential customers and clients will see as soon as your website loads. We all know how important first impressions are, and in web design, this is no different. Using typography here to grab attention and make a visual statement is an effective option, as long as this is well considered and well thought out. But what are the important features for effective hero typography? 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\/using-round-cta-buttons-in-web-design\/\">web design<\/a> professionals. And we work with companies and clients around Manchester, and the surrounding region, including <a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-wigan\/\">Wigan<\/a> and\u00a0<a href=\"https:\/\/www.pumpkinwebdesign.com\/web-design-southport\/\">Southport,<\/a> to provide stunning and effective web design solutions. As a result, we have produced this guide to everything you should know about effective hero typography.<\/p>\n<h2><span style=\"font-weight: 400;\">What are the most important features for effective hero typography?\u00a0<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">Hero typography involves using only typography above the fold and this can be incredibly effective for companies and businesses across a wide range of industries. However there are a number of important features to get right to ensure that your hero typography is as effective as possible. These features include:<\/span><\/p>\n<ul>\n<li><span style=\"font-weight: 400;\">Colour<\/span><\/li>\n<li><span style=\"font-weight: 400;\">Imagery\u00a0<\/span><\/li>\n<li><span style=\"font-weight: 400;\">Style<\/span><\/li>\n<\/ul>\n<h3><span style=\"font-weight: 400;\">Colour considerations for hero typography<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">When using only typography above the fold there are a number of factors that can influence the overall effect. Colour is one of the most important of these factors and you should consider:<\/span><\/p>\n<ul>\n<li><span style=\"font-weight: 400;\"><em><strong>Company branding-<\/strong><\/em> choosing an above the fold colour scheme that is in line with your company branding can help to ensure that this is more memorable, and catches attention effectively.\u00a0<\/span><\/li>\n<li><span style=\"font-weight: 400;\"><strong><em>Contrast and effect-<\/em><\/strong> choosing contrasting colours for the typography and the background design or imagery can be a great way to draw attention to the typography, and the words themselves, ensuring that potential customers and clients font simply skip over the important message you are delivering.<\/span><\/li>\n<li><span style=\"font-weight: 400;\"><strong><em>Colour and size-<\/em><\/strong> for certain typography styles, using dark colours for the typography allows the style to be more effective. However to maintain legibility on all devices and screen sizes the typography may need to be larger than usual.<\/span><\/li>\n<\/ul>\n<h3><span style=\"font-weight: 400;\">Hero typography and imagery<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">While hero typography generally refers to typography only above the fold, imagery can still be important. The imagery may start below the level of the typography, in which case it is the role of the typography to direct attention towards the imagery itself. Alternatively imagery can be used as part of the typography design, with the typography itself creating the image or shape that is desired. Either option can be a great way to push the typography design further and to achieve an unusual and interesting design feature.<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">Style considerations for hero typography<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">While the colour and imagery can both be used effectively for grabbing the attention of potential customers and clients, choosing the right style typography is still an important factor. The style of typography you choose should be relevant to the style of your website on the whole and the company branding and character. Effective typography options for the above the fold content include calligraphy fonts, oversized typography and stacked text.<\/span><\/p>\n<p>For more information or professional web design support, get in touch with the team today, here at <a href=\"https:\/\/www.pumpkinwebdesign.com\/website-designers-manchester\/\">Pumpkin Web Design Manchester<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hero content is one of the most important areas for any website as this is what your potential customers and clients will see as soon as your website loads. We all know how important first impressions are, and in web design, this is no different. Using typography here to grab attention and make a visual [&#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>Important features for effective hero typography - 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\/important-features-for-effective-hero-typography\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Important features for effective hero typography - Pumpkin Web Design Manchester\" \/>\n<meta property=\"og:description\" content=\"Hero content is one of the most important areas for any website as this is what your potential customers and clients will see as soon as your website loads. We all know how important first impressions are, and in web design, this is no different. Using typography here to grab attention and make a visual [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/\" \/>\n<meta property=\"og:site_name\" content=\"Pumpkin Web Design Manchester\" \/>\n<meta property=\"article:published_time\" content=\"2021-10-07T10:16:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-17T15:57:01+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\/important-features-for-effective-hero-typography\/\",\"url\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/\",\"name\":\"Important features for effective hero typography - Pumpkin Web Design Manchester\",\"isPartOf\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website\"},\"datePublished\":\"2021-10-07T10:16:10+00:00\",\"dateModified\":\"2023-07-17T15:57:01+00:00\",\"author\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Important features for effective hero typography\"}]},{\"@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":"Important features for effective hero typography - 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\/important-features-for-effective-hero-typography\/","og_locale":"en_GB","og_type":"article","og_title":"Important features for effective hero typography - Pumpkin Web Design Manchester","og_description":"Hero content is one of the most important areas for any website as this is what your potential customers and clients will see as soon as your website loads. We all know how important first impressions are, and in web design, this is no different. Using typography here to grab attention and make a visual [...]","og_url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/","og_site_name":"Pumpkin Web Design Manchester","article_published_time":"2021-10-07T10:16:10+00:00","article_modified_time":"2023-07-17T15:57:01+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\/important-features-for-effective-hero-typography\/","url":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/","name":"Important features for effective hero typography - Pumpkin Web Design Manchester","isPartOf":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#website"},"datePublished":"2021-10-07T10:16:10+00:00","dateModified":"2023-07-17T15:57:01+00:00","author":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/#\/schema\/person\/b2a999c4885984c18f9525b21a017d28"},"breadcrumb":{"@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/important-features-for-effective-hero-typography\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/"},{"@type":"ListItem","position":2,"name":"Important features for effective hero typography"}]},{"@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\/8293"}],"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=8293"}],"version-history":[{"count":3,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/8293\/revisions"}],"predecessor-version":[{"id":12072,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/posts\/8293\/revisions\/12072"}],"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=8293"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/categories?post=8293"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.pumpkinwebdesign.com\/web-design-manchester\/wp-json\/wp\/v2\/tags?post=8293"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}