{"id":112,"date":"2026-08-06T20:13:18","date_gmt":"2026-08-06T20:13:18","guid":{"rendered":"https:\/\/wwwtest.ucf.edu\/brand\/?page_id=112"},"modified":"2026-10-01T15:04:19","modified_gmt":"2026-10-01T15:04:19","slug":"web-and-digital","status":"publish","type":"page","link":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/","title":{"rendered":"Web and Digital"},"content":{"rendered":"\n<section class=\"wp-block-group alignfull brand-section is-layout-constrained wp-block-group-is-layout-constrained\"><nav class=\"brand-index wp-block-ucf-brand-section-index\" aria-labelledby=\"brand-index-title-1\"><h2 class=\"brand-index__title\" id=\"brand-index-title-1\">UCF HAS STANDARDS FOR:<\/h2><ul class=\"brand-index__list\"><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#planning-a-page\"><span class=\"brand-index__num is-style-meta\">8.1<\/span><h3 class=\"brand-index__label\">Planning a Page<\/h3><\/a><p class=\"brand-index__desc\">Understand what it\u2019s for and what to build it with<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#page-structure-and-content\"><span class=\"brand-index__num is-style-meta\">8.2<\/span><h3 class=\"brand-index__label\">Page Structure and Content<\/h3><\/a><p class=\"brand-index__desc\">Think mobile-first and organize purposefully<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#web-design\"><span class=\"brand-index__num is-style-meta\">8.3<\/span><h3 class=\"brand-index__label\">Web Design<\/h3><\/a><p class=\"brand-index__desc\">Special typefaces, colors and visual elements<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#h-web-accessibility\"><span class=\"brand-index__num is-style-meta\">8.4<\/span><h3 class=\"brand-index__label\">Web Accessibility<\/h3><\/a><p class=\"brand-index__desc\">Specifics on WCAG 2.1 AA as the minimum standard<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#page-performance-and-media\"><span class=\"brand-index__num is-style-meta\">8.5<\/span><h3 class=\"brand-index__label\">Page Performance and Media<\/h3><\/a><p class=\"brand-index__desc\">Be mindful of images, videos and embeds<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#helping-people-find-a-page\"><span class=\"brand-index__num is-style-meta\">8.6<\/span><h3 class=\"brand-index__label\">Helping People Find a Page<\/h3><\/a><p class=\"brand-index__desc\">Search, AI, metadata, URLs and keeping content current<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#prelaunch-checklist\"><span class=\"brand-index__num is-style-meta\">8.7<\/span><h3 class=\"brand-index__label\">PreLaunch Checklist<\/h3><\/a><p class=\"brand-index__desc\">Reminders at a glance<\/p><\/li><li class=\"brand-index__item\"><a class=\"brand-index__link\" href=\"#emails\"><span class=\"brand-index__num is-style-meta\">8.8<\/span><h3 class=\"brand-index__label\">Emails<\/h3><\/a><p class=\"brand-index__desc\"><span class=\"badge\">Content Coming Soon<\/span><\/p><\/li><\/ul><\/nav><\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-paper is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"planning-a-page\" class=\"wp-block-heading\"><strong>Planning a Page<\/strong><\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Before building a webpage, determine what it\u2019s for.<\/strong> Is it a resource, a transaction or one step in a longer journey? If you can\u2019t plainly state the goal, the page is not ready to build.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Start by answering three questions:&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<ol start=\"1\" class=\"wp-block-list is-style-reading-width\">\n<li><strong>Who is it for?<\/strong> If a page is trying to serve multiple audiences, it won\u2019t end up serving any of them.&nbsp;<\/li>\n\n\n\n<li><strong>What do you want the audience to do?<\/strong> Identify the conversion or next step. Is it starting an application, submitting a form, reading and clicking to continue their journey, downloading a document or something else?&nbsp;<\/li>\n\n\n\n<li><strong>Does this information already exist on another page?<\/strong> If so, improve that page instead of building another one. Multiple pages answering the same question differently is how UCF ends up contradicting itself in search results, hurting findability. Be discerning about whether you really need a new page.&nbsp;<\/li>\n<\/ol>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>How will you know it worked?<\/strong> Every UCF page needs Google Analytics and Search Console connected <em>at<\/em> launch, not after.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-style-light-accent is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h4 class=\"wp-block-heading has-body-font-family has-ui-font-size\">Keep in Mind<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">How people reach the page changes what you measure. A page found in search, a landing page behind a paid campaign or a link in an email each need their own view. Know how people are getting there before you set up your measurement.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\"><strong>WHAT TO BUILD WITH<\/strong>&nbsp;<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Start from something already tested. Supported UCF themes, plugins and frameworks are built to meet these standards by default, which is the fastest route to a compliant, on-brand page.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-group hairline is-style-light is-layout-flow wp-container-core-group-is-layout-e4800799 wp-block-group-is-layout-flow\" style=\"border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0\">\n<div class=\"wp-block-group hairline is-layout-flow wp-block-group-is-layout-flow\" style=\"border-bottom-color:var(--wp--preset--color--paper-alt);border-bottom-width:1px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\">\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-icon\"><svg style=\"color:var(--wp--preset--color--gold);background-color:var(--wp--preset--color--black);border-width:5px;width:30px;\" aria-label=\"Go to link\" class=\"has-text-color has-gold-color has-background has-black-background-color has-border-color has-black-border-color\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\">\n\t<path d=\"M10 6H18V14H16.5V8.5L7 18L6 17L15.5 7.5H10V6Z\" \/>\n<\/svg>\n<\/div><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:90%\">\n<h3 id=\"h-ucf-wordpress-themes-and-plugins-nbsp\" class=\"wp-block-heading has-body-font-family has-ui-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10);font-weight:700;line-height:1.2\">UCF WORDPRESS THEMES AND PLUGINS&nbsp;<\/h3>\n\n\n\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"margin-top:0;margin-bottom:0\">These are maintained in the <a href=\"https:\/\/github.com\/UCF\" target=\"_blank\" rel=\"noreferrer noopener\">UCF GitHub organization<\/a> and tested using our accessibility and performance standards. Start here for any WordPress site.&nbsp;<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group hairline is-style-light is-layout-flow wp-container-core-group-is-layout-e4800799 wp-block-group-is-layout-flow\" style=\"border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0\">\n<div class=\"wp-block-group hairline is-layout-flow wp-block-group-is-layout-flow\" style=\"border-bottom-color:var(--wp--preset--color--paper-alt);border-bottom-width:1px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\">\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-icon\"><svg style=\"color:var(--wp--preset--color--gold);background-color:var(--wp--preset--color--black);border-width:5px;width:30px;\" aria-label=\"Go to link\" class=\"has-text-color has-gold-color has-background has-black-background-color has-border-color has-black-border-color\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\">\n\t<path d=\"M10 6H18V14H16.5V8.5L7 18L6 17L15.5 7.5H10V6Z\" \/>\n<\/svg>\n<\/div><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:90%\">\n<h3 id=\"h-athena-framework\" class=\"wp-block-heading has-body-font-family has-ui-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10);font-weight:700;line-height:1.2\">Athena Framework<\/h3>\n\n\n\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"margin-top:0;margin-bottom:0\">This is the front-end framework for consistent UCF styling outside of WordPress. The <a href=\"https:\/\/ucf.github.io\/Athena-Framework\/getting-started\/quick-start\/\">Athena quick start guide<\/a> is the fastest path to a page that already looks and behaves like UCF.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group hairline is-style-light is-layout-flow wp-container-core-group-is-layout-e4800799 wp-block-group-is-layout-flow\" style=\"border-style:none;border-width:0px;margin-top:0\">\n<div class=\"wp-block-group hairline is-layout-flow wp-block-group-is-layout-flow\" style=\"border-bottom-color:var(--wp--preset--color--paper-alt);border-bottom-width:1px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\">\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-icon\"><svg style=\"color:var(--wp--preset--color--gold);background-color:var(--wp--preset--color--black);border-width:5px;width:30px;\" aria-label=\"Go to link\" class=\"has-text-color has-gold-color has-background has-black-background-color has-border-color has-black-border-color\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\">\n\t<path d=\"M10 6H18V14H16.5V8.5L7 18L6 17L15.5 7.5H10V6Z\" \/>\n<\/svg>\n<\/div><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:90%\">\n<h3 id=\"h-the-official-ucf-header\" class=\"wp-block-heading has-body-font-family has-ui-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10);font-weight:700;line-height:1.2\">The official UCF header<\/h3>\n\n\n\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"margin-top:0;margin-bottom:0\">So that every page carries the same identity and baseline navigation, <a href=\"https:\/\/universityheader.ucf.edu\/\">universityheader.ucf.edu<\/a> is a shared, maintained component. It\u2019s required on every page \u2014 no exceptions and no custom rebuilds.&nbsp;<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-light-accent is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h4 class=\"wp-block-heading has-body-font-family has-ui-font-size\">Keep in Mind<\/h4>\n\n\n\n<p class=\"has-body-font-size wp-block-paragraph\">Updated themes and component libraries reflecting the refreshed brand are in development. Anything built on the supported themes or the Athena Framework will carry forward.&nbsp;<\/p>\n<\/div>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-default is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"page-structure-and-content\" class=\"wp-block-heading\">Page Structure and Content<\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>UCF is mobile-first.<\/strong> Most visitors to our sites are on a phone, so we shouldn\u2019t treat mobile like a reduced version of a page \u2014 it <em>is<\/em> the page.&nbsp;&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Design for small screens first and let the layout grow, rather than designing for desktop, then retrofitting into a mobile layout.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Assign One Job Per Page<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Know why someone is coming to your page, and remove everything between them and that goal.&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>Have one primary action per page. Everything else is smaller, quieter or further down.&nbsp;<\/li>\n\n\n\n<li>The primary action should be visible without scrolling, on both mobile and desktop.&nbsp;<\/li>\n\n\n\n<li>Navigation labels should use language the audience would use, not our internal org chart. (Example: \u201cTuition and Aid\u201d instead of \u201cStudent Financial Services.\u201d)&nbsp;<\/li>\n\n\n\n<li>Make it as simple as possible for people to get what they came for.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Make Each Page Scannable<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Most people don\u2019t read an entire page. They scan it to find what they need.&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>Front-load the answer. Let the first paragraph do the heavy lifting.&nbsp;<\/li>\n\n\n\n<li>Use headings every few paragraphs, describing what\u2019s under them.&nbsp;<\/li>\n\n\n\n<li>Write short paragraphs. Three or four lines is typically plenty.&nbsp;<\/li>\n\n\n\n<li>Use a list when the content is a list, instead of writing out an extremely long sentence or paragraph.&nbsp;<\/li>\n\n\n\n<li>Use the same content and heading order on every device. Nothing should get hidden on mobile because it \u201cdidn\u2019t fit.\u201d&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Make It Easy for People to Act<\/h3>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>The action should be the most prominent thing on the page.&nbsp;<\/li>\n\n\n\n<li>Button and link text should describe what happens next. (Example: \u201cStart Your Application\u201d instead of \u201cStart Here.\u201d)&nbsp;<\/li>\n\n\n\n<li>Forms should ask for the minimum. Every extra field means fewer people finish it.&nbsp;<\/li>\n\n\n\n<li>After someone acts, confirm it and tell them what happens next.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">When a Document Should be a Page<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Most PDFs should actually be web pages.<\/strong> A typical PDF can\u2019t be searched properly, can\u2019t adapt to a phone, is usually inaccessible and can\u2019t be updated without republishing the entire file. If the content is information people need, it belongs on a page.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Publish a PDF when the document needs to be printed, signed or filed as a fixed record.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">When you do publish a PDF:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>Use the UCF Documents plugin rather than uploading files directly. It keeps documents tracked, replaceable and consistently linked.&nbsp;<\/li>\n\n\n\n<li>The file needs real text, not a scanned version. A scanned image of a document is unreadable to a screen reader and invisible to search.&nbsp;<\/li>\n\n\n\n<li>Give it a descriptive filename, not something vague like \u201cFinal_v3_UPDATED.pdf.\u201d&nbsp;<\/li>\n\n\n\n<li>If it\u2019s over 5 MB, ask yourself again whether it should actually be a webpage.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-paper-accent is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h4 class=\"wp-block-heading has-body-font-family has-ui-font-size\">Keep in Mind<\/h4>\n\n\n\n<p class=\"has-body-font-size wp-block-paragraph\">These are the practices we apply today. Component-level guidance, including patterns for specific page types, lives in the design system as it\u2019s built.&nbsp;<\/p>\n<\/div>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-paper is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"web-design\" class=\"wp-block-heading\"><strong>Web Design<\/strong><\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">UCF web properties share one design language: a black and gold color palette, Oswald headlines, square corners and a dark navigation bar. All of this signals to the audience that they\u2019re still on a UCF site as they move between pages.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-e1c11e31 wp-block-columns-is-layout-flex\" style=\"margin-top:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-group is-style-light is-layout-flow wp-container-core-group-is-layout-5db3af23 wp-block-group-is-layout-flow\" style=\"border-width:1px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<h4 id=\"h-principles\" class=\"wp-block-heading accent-fill has-line-dark-color has-gold-background-color has-text-color has-background has-link-color has-body-font-family has-ui-font-size wp-elements-1\" style=\"margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">Principles<\/h4>\n\n\n\n<div class=\"wp-block-group is-layout-flow wp-block-group-is-layout-flow\" style=\"padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:0\">\n<ul class=\"wp-block-list\">\n<li class=\"has-body-font-size\">Use square corners on buttons, images, cards and other elements \u2014 no rounded corners or circles.&nbsp;<\/li>\n\n\n\n<li>Use Bold Gold for emphasis and action, but never for body copy.&nbsp;<\/li>\n\n\n\n<li>Allow generous white space.&nbsp;<\/li>\n\n\n\n<li>Photography should lead and graphics should support.&nbsp;<\/li>\n\n\n\n<li>Layout should adapt nicely to any width.&nbsp;<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-group is-style-light is-layout-flow wp-container-core-group-is-layout-5db3af23 wp-block-group-is-layout-flow\" style=\"border-width:1px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<h4 id=\"h-common-mistakes\" class=\"wp-block-heading accent-fill has-white-color has-text-secondary-background-color has-text-color has-background has-link-color has-body-font-family has-ui-font-size wp-elements-2\" style=\"margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">Common mistakes<\/h4>\n\n\n\n<div class=\"wp-block-group is-layout-flow wp-block-group-is-layout-flow\" style=\"padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:0\">\n<ul class=\"wp-block-list\">\n<li class=\"has-body-font-size\">Don\u2019t use gold text on a white background.&nbsp;<\/li>\n\n\n\n<li>Don\u2019t rebuild the university header locally.&nbsp;<\/li>\n\n\n\n<li>Don\u2019t have competing calls to action above the fold.&nbsp;<\/li>\n\n\n\n<li>Don\u2019t use stock imagery as a stand-in for real UCF people.&nbsp;<\/li>\n\n\n\n<li>Don\u2019t use decorative typefaces to replace brand typefaces.&nbsp;<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Color on the Web<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">The web palette is the brand palette, with one addition approved for digital use. The ratio under each color is its contrast against the background named. Text needs at least 4.5:1 contrast ratio for accessibility compliance.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-style-light has-border-color has-line-border-color is-layout-constrained wp-container-core-group-is-layout-f566265b wp-block-group-is-layout-constrained\" style=\"border-width:1px;padding-top:var(--wp--preset--spacing--20);padding-right:var(--wp--preset--spacing--20);padding-bottom:var(--wp--preset--spacing--20);padding-left:var(--wp--preset--spacing--20)\">\n<div class=\"wp-block-ucf-brand-color-swatches brand-swatches\">\n<div class=\"wp-block-ucf-brand-color-swatch brand-swatch\"><span class=\"brand-swatch__chip has-gold-background-color has-background\"><\/span><div class=\"brand-swatch__body\"><p class=\"brand-swatch__name\">Bold Gold<\/p><p class=\"brand-swatch__value\">HEX #EDB80D<br\/>RGB 237 \u00b7 184 \u00b7 13<br\/>Emphasis, actions and accents. Never small text on white. <\/p><span class=\"brand-swatch__ratio is-pass\">11.46:1 on black<\/span><\/div><\/div>\n\n\n\n<div class=\"wp-block-ucf-brand-color-swatch brand-swatch is-label-light\"><span class=\"brand-swatch__chip has-black-background-color has-background\"><\/span><div class=\"brand-swatch__body\"><p class=\"brand-swatch__name\">Black<\/p><p class=\"brand-swatch__value\">HEX #000000<br\/>RGB 0 \u00b7 0 \u00b7 0<br\/>Navigation, footers, dark sections and body copy. <\/p><span class=\"brand-swatch__ratio is-pass\">21:1 on white<\/span><\/div><\/div>\n\n\n\n<div class=\"wp-block-ucf-brand-color-swatch brand-swatch is-label-light\"><span class=\"brand-swatch__chip has-horizon-blue-background-color has-background\"><\/span><div class=\"brand-swatch__body\"><p class=\"brand-swatch__name\">Horizon Blue<\/p><p class=\"brand-swatch__value\">HEX #4A8FBA<br\/>RGB 74 \u00b7 143 \u00b7 186<br\/>Links on web and digital only. <\/p><span class=\"brand-swatch__ratio is-pass\">5.93:1 on black<\/span><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-light-accent is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h4 class=\"wp-block-heading has-body-font-family has-ui-font-size\">Keep in Mind<\/h4>\n\n\n\n<p class=\"has-body-font-size wp-block-paragraph\">Horizon Blue is approved <em>only<\/em> for web and digital links. Do not use it as an accent color.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50)\">\n<h4 class=\"wp-block-heading has-display-font-family has-heading-3-font-size\">Web Typefaces<\/h4>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">On web, we use the licensed digital equivalents of Gotham and URW DIN Condensed (print typefaces): Oswald, Montserrat and Roboto Mono, which load reliably and render consistently across devices. Never substitute with a decorative typeface.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-style-light is-layout-constrained wp-container-core-group-is-layout-7ac86445 wp-block-group-is-layout-constrained\" style=\"border-width:1px;padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h3 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10)\">Oswald<\/h3>\n\n\n\n<p class=\"is-style-meta wp-block-paragraph\">HEADLINES \/ DISPLAY<\/p>\n\n\n\n<p class=\"has-display-font-family has-heading-2-font-size wp-block-paragraph\" style=\"letter-spacing:0.01em;line-height:1.04;text-transform:uppercase\">USE OSWALD FOR HEADLINES<\/p>\n\n\n\n<div class=\"wp-block-group is-style-specimen is-layout-constrained wp-container-core-group-is-layout-9ab0d36d wp-block-group-is-layout-constrained\" style=\"padding-top:var(--wp--preset--spacing--40);padding-right:0;padding-bottom:var(--wp--preset--spacing--20);padding-left:0\">\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:700;text-transform:uppercase\">Print Equivalent: URW DIN Condensed<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-light is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"border-width:1px;margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h3 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10)\">Montserrat<\/h3>\n\n\n\n<p class=\"is-style-meta wp-block-paragraph\">BODY \/ INTERFACE<\/p>\n\n\n\n<p class=\"is-style-default has-body-font-family has-heading-4-font-size wp-block-paragraph\" style=\"font-weight:600;line-height:1.4\">Use Montserrat for body copy. This is lead text. It is meant for intros and callouts because it stands out more than the default copy. Use sparingly.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This is the default copy size. Use this for everyday body copy. Remember to avoid using all caps in body and to follow other writing best practices.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-style-specimen is-layout-constrained wp-container-core-group-is-layout-9ab0d36d wp-block-group-is-layout-constrained\" style=\"padding-top:var(--wp--preset--spacing--40);padding-right:0;padding-bottom:var(--wp--preset--spacing--20);padding-left:0\">\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:700;text-transform:uppercase\">Print Equivalent: Gotham<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-light is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"border-width:1px;margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h3 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--10)\">Roboto Mono<\/h3>\n\n\n\n<p class=\"is-style-meta wp-block-paragraph\">SPECIFICATIONS \/ CAPTIONS<\/p>\n\n\n\n<p class=\"is-style-default has-mono-font-family has-ui-font-size wp-block-paragraph\" style=\"letter-spacing:0.06em;text-transform:uppercase\"><strong>USE ROBOTO MONO FOR SPECIFICATIONS &#8211; FIGURE NOTES &#8211; DATA &#8211; VERY SHORT CAPTIONS&nbsp;<\/strong><\/p>\n\n\n\n<div class=\"wp-block-group is-style-specimen is-layout-constrained wp-container-core-group-is-layout-9ab0d36d wp-block-group-is-layout-constrained\" style=\"padding-top:var(--wp--preset--spacing--40);padding-right:0;padding-bottom:var(--wp--preset--spacing--20);padding-left:0\">\n<p class=\"has-ui-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:700;text-transform:uppercase\">Print Equivalent: None. Web and Digital Use Only.<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-style-light-accent is-layout-constrained wp-container-core-group-is-layout-781ba673 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h4 class=\"wp-block-heading has-body-font-family has-ui-font-size\">Keep in Mind<\/h4>\n\n\n\n<p class=\"has-body-font-size wp-block-paragraph\">The theme automatically applies styling. Do not type in all caps, even for headings. Use title case or sentence case \u2014 whichever is more appropriate for the content. For more guidance and best practices, reference the <strong><a href=\"https:\/\/www.ucf.edu\/brand\/brand\/writing-by-content-type\/#webpage-writing\">writing for webpages<\/a><\/strong> section.&nbsp;<\/p>\n<\/div>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-default is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"h-web-accessibility\" class=\"wp-block-heading\"><strong>Web Accessibility<\/strong><\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">The Web Content Accessibility Guidelines, WCAG 2.2 AA, is the minimum standard for every UCF webpage. It is a legal obligation, and the same work that makes pages faster and easier to find.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Use real alt text.<\/strong> Describe what the image shows and why it\u2019s on the page. Decorative images take empty alt text.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Put headings in order.<\/strong> Have only one H1. Nest headings in order. Never skip a level to get a size you like.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Have enough color contrast.<\/strong> Use 4.5:1 for body text, and 3:1 for large text and interface components. Bold Gold on white always fails \u2014 do not use it.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Enable keyboard access with visible focus.<\/strong> Every interactive element must be reachable by keyboard, with a visible focus indicator.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Have targets big enough to hit with text that survives zoom.<\/strong> Tap targets at least 44\u00d744px with space between them. Text must reflow and stay readable at 200% zoom, without horizontal scrolling.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Provide captions and transcripts.<\/strong> Have captions on all videos and transcripts for all audio. Do not use autoplay with sound.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Use descriptive link text.<\/strong> Write link text that describes where it goes. Do not use generic \u201cclick here\u201d or \u201cread more,\u201d and do not use a URL as the link text. These tell a screen reader nothing and diminish any authority passed through the link.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Test the page with real people<strong>.<\/strong> <\/strong>Automated tools only catch some things. Test with real people, including people using assistive technology.&nbsp;<\/p>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-paper is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"page-performance-and-media\" class=\"wp-block-heading\"><strong>Page Performance and Media<\/strong>&nbsp;<\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">A slow page conveys a careless brand \u2014 and it costs you visitors. Media is almost always the reason a page is slow.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Images<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Every image earns its place, sized for where it lives.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-table is-style-stripes\"><table><thead><tr><th class=\"has-text-align-left\" data-align=\"left\">Asset<\/th><th class=\"has-text-align-left\" data-align=\"left\">Max. File Size<\/th><th class=\"has-text-align-left\" data-align=\"left\">Max Width<\/th><\/tr><\/thead><tbody><tr><td class=\"has-text-align-left\" data-align=\"left\">Full-width hero image<\/td><td class=\"has-text-align-left\" data-align=\"left\">300KB<\/td><td class=\"has-text-align-left\" data-align=\"left\">1920px<\/td><\/tr><tr><td class=\"has-text-align-left\" data-align=\"left\">Inline content image<\/td><td class=\"has-text-align-left\" data-align=\"left\">150KB<\/td><td class=\"has-text-align-left\" data-align=\"left\">1200px<\/td><\/tr><tr><td class=\"has-text-align-left\" data-align=\"left\">Card or thumbnail<\/td><td class=\"has-text-align-left\" data-align=\"left\">60KB<\/td><td class=\"has-text-align-left\" data-align=\"left\">600px<\/td><\/tr><tr><td class=\"has-text-align-left\" data-align=\"left\">Whole page<\/td><td class=\"has-text-align-left\" data-align=\"left\">2MB<\/td><td class=\"has-text-align-left\" data-align=\"left\">&#8211;<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>Use WebP where you can, JPEG as a fallback or AVIF when the platform supports it and size is the priority.&nbsp;<\/li>\n\n\n\n<li>Save PNG for logos, icons or anything that needs transparency. BMP and TIFF have no place on the web.&nbsp;<\/li>\n\n\n\n<li>Export images at the size they\u2019ll actually render. A 4000px photo shrunk by CSS is still a 4000px photo weighing down the page.&nbsp;<\/li>\n\n\n\n<li>Always set width and height so the layout doesn\u2019t jump while the page loads.&nbsp;<\/li>\n\n\n\n<li>Load images further down the page only when the reader scrolls to them. The supported themes do this by default.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Video<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Video should serve the page and the audience, not slow it down.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Embed before you self-host.<\/strong> YouTube and Vimeo carry the compression and streaming load so your site doesn\u2019t have to. This is the one embed that\u2019s justified.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>When self-hosting is the only option (and it usually isn\u2019t),<\/strong> use WebM or MP4 (H.264), 720p recommended (1080p max), under 10 seconds and under 5 MB.<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Set a static placeholder image every time<\/strong> so nothing shifts while the video loads.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Do not use autoplay with sound.<\/strong> A muted, looped background clip is the only exception, and it has to hold still for anyone with reduced motion turned on.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Video headers are reserved for high-impact pages on desktop,<\/strong> campaign landing pages, the flagship homepage or major announcements. Standard content pages should use a static image instead. When a video header is genuinely warranted, keep it within our standards and overlay any text in HTML rather than baking it into the video file.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>No rotating sliders or carousels.<\/strong> Almost no one interacts with them, and the small share who do almost always click the first slide. A single strong image with one clear action outperforms a carousel.&nbsp;<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Embeds<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Default to none. Add one only when the page truly needs it.<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Every embed brings its own scripts, fonts and trackers along for the ride, weight we don&#8217;t control.<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li><strong>Justified:<\/strong> a booking or scheduling tool, a map when location matters, a payment form or a video.&nbsp;<\/li>\n\n\n\n<li><strong>Not justified:<\/strong> a social feed on every page, multiple video players, pop-ups or modals most visitors will never open&nbsp;<\/li>\n\n\n\n<li>Use lazyloading, so it only fires when a reader scrolls to it or clicks.&nbsp;<\/li>\n\n\n\n<li>One embed per page is usually the right number. Two is a signal the page is doing too much.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<h3 id=\"h-core-web-vitals\" class=\"wp-block-heading\">Core Web Vitals<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Google publishes three speed measures and scores every page against them. The better the score, the better the chance of appearing in search results. You can check any page against these measures for free using <a href=\"https:\/\/pagespeed.web.dev\/\" target=\"_blank\" rel=\"noreferrer noopener\">Google PageSpeed Insights<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-table is-style-stripes\"><table><thead><tr><th class=\"has-text-align-left\" data-align=\"left\">Metric<\/th><th class=\"has-text-align-left\" data-align=\"left\">Target<\/th><th class=\"has-text-align-left\" data-align=\"left\">What it measures<\/th><\/tr><\/thead><tbody><tr><td class=\"has-text-align-left\" data-align=\"left\">Largest Contentful Paint<\/td><td class=\"has-text-align-left\" data-align=\"left\">Under 2.5s<\/td><td class=\"has-text-align-left\" data-align=\"left\">How quickly the main content appears<\/td><\/tr><tr><td class=\"has-text-align-left\" data-align=\"left\">Interaction to Next Paint<\/td><td class=\"has-text-align-left\" data-align=\"left\">Under 200ms<\/td><td class=\"has-text-align-left\" data-align=\"left\">How quickly the page responds when tapped<\/td><\/tr><tr><td class=\"has-text-align-left\" data-align=\"left\">Cumulative Layout Shift<\/td><td class=\"has-text-align-left\" data-align=\"left\">Under 0.1<\/td><td class=\"has-text-align-left\" data-align=\"left\">How much the layout jumps while loading<\/td><\/tr><\/tbody><\/table><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-light is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"helping-people-find-a-page\" class=\"wp-block-heading\"><strong>Helping People Find a Page<\/strong>&nbsp;<\/h2>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">Most people arrive at a UCF webpage through a search engine, and a rising number now arrive through an AI assistant. Both search engines and AI assistants read the same page and need the same things from it.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Lead with the answer.<\/strong> If the page answers a question, the first sentence should be that answer. Detail comes after it. This is what gets a page quoted in a featured snippet, a voice result or an AI summary.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>State facts plainly and attribute them to sources.<\/strong> Name the researcher, the ranking body, the credential, the year, etc. A claim that cannot be verified should be removed, not softened to try to make it work. Specific attribution is what makes a passage safe to quote.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Fill in the metadata.<\/strong> The page title is what shows in a search result and browser tab. The meta description never appears on the page, but it\u2019s what sells the click. Meta titles exceeding 50-60 characters and descriptions over 150-160 characters may get truncated. Fill in the social sharing image and description, too, so the page looks right when someone posts it to LinkedIn or texts it to a friend. Reference the writing for webpages section for how to write them.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Mark up the page so machines can read it.<\/strong> Structured data tells a search engine what kind of content the page holds: a program, an event, a person, an FAQ, etc. The supported themes handle most of this for you. If your theme does not, reach out to University Brand and Marketing.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Write a URL People Can Read<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">A URL is part of the page. People read it in search results, paste it into emails and say it out loud.&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list is-style-reading-width\">\n<li>Write in all lowercase, always.&nbsp;<\/li>\n\n\n\n<li>If needed, use hyphens between words, never underscores or spaces.&nbsp;<\/li>\n\n\n\n<li>Keep it short and readable. \n<ul class=\"wp-block-list\">\n<li>Example: \u201cucf.edu\/admissions\/tuition\u201d is better than \u201cucf.edu\/admissions\/tuition-and-fees-information-page.\u201d&nbsp;<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Describe the content, not the campaign or date. Anything with a year in it ages quickly.&nbsp;<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50)\">\n<h3 class=\"wp-block-heading\">Keep the Page Fresh<\/h3>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\">A page isn\u2019t finished when it launches.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Review search queries quarterly.<\/strong> They tell you what people actually came for, which is often not what you built the page to answer. Use what you learn to make improvements.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Audit your pages at least annually.<\/strong> If a page gets almost no visits and nothing links to it, rewrite it or take it down. Set a review date when you publish so this doesn\u2019t depend on someone remembering.&nbsp;<\/p>\n\n\n\n<p class=\"is-style-reading-width wp-block-paragraph\"><strong>Redirect everything you move or retire.<\/strong> Have a 301 to the closest equivalent page, not to the homepage. Deleting a page without redirecting it breaks every link to it, discards the search authority it built and sends visitors to a dead end. If nothing equivalent exists, redirect to the nearest useful parent page. After a migration, check for redirect chains, because a redirect pointing at another redirect slows the page and eventually breaks.&nbsp;<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--50);margin-bottom:0\">\n<h3 class=\"wp-block-heading\">Build for Organic Channels<\/h3>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-columns are-vertically-aligned-top is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:20%\">\n<h4 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"font-weight:700;line-height:1.1;text-transform:uppercase\"><strong>Search engine optimization (SEO)<\/strong>&nbsp;<\/h4>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p class=\"is-style-default has-ui-font-size wp-block-paragraph\">Ranking in traditional search results. Use clear titles and meta descriptions, semantic headings, descriptive links, fast pages and current content.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<div class=\"wp-block-columns are-vertically-aligned-top is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:20%\">\n<h4 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"font-weight:700;line-height:1.1;text-transform:uppercase\"><strong>Answer engine optimization (AEO)<\/strong>&nbsp;<\/h4>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p class=\"is-style-default has-ui-font-size wp-block-paragraph\">Being the answer in featured snippets and voice results. Lead with the direct answer in plain language, then the detail. Use question-shaped headings.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<div class=\"wp-block-columns are-vertically-aligned-top is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:20%\">\n<h4 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"font-weight:700;line-height:1.1;text-transform:uppercase\"><strong>Generative engine optimization (GEO)<\/strong>&nbsp;<\/h4>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p class=\"is-style-default has-ui-font-size wp-block-paragraph\">Being cited by AI assistants. Facts stated plainly and sourced, structured data and content a model can quote without distortion.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<div class=\"wp-block-columns are-vertically-aligned-top is-layout-flex wp-container-core-columns-is-layout-461897f4 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:20%\">\n<h4 class=\"wp-block-heading has-display-font-family has-heading-4-font-size\" style=\"font-weight:700;line-height:1.1;text-transform:uppercase\"><strong>AI overviews<\/strong>&nbsp;<\/h4>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p class=\"is-style-default has-ui-font-size wp-block-paragraph\">Appearing in the summary above search results. The same discipline as AEO, plus demonstrable expertise and authority behind every claim.&nbsp;<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n<\/div>\n<\/div>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-paper is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"prelaunch-checklist\" class=\"wp-block-heading\"><strong>PreLaunch Checklist<\/strong>&nbsp;<\/h2>\n\n\n\n<p class=\"is-style-default wp-block-paragraph\">While this isn\u2019t an exhaustive list, check that you\u2019ve done the basics:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The official UCF header is in place.&nbsp;<\/li>\n\n\n\n<li>You have one H1, with headings nested in order.&nbsp;<\/li>\n\n\n\n<li>Alt text is written for every image that carries meaning.&nbsp;<\/li>\n\n\n\n<li>Contrast is checked \u2014 no gold text on white.&nbsp;<\/li>\n\n\n\n<li>Images are sized within the asset budgets.&nbsp;<\/li>\n\n\n\n<li>The URL is lowercase, hyphenated and readable.&nbsp;<\/li>\n\n\n\n<li>Anything you moved or retired has a redirect.&nbsp;<\/li>\n\n\n\n<li>Title, meta description and social sharing image are filled in.&nbsp;<\/li>\n\n\n\n<li>Google Analytics and Search Console are connected.&nbsp;<\/li>\n\n\n\n<li>You successfully opened and used the page on a phone.&nbsp;<\/li>\n<\/ul>\n<\/section>\n\n\n\n<section class=\"wp-block-group alignfull brand-section is-style-light is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 id=\"emails\" class=\"wp-block-heading\"><strong>Emails<\/strong>&nbsp;<\/h2>\n\n\n\n<p class=\"is-style-default wp-block-paragraph\"><span class=\"badge\">Content Coming Soon<\/span><\/p>\n<\/section>\n\n\n\n<div class=\"wp-block-group is-style-dark-accent is-layout-constrained wp-container-core-group-is-layout-63300db9 wp-block-group-is-layout-constrained\" style=\"margin-top:var(--wp--preset--spacing--60);margin-bottom:var(--wp--preset--spacing--60);padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<p class=\"is-style-default has-body-font-family wp-block-paragraph\" style=\"margin-top:0;margin-bottom:var(--wp--preset--spacing--20);text-transform:uppercase\"><strong>QUESTIONS ABOUT WEB AND DIGITAL EXPERIENCES?&nbsp;<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Reach out to University Brand and Marketing as early as possible.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\" style=\"margin-top:var(--wp--preset--spacing--40)\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-display-font-family has-heading-4-font-size has-custom-font-size wp-element-button\" href=\"https:\/\/www.ucf.edu\/brand\/contact-us\/\">Contact Us<\/a><\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Planning a Page Before building a webpage, determine what it\u2019s for. Is it a resource, a transaction or one step in a longer journey? If you can\u2019t plainly state the goal, the page is not ready to build.&nbsp; Start by answering three questions:&nbsp; How will you know it worked? Every UCF page needs Google Analytics [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1643,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ucf_brand_number":8,"ucf_brand_hero_treatment":"light","ucf_brand_deck":"For many people, their first impression of UCF is online. Our brand pillars, personality, design elements and writing style all have to translate to how we appear on the web \u2014 especially in mobile-first formats.","ucf_brand_hero_note":"<strong>Have a question?<\/strong> We\u2019re here to help. <a href=\"https:\/\/www.ucf.edu\/brand\/contact-us\/\">Reach out early<\/a> to University Brand and Marketing.\u00a0","footnotes":""},"class_list":["post-112","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.3 (Yoast SEO v28.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Web and Digital - Unmistakably UCF<\/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.ucf.edu\/brand\/web-and-digital\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Web and Digital\" \/>\n<meta property=\"og:description\" content=\"Planning a Page Before building a webpage, determine what it\u2019s for. Is it a resource, a transaction or one step in a longer journey? If you can\u2019t plainly state the goal, the page is not ready to build.&nbsp; Start by answering three questions:&nbsp; How will you know it worked? Every UCF page needs Google Analytics [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.ucf.edu\/brand\/web-and-digital\/\" \/>\n<meta property=\"og:site_name\" content=\"Unmistakably UCF\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-01T15:04:19+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.ucf.edu\/wp-content\/blogs.dir\/34\/files\/2026\/09\/brand-bg-head-1600x800-light-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"800\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"13 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/\",\"url\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/\",\"name\":\"Web and Digital - Unmistakably UCF\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.ucf.edu\\\/wp-content\\\/blogs.dir\\\/34\\\/files\\\/2026\\\/09\\\/brand-bg-head-1600x800-light-1.jpg\",\"datePublished\":\"2026-08-06T20:13:18+00:00\",\"dateModified\":\"2026-10-01T15:04:19+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.ucf.edu\\\/wp-content\\\/blogs.dir\\\/34\\\/files\\\/2026\\\/09\\\/brand-bg-head-1600x800-light-1.jpg\",\"contentUrl\":\"https:\\\/\\\/www.ucf.edu\\\/wp-content\\\/blogs.dir\\\/34\\\/files\\\/2026\\\/09\\\/brand-bg-head-1600x800-light-1.jpg\",\"width\":1600,\"height\":800},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web and Digital\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/#website\",\"url\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/\",\"name\":\"Unmistakably UCF\",\"description\":\"Official Brand Guidelines\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.ucf.edu\\\/brand\\\/web-and-digital\\\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Unmistakably UCF\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Web and Digital - Unmistakably UCF","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.ucf.edu\/brand\/web-and-digital\/","og_locale":"en_US","og_type":"article","og_title":"Web and Digital","og_description":"Planning a Page Before building a webpage, determine what it\u2019s for. Is it a resource, a transaction or one step in a longer journey? If you can\u2019t plainly state the goal, the page is not ready to build.&nbsp; Start by answering three questions:&nbsp; How will you know it worked? Every UCF page needs Google Analytics [&hellip;]","og_url":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/","og_site_name":"Unmistakably UCF","article_modified_time":"2026-10-01T15:04:19+00:00","og_image":[{"width":1600,"height":800,"url":"https:\/\/www.ucf.edu\/wp-content\/blogs.dir\/34\/files\/2026\/09\/brand-bg-head-1600x800-light-1.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"13 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/","url":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/","name":"Web and Digital - Unmistakably UCF","isPartOf":{"@id":"https:\/\/www.ucf.edu\/brand\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#primaryimage"},"image":{"@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#primaryimage"},"thumbnailUrl":"https:\/\/www.ucf.edu\/wp-content\/blogs.dir\/34\/files\/2026\/09\/brand-bg-head-1600x800-light-1.jpg","datePublished":"2026-08-06T20:13:18+00:00","dateModified":"2026-10-01T15:04:19+00:00","breadcrumb":{"@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.ucf.edu\/brand\/web-and-digital\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#primaryimage","url":"https:\/\/www.ucf.edu\/wp-content\/blogs.dir\/34\/files\/2026\/09\/brand-bg-head-1600x800-light-1.jpg","contentUrl":"https:\/\/www.ucf.edu\/wp-content\/blogs.dir\/34\/files\/2026\/09\/brand-bg-head-1600x800-light-1.jpg","width":1600,"height":800},{"@type":"BreadcrumbList","@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.ucf.edu\/brand\/"},{"@type":"ListItem","position":2,"name":"Web and Digital"}]},{"@type":"WebSite","@id":"https:\/\/www.ucf.edu\/brand\/#website","url":"https:\/\/www.ucf.edu\/brand\/","name":"Unmistakably UCF","description":"Official Brand Guidelines","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.ucf.edu\/brand\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.ucf.edu\/brand\/web-and-digital\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Unmistakably UCF"}]}},"_links":{"self":[{"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/pages\/112","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/comments?post=112"}],"version-history":[{"count":15,"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/pages\/112\/revisions"}],"predecessor-version":[{"id":1819,"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/pages\/112\/revisions\/1819"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/media\/1643"}],"wp:attachment":[{"href":"https:\/\/www.ucf.edu\/brand\/wp-json\/wp\/v2\/media?parent=112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}