Content Guide

Accessibility

URI’s website is for everyone. The institution embraces equity, diversity, and inclusion, and its website must communicate the same. 

As a state institution, we aim to be compliant with the Web Content Accessibility Guidelines (WCAG) v2.1, Level AA, the technical standard for website accessibility under the Americans with Disabilities Act (ADA). As a site editor maintaining one or more public University websites, the content you publish must abide by this standard. Familiarize yourself with the best practices outlined here to help ensure your site works well for everyone.

Web Accessibility at URI

Images and videos

  • Use alternative text for images: Always include appropriate “alt” text for images.  Alt text helps visitors using assistive technology understand your web content. In WordPress, add alt text through the Media Library after uploading or before adding to a page or post.
  • Avoid text in images: While it’s possible to use alt text as a stand-in for text embedded in images, it’s best to keep text separate. Text that’s contextually important to the page should never be included in an image.
  • Ensure videos have captions: All videos must be closed captioned. Those that aren’t must provide a transcript, and synchronized media presentations should have an audio description as well. Avoid using videos to display text that should otherwise be in the body of the page.

Learn about all success criteria for site editors

Design and interaction

  • Use sufficient contrast: Text must have sufficient contrast against backgrounds, and should generally not be layered over images. Some components, like heroes, are specifically designed for this purpose, but particularly busy or high-contrast images may still make reading text difficult. If any part of the text becomes illegible at any screen size, consider a different image or place the text elsewhere.
  • Use color appropriatly: People who are color-blind may see certain elements differently than intended. If you are not color-blind, use a tool like Sim Daltonism to understand how different types of color blindness impact the way text, images, and other elements may appear, and ensure that all elements are meaningful and legible to everyone.
  • Test your pages on a small screen: Many URI pages are primarily viewed on a phone. Your page must work well on small screens. Tip: design first for a phone, second for a larger display.
  • Avoid instructions on how to use a page: If your page requires instructions, redesign it. Most content can be designed intuitively for the intended audience, and unnecessary language can be avoided. For example, visitors already know how forms work; there’s no need to use language such as, “fill in the form below.”
  • Avoid opening links in new windows: Research indicates that new windows make it harder for your visitor to browse your site.

Learn about all success criteria for site editors

Writing

  • Use plain language: Simple and positive language makes it easier for the public to read and understand our website. Consider visitors who aren’t fluent in English or otherwise struggle with reading by avoiding excessive acronyms, jargon, or clever homophonic substitutions.
  • Use proper headings: Assistive technology relies on heading elements and other HTML markup to navigate a page’s content structure. Heading hierarchy is more important than visual styling. Avoid skipping over a level when nesting content (e.g. follow an H2 with an H3, not an H4).
  • Use engaging link text: A good link informs the visitor what it is without reading the content around it. It can be a few words. Including a verb in your link text can be helpful. Do not use “click,” “tap,” or any other hardware reference.
  • Avoid FAQs: Frequently asked/anticipated questions can be overwhelming and are known to be a visitor’s last resort and source of frustration. Instead, organize your content intuitively.
  • Avoid describing where elements appear: On a big monitor, something might be on the right, but on a smaller screen, it may appear below.  Either link directly to the resource or reference it without describing its location.

Learn about all success criteria for site editors

Success criteria for site editors

WCAG 2.1 defines 50 success criteria for Level AA compliance. While many criteria are met at the level of the theme and component library, beyond the scope of responsibilities for site editors, some are entirely dependent on content.

With that in mind, we’ve identified a subset of the WCAG 2.1 Level AA criteria that, based on how public websites are managed at URI, directly apply to the scope of routine site editing. You’ll notice that the best practices outlined both on this page and in many areas of the Content Guide align with one or more of these criteria. We may update this list if we identify other rules that site editors need to be aware of.

RuleDescription
1.1.1All images and non-text content must have a text alternative.
1.2.1All video-only and audio-only content must have a text transcript, labeled and accessible.
1.2.2All videos with sound must have closed captioning.
1.2.3Videos must have transcripts or audio descriptions if necessary information isn’t audible.
1.2.4Formal live presentations must have closed captions.
1.2.5Audio descriptions are required, providing both transcripts and audio descriptions is best.
1.3.1Use proper HTML markup to structure content programmatically accessible.
1.3.2Present content in a meaningful sequence for readability.
1.3.3Instructions should not rely on a single sensory ability.
1.4.1Do not use color alone to convey information.
1.4.3Ensure color contrast ratios meet minimum requirements.
1.4.5Do not use images of text unless necessary (e.g., logo).
1.4.11All meaningful non-text content (e.g., buttons, form fields, icons) on your website should have a minimum 3:1 color contrast ratio to ensure they stand out.
1.4.13Make it so any additional content (e.g., pop-ups, submenus) can be dismissed or remain visible if the user desires.
2.4.2Each page of a website needs to have a unique and descriptive title.
2.4.3Users must be able to navigate through the website in a logical order that preserves meaning.
2.4.4The purpose of each link should be clear from its anchor text.
2.4.5There must be multiple ways to find different pages and content on a website.
2.4.6Headings and labels must be clear and descriptive.
3.1.2Indicate any language changes within the content or for the entire page.
3.2.3Keep navigation links and layout consistent throughout all pages of the website.
3.2.4Components that have the same function within a website are consistently identified.
4.1.1Ensure HTML code is clean and free of errors. All HTML elements must be properly nested and closed.