Skip to main content

Making Accessible Websites

Websites that commit to accessibility create an experience that is inclusive for people with a wide range of abilities. It's not just the law; it is key to making a better website for everyone.

Your Obligations as a Content Creator

If you are adding content to the SCU website, it must be accessible to anyone regardless of ability. This includes webpages as well as other content, such as PDFs, Office documents (Powerpoint, Excel, and Word), audio, and video. The University has adopted the WCAG 2.0/AA guidelines as a technical standard for determining accessibility, but all content creators are encouraged to design with best practices for accessibility in mind. 

Checking Your Website for Accessibility

Read Guidance on Web Accessibility and the ADA and use the Sa11y tool available in T4 preview. Sa11y is a quick way to identify and correct the most common issues while working in T4. For a more extensive accessibility check, you can automate your accessibility audits and monitor all your pages for common issues with SiteImprove.

WebAIM's Web Accessibility Evaluation Tool (WAVE) is another great tool for checking the accessibility of your website. It produces a detailed report of accessibility errors, warnings, and features, along with information on how to address any issues that may arise during a check.

Common Accessibility Errors

  • Images lack descriptive alternative text. Provide a text alternative for images. This is set by the Description field in TERMINALFOUR, and the Caption field in LiveWhale Calendar.
  • Images of text: Don't rely on images to provide important information. Ensure that the same content is available (or can be described equally) in a text format.
  • Empty headings: Make sure there are no empty headings on your website.
  • Contrast: Text should be discernible, providing adequate contrast (hero images, in particular).
  • Empty links: Links need text to relay link information to an assistive device.
  • Images as Links with No Alt: An image without alternative text results in an empty link.
  • Heading structure: Use the correct heading structure (don’t skip heading levels).

Resources

W3's Accessibility Before/After shows the difference between an inaccessible page and an accessible page, including helpful annotations.

Web Content Accessibility Guidelines (WCAG) Overview - Learn about the WCAG 2.0/AA specification, which is the technical standard that webpages are compared against per the Santa Clara University Accessibility Policy.

Vox Product Accessibility Checklist - A multi-role checklist for accessible websites and products.