  {"id":936,"date":"2023-11-03T11:55:29","date_gmt":"2023-11-03T15:55:29","guid":{"rendered":"https:\/\/carleton.ca\/cutheme-docs\/?page_id=936"},"modified":"2024-09-18T20:31:28","modified_gmt":"2024-09-19T00:31:28","slug":"best-practices-examples","status":"publish","type":"page","link":"https:\/\/carleton.ca\/cutheme-docs\/advanced\/module-4-homepage\/best-practices-examples\/","title":{"rendered":"Homepage Components &#038; Best Practices"},"content":{"rendered":"\n<section class=\"w-screen px-6 cu-section cu-section--white ml-offset-center md:px-8 lg:px-14\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n            <div class=\"cu-textmedia flex flex-col lg:flex-row mx-auto gap-6 md:gap-10 my-6 md:my-12 first:mt-0 max-w-5xl\">\n        <div class=\"justify-start cu-textmedia-content cu-prose-first-last\" style=\"flex: 0 0 100%;\">\n            <header class=\"font-light prose-xl cu-pageheader md:prose-2xl cu-component-updated cu-prose-first-last\">\n                                    <h1 class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px text-3xl md:text-4xl lg:text-5xl lg:leading-[3.5rem] pb-5 after:w-10 text-cu-black-700 not-prose\">\n                        Homepage Components &#038; Best Practices\n                    <\/h1>\n                \n                                \n                                    \n\n\n<p>Module 4.3 \u2013 Advanced: Homepage: Best Practices<\/p>\n\n\n\n                            <\/header>\n\n                    <\/div>\n\n            <\/div>\n\n    <\/div>\n<\/section>\n\n\n\n<h2 id=\"step-by-step\" class=\"wp-block-heading\">Step-By-Step<\/h2>\n\n\n\n<p>Here are some best practices to consider and components to include when designing and optimizing your homepage:<\/p>\n\n\n\n<h3 id=\"1-title\" class=\"wp-block-heading\">1. <strong class=\"myprefix-text-bold\">Title <\/strong><\/h3>\n\n\n\n<p>Have a clear, descriptive, and accurate website title  and tagline so that visitors know immediately, at a glance what your site is about.<\/p>\n\n\n\n<h3 id=\"2-introduction-or-welcome-message\" class=\"wp-block-heading\">2. <strong class=\"myprefix-text-bold\">Introduction or Welcome Message<\/strong><\/h3>\n\n\n\n<p>Including a brief introductory text or a welcome message can provide context and a warm invitation to explore further. This is also useful to tell search engines what your site is all about.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"688\" src=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-1024x688.png\" alt=\"Website title and tag line\" class=\"wp-image-964\" style=\"aspect-ratio:1.4883720930232558;width:490px;height:auto\" srcset=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-1024x688.png 1024w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-320x215.png 320w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-512x344.png 512w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-768x516.png 768w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x-1536x1032.png 1536w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-14.34.06@2x.png 1578w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 id=\"3-quality-imagery\" class=\"wp-block-heading\">3. <strong class=\"myprefix-text-bold\">Quality Imagery<\/strong><\/h3>\n\n\n\n<p>Visual content, such as captivating banners, images, and videos, can create an immediate impact.<\/p>\n\n\n\n<h3 id=\"4-service-highlights\" class=\"wp-block-heading\">4. Service Highlights<\/h3>\n\n\n\n<p>Showcase your main services on the homepage with visuals, brief descriptions, and links for more details. Make it very easy for visitors to see your offerings. <br><strong class=\"myprefix-text-bold\"><em class=\"myprefix-text-italic\">Tip: <\/em><\/strong><a href=\"https:\/\/carleton.ca\/cutheme-docs\/advanced\/module-4-homepage\/featured-cards\/\">Use the Featured cards block<\/a><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"464\" src=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-1024x464.png\" alt=\"What we offer\" class=\"wp-image-971\" style=\"aspect-ratio:2.2086167800453516;width:693px;height:auto\" srcset=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-1024x464.png 1024w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-320x145.png 320w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-512x232.png 512w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-768x348.png 768w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x-1536x695.png 1536w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.15.33@2x.png 1948w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 id=\"5-latest-news-updates\" class=\"wp-block-heading\">5. Latest News\/Updates<\/h3>\n\n\n\n<p>Highlight recent news, blog posts, or events to keep your audience informed and engaged.<\/p>\n\n\n\n<h3 id=\"6-featured-content\" class=\"wp-block-heading\">6. <strong class=\"myprefix-text-bold\">Featured Content<\/strong><\/h3>\n\n\n\n<p>Showcase featured content or sections that are most relevant to your target audience.<\/p>\n\n\n\n<h3 id=\"7-pathways-to-find-more-information\" class=\"wp-block-heading\">7. <strong class=\"myprefix-text-bold\">Pathways to Find More Information <\/strong><\/h3>\n\n\n\n<p>Use elements on your homepage to draw your reader further into your site to explore key information.<\/p>\n\n\n\n<p>Our homepage includes an index where visitors can easily jump to any topic if they have a specific question.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"604\" src=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-1024x604.png\" alt=\"Index of topics on homepage\" class=\"wp-image-973\" style=\"aspect-ratio:1.695364238410596;width:553px;height:auto\" srcset=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-1024x604.png 1024w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-320x189.png 320w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-512x302.png 512w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-768x453.png 768w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x-1536x906.png 1536w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.16.52@2x.png 1576w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 id=\"8-primary-call-to-action-cta\" class=\"wp-block-heading\">8. <strong>Primary Call to Action (CTA)<\/strong><\/h3>\n\n\n\n<p>Your homepage should feature a prominent primary CTA that encourages visitors to take a specific action, such as applying or contacting you for more information. <\/p>\n\n\n\n<p>On this site, we encourage visitors to &#8220;Get Started&#8221; on cuTheme training by clicking the button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"563\" src=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x-1024x563.png\" alt=\"call to action button\" class=\"wp-image-975\" style=\"aspect-ratio:1.8188277087033748;width:459px;height:auto\" srcset=\"https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x-1024x563.png 1024w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x-320x176.png 320w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x-512x282.png 512w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x-768x423.png 768w, https:\/\/carleton.ca\/cutheme-docs\/wp-content\/uploads\/sites\/2\/2023\/11\/CleanShot-2023-11-03-at-15.18.26@2x.png 1374w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 id=\"try-it-out\" class=\"wp-block-heading\">Try it Out!<\/h2>\n\n\n\n<p>Examine your homepage components:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Do you have a clear title and tagline?<\/li>\n\n\n\n<li>Do you have a clear call to action?<\/li>\n\n\n\n<li>Are there any achievements, news or upcoming events that you could feature?<\/li>\n\n\n\n<li>Is there one component that you can add or change to impact the effectiveness of your homepage?<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/carleton.ca\/cutheme-docs\/mastery\/module-1-text-block-mastery\/\">Next: Text Block Ninja Moves<\/a><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Step-By-Step Here are some best practices to consider and components to include when designing and optimizing your homepage: 1. Title Have a clear, descriptive, and accurate website title and tagline so that visitors know immediately, at a glance what your site is about. 2. Introduction or Welcome Message Including a brief introductory text or a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":532,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_cu_dining_location_slug":"","footnotes":"","_links_to":"","_links_to_target":""},"cu_page_type":[11],"class_list":["post-936","page","type-page","status-publish","hentry","cu_page_type-general"],"acf":{"cu_post_thumbnail":false},"_links":{"self":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/936","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/comments?post=936"}],"version-history":[{"count":5,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/936\/revisions"}],"predecessor-version":[{"id":4290,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/936\/revisions\/4290"}],"up":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/532"}],"wp:attachment":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/media?parent=936"}],"wp:term":[{"taxonomy":"cu_page_type","embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/cu_page_type?post=936"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}