To create a truly vibrant learning, research, and teaching environment, the University needs the full participation, contribution, and engagement of every person in our community. That means everyone must be able to access all our resources and programs, including those that are online.

People often think of physical services when they hear the term accessibility—e.g., wheelchair ramps, automatic doors, ASL interpreters, or braille textbooks. But when it comes to the Internet, accessibility looks a little different.

Defining Digital Accessibility

A website is deemed digitally accessible when it can be easily understood and navigated by a wide range of users—including those with visual, motor, cognitive, or auditory disabilities. An accessible website gives users who may or may not use assistive technology, like a screen reader, an equivalent experience as other users. This includes everything from considering your use of color to coding that a screen reader correctly interprets.

Accessible Web Design

There are advanced tools that designers may utilize, but it needn’t be that complicated. These simple guidelines make a big difference when it comes to the usability of a website:

• Heading tags should be used to break up sections of a page. By headings, we mean actual <H1> or <H2> tags—not just larger, bolded text. Headings should have a meaningful hierarchy and highlight major points on a page. Screen readers use heading tags to scan the page so users can jump to relevant sections without having to read every word.
• Consider your use of color. Visually impaired or color-blind users may have difficulty using sites with low color contrast or that use color as the only means of conveying information. It is best practice to use black text on a light background or white text on a dark background. In addition, when creating a chart or graph, consider using patterns (solid, striped, dotted) in addition to color to distinguish sections, bars, or lines.
• Use meaningful ALT text on all images. Don’t just write “map” – instead say “map of outdoor wi-fi locations.” If the image is purely decorative and doesn’t meaningfully enhance understanding of the content, use an empty ALT tag (alt="")—if you leave out the ALT tag entirely, a screen reader may say the image’s file name instead. Also, avoid communicating key information only in a graphic. Put dates, times, contact information, and other critical data in the text.
• Embed URL links instead of writing out the full URL. Screen readers read the hyperlink in addition to the linked text. Hearing it twice makes it more difficult to understand. Instead, embed the link within meaningful text that describes where the link leads. Rather than “Click here” or “Read More,” try “Download the LastPass browser extension” or “Read more about digital accessibility.”
• Use tables to organize data, not to format a page. Screen readers treat tables differently than text. It reads the column header and then the cell’s contents. A screen reader might read a table of tax forms as: “Form: 1099 Miscellaneous. Purpose: Reporting non-employment income. Effective Date: January 2021.” Tables are an ideal way to organize related information more efficiently than plain text—screen readers can easily skip to the next row without reading every word. The key is to use descriptive column headers and row labels (if applicable). However, a table that is only used to format text for appearance’s sake will make the site nearly useless with a screen reader. A content management system like Drupal, website service like Wix or WordPress, or app like Dreamweaver can utilize cascading style sheets (CSS) for advanced formatting that is more accessible.

Improve Your Site with Siteimprove

The above tips are simple, but how do you even begin to assess whether your site is accessible and what changes will make it better? This is where Siteimprove comes in. Siteimprove is a cloud-based web governance software that crawls websites and provides information on digital accessibility issues. It also identifies errors like broken links and misspellings.

Once scans are performed, Siteimprove provides a report detailing each accessibility barrier. The person in charge of the website can then easily address each recommended change—whether it’s changing the colors on the page, adding a missing image ALT text, or some other issue with the code.

The Office of Diversity, Equity, and Inclusion and Pitt Information Technology have made Siteimprove available for use by all University websites to make sure they are functional and accessible. Angela Bedford-Jack, Pitt’s Digital Accessibility Coordinator, says there are currently 700 websites undergoing accessibility scans. Bedford-Jack adds new websites as requested.

It is a key tool for departments across Pitt; the University Communications Web Services team uses Siteimprove on all new sites—the website must receive a 100% before being published. Bedford-Jack says data can be pulled from Siteimprove to look at digital accessibility at a University-wide level and track Pitt’s progress on the road to becoming as digitally accessible as possible.

Mark Vehec, University Center for Teaching and Learning web developer, sees Siteimprove as a tool for improving how Pitt serves the University community. “Siteimprove makes it possible for us to see what we’re doing right, and, most importantly, what we could be doing better, to make the websites and assets we produce more accessible to people with an expansive range of disabilities,” Vehec says.

Although Siteimprove does not detect all potential barriers, such as the quality of ALT Text on an image and captions on videos, it is great resource for making websites better for all users. “We would love more units within the University to use Siteimprove for their websites,” she says. “If everyone’s websites scored a 100% in accessibility, that would be a huge step towards accessibility and inclusion at Pitt.”

Start Improving Your Site

To get started using Siteimprove, request access by emailing accessibility@pitt.edu. Once you have been granted access, you can just log in and perform a crawl of your site. Siteimprove has an extensive library of training and help resources, including on-demand tutorials and full courses through the Siteimprove Academy. Make your site a valuable resource for every Pitt student, faculty, or staff member, so we can accomplish more together.

-- By Mary Rose O'Donnell, Student IT Blogger