KU CMS - Common Errors


Here are some common errors experienced by users across the KU CMS as they work to create their KU Sunflower sites.

Inaccessible PDFs/Documents

All PDFs/documents hosted on KU CMS sites must be accessible. Some PDFs have only a small set of issues that can be quickly fixed. However, some will require more time and effort to remediate. You are responsible for checking and remediating them all if they are to remain on your KU CMS site. We encourage you to consider converting PDFs to webpages whenever possible.

See Documents for more information, including recommended strategies and remediation help.

Video Captioning

Without exception, all videos hosted (i.e., embedded) on your KU CMS site must include captions - including videos with little or no talking. Additionally, those captions must be accurate (i.e., correctly transcribed, lined up accurately with the video, and free of misspellings). Captions should also include audio descriptions for music and important visual-only elements.

See Videos for more information about captioning.

Consistency

Headers, Sections and Buttons

Although KU CMS Sunflower provides a lot of options (e.g., header sections, buttons, dividers, etc.), you should use them sparingly to create the best user experience. Instead, identify a select group of elements that best meet your design needs and deploy them similarly across the site. Consistency in your choices will help determine how quickly your users understand how your site works.

Case Consistency - Headers and Links

For scannability and ease of use, we strongly recommend using title case for page titles, headers and main menu link titles:

Examples:

  • Sentence case: Our research
  • Title case: Our Research
  • Sentence case: Who we are
  • Title case: Who We Are

In title case, all nouns, pronouns, verbs, adjectives, and adverbs are capitalized. The only words that are not capitalized are prepositions, articles, and conjunctions unless they are the first or last word.:

  • Prepositions (e.g., in, at, to, of, on, etc.)
  • Articles (e.g., an, a, the)
  • Conjunctions (e.g., for, nor, but, or, yet, so)

Using sentence case in page titles, header class headers and main menu link titles:

For headers in particular, using title case helps to set the header text apart and make it easily scannable. Using title case for headers also immediately signals to users that the text is a header providing context for the the copy that follows. Using sentence case for headers may cause the user to have to work to determine if the text is emphasized text, a pull quote, or a header.

IMPORTANT: The key is to have a consistent presentation of case/capitalization across your site. So, whatever case style you choose, it should be consistent sitewide.

Descriptive Link Titles

Link titles must be descriptive and tell the user succinctly what resource they will find if they follow the link.

Why? Because links titles may be read aloud by screen readers independent of the contextual information near the link. Imagine hearing a list of link options without context that said, “Link: click here, Link: website, Link: learn more.” Now imagine the same list with descriptive text: “Link: KU CMS Guide, Link: KU Admissions, Link: Our Research.”

Examples of common non-descriptive links include “Click here,” “here,” “website,” and “learn more.” Here are some example pairs showing incorrect and correct link titles:

Incorrect: For more information, click here.
Correct: For more information, see KU CMS Guide.

Incorrect Link Title: See KU Admissions website for more information.
Correct Link Title: See KU Admissions for more information.

Incorrect Link Title: Learn more
Correct Link Title: Learn more about our research

How Do I Know if My Link Titles Are Descriptive?

To assess your link titles to see if they are descriptive, read all the links on your page aloud as a list. If your link titles provide enough information for a user to make an informed decision, you are good to proceed. But, if the link title is too vague, add the necessary detail so they can make an informed choice.

Specified Non-Descriptive Link Titles Allowed on Select Sections

A feature has been added that makes it possible to use a specified list of approved non-descriptive link titles on select KU Sunflower sections. See Specified Non-Descriptive Link Titles Allowed on Select Sections for details.

Document Link Titles

All links to documents and audio/video files on KU CMS site must state explicitly in the link title what the user will find – instead of a webpage - if they select the link. Why? Because link titles need to tell users if they will be taken to a destination other than a webpage. This is important for all users, but especially for those who are experiencing your site via screen reader.

URLs as Link Titles

Link titles must be descriptive and tell the user succinctly what resource they will find if they follow the link. Although URLs tell users literally where they will go, they do not always provide the context. For example, if you already know what CMS means, the URL https://cms.ku.edu might be meaningful to you. But, if you do not know what that means, the descriptive link title KU CMS Guide would provide the context you need to decide if you want to select that link.

Additionally, screen readers read the entire URL letter-by-letter. URLs are often quite long and contain information that may be confusing or irrelevant to the user, which is both unpleasant and time consuming.

Absolute URLs for Links to Internal Pages

