Remember to check for theme updates

Theme updates are pushed out as needed – for example, to accommodate bug fixes, accessibility compliance, or tech/platform changes. Work with your web development team to check for updates at least quarterly to ensure you are running the most recent version of the theme.

Avoid these common mistakes

Below are some of the most common things that should be corrected to provide an accessible and/or consistent user experience across the university's many websites.

“Homepage Hero” blocks are for the site’s homepage only

  • Only use on the site homepage, do not use on subpages (possible exceptions: microsite or special feature)
  • The Homepage Hero H1 title should be the same as the website name, not a tagline or welcome message
  • In most cases, drop "Office of" or "Office" and only use the subject area of the unit/page name (ex: Risk Management, Equal Opportunity)

Use the “Page Hero” block on every page except the homepage

  • Page title (H1 header) and the menu ‘breadcrumbs’ are in this block
  • Photo is optional
  • Disable the right sidenav menu on stand-alone pages with no "child" pages
  • If the right subnav menu covers page content, add a photo to the “Page Hero” block to add space at the top of the page

Page name/title

  • This should be the only H1 headline on the page
  • Page name and menu name should be the same; shorter menu name is OK when it makes sense (ex: FAQ vs. Frequently Asked Questions)
  • Use title case (This is an Example of Title Case)
  • Use a unique name for each page, no duplicates. For example, describe FAQ pages if there’s more than one.
  • Avoid date-specific page names, provide date info on topic-based pages instead.

Headlines (H2, H3, H4, etc.)

  • Do not stylize (bold, italicize, underline) or use punctuation
  • Do not add inline/hyperlinks, which will change the text style
  • Be consistent with use of either sentence case (preferred) or title case
    • Sentence case example (preferred): Grow your academic opportunities
    • Title case example: Grow Your Academic Opportunities
  • Don't duplicate headings, especially on the same page

Links

  • When you link to other pages or documents on your site, don’t copy/paste the full URL into the link field. Instead, start typing the page name into the responsive link field and click on the page/doc when it pops up as a choice. This will keep links from breaking if you move or rename pages.
  • Use descriptive language for call to action link text and inline/hyperlinks
  • Do not use terms like “click here” or “website" for links; see page 17 of the web style guide (PDF)
  • Add file type to descriptive link text if appropriate (ex: PDF, doc, xls)
  • Use the “External link” style for links that take users off your website
  • Buttons are for top priority actions, use them sparingly. Consider a link set or the Link Block instead.

Tables

  • Avoid if info can be displayed in a list or paragraph
  • No empty cells, rows or columns
  • Use table headers (with no empty cells)

Other

  • Don't use a “Quote Block” component at the bottom of the page by the footer (both are large solid red blocks)
  • Do not use third-party embed codes, such as social media feeds
  • If student recruitment is a goal, consider adding “In the Making” campaign language to headlines/text content
  • Avoid text-heavy infographics and images with embedded text

Text content tips

  • Don’t add extra returns to add spacing between headings/paragraphs
  • Avoid using:
    • Exclamation marks, especially in headlines
    • Italics (for better accessibility)
    • All-caps text (for better readability)
    • Acronyms: Spell out first reference.
    • Text in images, text-heavy infographics

Menu structure

Before your site goes live

  • Add your department’s division or parent unit (with link) so that it appears under the university wordmark in the top left corner
  • Review header hierarchy on each page (H1, H2, H3)
  • Make sure the page title is the only H1 on each page
  • Check menu structure
  • Redirects: Make sure old links still drive users to the most-visited pages
  • Alert other departments and units that may be impacted by the change
  • Are your analytics in place?

After your site goes live