Washington University strives to make our web content accessible for all site visitors, including people who have physical or cognitive impairments and those using assistive technology. More details about accessibility at WashU are provided on the digital accessibility website.
In fact, by following international standards for web accessibility, we improve usability for web visitors of all abilities – while also racking up bonus points for search engine optimization (SEO) and mobile usage. (But you don’t have to take our word for it: Read the Bureau of Internet Accessibility’s eight reasons leadership should care about accessibility. Their reasons run the gamut from legality to social responsibility to security.)
If you manage a Washington University website, we need your help to uphold the university’s commitment to ensuring that its electronic and information technology is accessible to students, prospective students, employees and visitors with disabilities.
Assistive technology spotlight: Screen reader demo
This video from the University of Colorado-Boulder demonstrates a Google search and site visit using a screen reader, a common tool for people with visual impairments.
You’ll quickly recognize how accessibility and usability choices make all the difference for visitors to your site.
What you can do
If you manage a website, you can can help first and foremost by thinking inclusive and keeping accessibility in mind. Below are a few steps to keep you on track.
If you have a WashU Site (that’s “Sites” with a capital “S”)
Not sure if you have a WashU Site?
WashU Sites are requested through sites.wustl.edu. They’re built in the WashU Web Theme or the WUSM Web Theme. If your site is not in one of these themes, it is not a WashU Site.
- The code is already up to code.
WashU Sites are already built and tested for compliance with the World Wide Web Consortium (W3C)’s Web Content Accessibility Guidelines (WCAG) 2.1, Level AA. Testing is ongoing as W3C’s standards are updated and practices evolve. To report an issue, contact the WashU Sites support team.
- The content is up to you.
Make sure the content you add – including text, images and video – is accessible. The guiding principles and checklist below will point you in the right direction.
Pro tip: Use the tutorials!
Web accessibility is important to every aspect of a site’s content. That’s why accessibility practices are integrated into all WashU Web Theme tutorials.
If you come across steps in a tutorial that seem unnecessary (“why add alt text if it isn’t visible on the page?”), it’s likely a step that improves accessibility, as well as SEO and general usability. If you skip these steps, your site may appear just fine. However, some visitors to your site – perhaps those using assistive technologies, mobile devices, outdated browsers or slow Internet connections – may run into trouble.
If you have a non-WashU Site
- If you’re using a vendor: Get information about working with vendors on the WashU digital accessibility site.
- If your developer is on-campus: Make sure they are familiar with accessibility at WashU by sharing the digital accessibility site.
- Either way: Triple check the content.
Make sure all content is available in readable text form. The guiding principles below will help you get started.
If your site has essential course, application, registration or compliance information
- Prioritize Americans With Disabilities Act Title III compliance.
Web accessibility is of utmost importance on websites that provide essential course, application and compliance materials.
- Use your experts.
If you would like a professional web accessibility assessment, contact the WashU Sites support team.
It takes both solid coding and thoughtful content to make a site accessible. If you’re using a non-WashU Site, please ensure the site is coded to accessibility standards, in addition to following the content guidelines below.
1. Text-based information is key
Text-based content is at the core of what WCAG calls the perceivable principle for accessibility. (WCAG’s four overarching principles are summarized nicely by Eric Grzymkowski of Oho Interactive.)
By text-based, we mean actual text on page, rather than words that are part of an image or spoken — but not captioned or transcribed — in a video or audio file. Importantly, this text-based content can be read by search engines like Google, as well as screen readers.
An easy way to test if content is text-based is to try highlighting it with your cursor. If you can highlight it, it’s text-based. If you can’t, you need to provide a text alternative. Try this test with the text in the teal box above, and you’ll find that you can’t highlight the text – all you do is drag the image. That’s an accessibility fail.
Images, videos and audio files are not text-based. To make this content accessible, you simply need to complement media files with real text by providing these alternatives:
- For images, including graphics and photos:
Recognize that some visitors to your site will be unable to see images, perhaps because of visual impairment or page-loading issues. With these users in mind, include descriptive alternative text for images. Skip the alt text if the image is decorative rather than informative or if descriptive text would be redundant.
- For videos and audio clips:
Include captions and/or transcripts. This benefits those with hearing impairments, as well as people who aren’t using speakers or headphones.
What’s so great about real text?
Unlike words locked in images or videos, text-based content is:
- Readable by screen readers, search engines and translation tools
- Adjustable, by the user, in size, color and contrast
- Automatically updated to match fonts as a website’s styles evolve
All of this makes text-based content inclusive, accessible, dynamic and discoverable! (You thought we were going to say something about “synergy,” didn’t you!)
2. Chronology matters.
People using screen readers experience your site linearly. People who rely on their keyboard instead of a mouse access links and form fields in the order they appear on the page and in the code.
Web experts Kinneret Yifrah and Rotem Binheim of InVision advise thinking top-down and left to right.
Place labels and descriptions before form fields, rather than after.
Avoid tables when possible. They’re tough to read on mobile screens (and sometimes even desktop), hurt search engine optimization (SEO), and can be frustrating to navigate and comprehend using a screen reader. If you do include tables, follow these tips and tricks from W3C.
Non-WashU Web Theme sites
Keyboard accessibility is one of the most important aspects of web accessibility. You can test keyboard access by navigating your site with the tab key instead of a mouse.
Important factors in keyboard accessibility:
- Logical navigation order
- Focus indicators
- “Skip to content” links
3. Formats and styles carry extra weight.
Visitors using screen readers “scan” pages by skipping to subheadings and links, as demonstrated in the video near the top of this page.
Make link text unique and descriptive. (Just say no to links that say “click here” or “read more.”)
Use subheadings generously to break up content sections. Prioritize clarity over clever-ity (see what we did there?) and use your site’s pre-set heading styles (h2, h3, h4), so visitors can reliably use subheadings as de facto bookmarks on a page.