When creating links on your KU CMS site, be sure to use relative URLs for your internal pages (e.g., /yourpagename or /node/#). Do not use absolute URLs (i.e., full URL with your development site name) or those links will break automatically when your new site goes live.

  • A relative URL assumes that the page you are linking to is on the site and provides only the specific page path or the node (e.g., “/yourpagename” or “/node/427”).
  • An absolute URL is when you provide the full path that includes the site name: yoursitename.cms-dev.ku.edu/yourpagename

See URLs for more, including the best way to create relative URLs in Drupal.

Improper Use of Headers

Headers and sub-headers (a.k.a., headlines and sub-headlines, headings and sub-headings) are a critical element of website design, organization and writing that is too often overlooked. Users should be able to find what they are looking for on your website by reading your headers and sub-headers only. Headers have a direct impact on the usability and searchability of your site.

Common Header-related Errors:

  • Headers are not concise/simple
  • Headers do not reflect the words users would use to search for that information
  • Header classes have been applied to statements/long sentences that are not actually headers in the page organization scheme
  • Header classes are used out of order (i.e., H1, H2, H3…)
  • Headers are used for aesthetics (e.g., font-size, bold) instead of organization and searchability
  • Header classes have been unnecessarily bolded

See Headers for more information, including guidelines and best practices.

Header Classes – Out of Order

All pages must follow the basic logic for header classes H1, H2, H3. For example, an H3 cannot occur prior to the establishment of an H2. Only one H1 can appear on any page.

See Headers for more information, including guidelines and best practices.

Header Classes - Used for Aesthetics

All headers across your site should be strategic and reflect page organization, not aesthetics like font-size and boldness. Header class styles can be changed using CSS. See “KU Custom Classes to Mimic Header Styles” on Headers for more information.

Web Writing

The single most important thing you can do to improve your website is have audience-centered content that follows web writing guidelines and best practices. No other strategy has greater potential to positively impact the effectiveness of your website than good web writing.

Common web writing errors include:

  • Overly dense text making it difficult to scan and find information
  • Need to add bullets and break up paragraphs to make pages more scannable
  • Text not tailored for specific audiences
  • Headers not well written and/or used properly

See Web Writing for information, including guidelines and best practices. 

See Web Writing Checklist for a checklist-style resource.

Pages Not in the Site Menu

The majority of your pages should be findable in the site menu system. Without question all pages that contain important information for your primary audiences belong in the menu. Unless you have a strategic reason not to, put the pages on your site into the menu system.

Why? Users seek information in different ways. Some use the site search. Some start on the homepage and move organically from there. Some use the site menu to find what they are looking for. You want to make it easy on users to find what they are looking for regardless of how they prefer to use the site. If your pages are not in the menu, you remove a primary method of information seeking and increase the likelihood those pages will not be found by some users.

There are some instances where pages can/should remain outside of the site menu system.

Examples of Pages That Can Site Outside the Menu:

  • End of the trail pages - These pages typically contain information about a single topic, but have too much information to be included on a primary page.
  • Temporary One-off pages - Special pages for temporary topics
  • Special landing pages - These pages are often marketing pages designed to deliver users from paid advertising to a special landing page rather than start users on the site homepage. 

Images

Common image-related errors include:

  • Images do not have alternative text
  • Images are pixelated due to lack of quality
  • Images do not add value for the user

Stock Photography and Images Without Value for Users

When selecting photos for your site, it is important to avoid two kinds of images:

  1. Stock photography (i.e, stock photos from non-KU sources)
  2. Images that do not add emotional or contextual value in direct support of the information on a page

These kinds of images can damage the user experience because they do not provide clear and meaningful value to your users – and it puts a literal barrier between your users and the information they are seeking.

This is especially important in header sections and tops of pages. It is far better to begin with text information that adds value for users than to force them to scroll past an image that provides only aesthetic value.

Images you do not have clear and verifiable rights to use are not permitted on KU CMS websites.

Avoid Images as Text

Whenever possible, avoid using images/graphics that contain large amounts of text. Common examples include graphs and charts, screenshots, etc. If you can, put the text and graphics on the page rather than using a single image to convey the information.

Why? It is difficult to properly describe extensive/complex text and graphics for users experiencing your site via screen reader. The more information in the image, the greater your burden to use alternative text and/or description fields to properly convey the salient details of the image.

Submit Your First Site for Review Before Submitting Additional Sites

Many CMS site administrators have more than one site to migrate/develop.

We strongly recommend developing one of your sites first and then submitting that site for review before you begin work on further sites. This allows you to go through the review process and leverage the feedback you receive as you develop additional sites.

It is much easier to carry any lessons learned forward as you create new pages than it is do go back and correct issues across an entire site that has already been created.

If you have already started developing multiple sites, that is totally fine. We still recommend you submit one of your sites ahead of the others and then translate the feedback you receive to the other properties before submitting them for review.

Connecting Your Link Title, Page Title, URL and H1 Header

The concepts of continuity and consistency in the user journey are among the guiding principles of user experience (UX) in web practice.

To avoid making users work to understand if they have arrived at their intended destination, it is important that a given page’s link title, page title, URL, and H1 header are closely connected.

A user should be able to select a link title and then find a page title, URL, and H1 header that all instantly reassure them of a successful navigation choice. Page titles and H1 headers can be more detailed than the link title, but they should include the same words in the link title to instantly signal success.

Additionally, the H1 header is critical to your site’s searchability/SEO. It’s important that headers – especially H1 and H2 – are written as concisely as possible and using the “terms” your users are likely to use when searching organically for that content. See Headers for more info, including guidelines and best practices. 

Examples:

Less Effective User Journey

  • Link title: About
  • Page title: About [Organization name]
  • URL: /about
  • H1 Header: We Are Here to Serve Our Customers

More Effective User Journey

  • Link title: About
  • Page title: About [Organization name]
  • URL: /about
  • H1 Header: 1) About; 2) About Us; 3) About [Organization name]