Creating an Accessible Website

Accessibility Compliance is important for every website. Web Accessibility means that websites, tools and technologies are designed and developed so that people with disabilities can use them. It allows everyone who visits the website to perceive, understand, navigate and interact with the UW website.

Common Violations

Why is Web Accessibility important?

By making the website accessible you are ensuring that all the website visitors, including people with disabilities, have an acceptable user experience and can easily understand and find information that they are seeking. People who require assistive technology to access websites — such as a screen reader — can have a very difficult time understanding content that is not made accessible. It is also a law to make all the public websites accessible. There are many guidelines available on the internet to help understand and ensure that the websites that are built follow the WCAG standard. The University of Wyoming is committed to meeting accessibility requirements on its website and web pages and several steps are being taken to fulfill that commitment.

The university has adopted a website accessibility policy that establishes minimum standards of web accessibility for individuals with disabilities regarding websites and web pages that are used to conduct UW business and activities. That includes all web pages served by UW’s Content Management System (CMS) and its related templates, as well as all other web pages under the “uwyo” domain. All the new site editors are also required to take Accessibility Training that is included in our Omni CMS Training.

Four Principles Of Accessibility

Perceivable

The information and User Interface must be presented in a manner that they can be perceived. The users must be able to understand the message being presented by using at lease one of their senses.

graphic with brain in the middle and five senses

Operable

The components and navigation of the interface must be operable. The user should be able to operate the website and not require interaction that the visitor cannot do. For example, all functionality must be available from a keyboard.

Graphics containing lightbulb with a matching puzzle piece

Understandable

Information and the operation of user interface must be understandable. In simple terms, keep the website simple. Make the text content readable and understandable with proper color contrast.

Robust

Content must be robust enough that it can be interpreted reliably by a wide variety of users agents, including assistive technologies. Users must be able to access the content as technologies advance.

Most Common Website Accessibility Violations

Accessibility errors can appear minor or even invisible to site editors, but can create major difficulties for website visitors using assistive technology to access your page. We've put together a list of our most common accessibility violations that are easy for you to fix! Be sure to download the WAVE tool plugin for your Google Chrome browser and run a scan on your pages to see if they contain any violations.

Empty Heading Level

Empty heading levels are most often present when you attempt to create space above your heading by pressing Enter/Return on your keyboard. When doing so, that newly-created space adopts the same formatting as your heading. Remember, screen readers are looking for heading tags to identify page sections and important content, so an empty space identified as a heading creates the violation. To fix this, simply highlight the area where the violation is occurring (we like to place our cursor in front of the error and hold down SHIFT + arrow over on the keyboard) and select Paragraph from the Formatting dropdown menu in the toolbar.

More About Formatting

Redundant Hyperlinked Text

This is one of the easiest fixes out of any accessibility violation. Redundant link violations occur when two or more adjacent links go to the same destination. This can create confusion because screen reader users may hear the hyperlink announced twice and the user will not know which link to visit. While there are a few ways to fix this and still contain links to the same destination, the simplest fix is for site editors to remove one of the links or pick a new destination.

Redundant Link Info

Skipped Heading Level

Skipped heading levels are a common mistake for site editors. While you can use multiple headings in the same section, you cannot skip a heading. For instance, you cannot use an H2 heading tag and then proceed it in the same section with an H4 tag — they must come in chronological order. This is important so screen readers know what order to present page content to people using assistive technology. It may feel tempting to skip a heading level so instead try using the Styles menu to give them more variation, including decreasing the size of a heading.

Types of Heading Styles

Missing/Suspicious Alt Text

Descriptive alt text on images is an excellent way to show website visitors using screen readers that you are invested in creating an equitable website experience. Think about how you would describe a scene to a person with visual impairments and how it would make them feel if you only used 3-4 words to describe a beautiful sunset. The same concept applies to web page images. While alt text is now a required field when inserting an image, there are many UW website images with incomplete or missing context. Take some time to visit each image on your pages and ensure you have a good, alt text description.

Help Inserting Images

Accessibility Resources

There are multiple resources available for Site editors to help understand Website Accessibility and to ensure that the pages they are building are Compliant according to the Accessibility Standards.

a graphic of computer with website accessibility text surrounded by web icons

Accessibility Policy & Guidelines

Accessibility guidelines are maintained by two organizations Web Accessibility Initiative (WAI) and World Wide Web Consortium (W3C). Learn more about these Policies below.

Accessibility Software Tools

How to use the WAVE tool

How to: