Body
Accessibility Guidelines
UW-Platteville strives to meet Level AA or above of the WCAG Guidelines, and the owners of digital content are responsible for meeting those guidelines. In simplified terms, accessible digital content should be:
- Perceivable - content is available using more than one sense, e.g. proper formatting is used to maximize effective use of screen readers, images have alternative text, videos are captioned, and transcripts are provided for audio.
- Operable - navigation is predictable with all functionality being accessible using a keyboard interface without requiring specific timings for individual keystrokes. Additionally users can stop or pause blinking, flashing, or scrolling content
- Understandable - language is clear and simple and acronyms are avoided. When creating forms, error suggestions and input prompts are available.
- Robust - Robust content can be Interpreted by various user agents, including assistive technologies and mobile devices.
Tips for Creating Accessible Content
Use built-in accessibility tools for checking content that you create in Office, Adobe Acrobat, Canvas, etc. For web-based content, use the rich text editor features for formatting where available. The following guidelines provide a starting point for creating accessible digital content. Digital content includes any document that is shared in a digital format. This includes documents created in Word, Acrobat, PowerPoint, etc. These guidelines are by no means an all-encompassing collection of WCAG guidelines. However, if you stick to the practices outlined below, most of your content should be accessible.
Headings
Headings convey how content is organized. Sighted people use headings to scan content, get an understanding of the main content, and jump around to specific points that interest them. If you don't use proper heading tags, screen readers won't allow users to do that. When formatted correctly, web browsers, plug-ins, and assistive technologies can use headers to provide efficient navigation of content. Instead of manually bolding or changing font sizes to indicate a header, use the heading formats provided within your platform editor to ensure full screen readers functionality. If coding in HTML, use headings <h1> through <h6> to organize and describe your content, and don't skip heading levels. For more detailed guidance review the W3C Web Accessibility Initiative guidance on headings.
Hyperlinks
People using a screen reader can struggle with links in the form of a URL because each character may be read consecutively. Additionally, screen readers allow users to skip around content by presenting links on a page as a list, so generic text that is not meaningful without surrounding context is not helpful either. For example, when generic links like "Click here", "More", "Go", and "Read More" are presented as a list, readers have no idea what they will get when they click the link. To take this concept a little further, it goes without saying that links with the same link text on the same page should not point to multiple resources. For further guidance on links, W3 Schools provides examples of good and bad links, as well as HTML coding assistance for links.
Lists
Use lists to present consecutive elements or items that are related in some way. Don't create fake lists by adding bullets or numbers to paragraphs. Your content may visually look the way you want it to, but your content won't have the underlying markup to be recognized as a list by screen readers and other devices. Additionally, don’t use list elements for formatting effects, and avoid using the same numbering scheme for nested ordered lists. In other words, don't use lists to structure your document, that is what headings are for. For further guidance on links, W3 Schools provides guidance and help for coding HTML lists.
Tables
Tables should be used to organize data with logical relationships that are too detailed or complicated to be described adequately in text. They should not be used to simply organize content on your page. To make your tables accessible, provide a table caption and identify row and column headers by defining their scope. Also, provide a table summary for complex data tables. For further guidance, visit W3 Schools Tables Tutorial. This tutorial includes links to examples of HTML code for simple and complex tables.
Images & Graphics
Images and graphics add meaning to your content and make it easier to understand. However images can create major barriers when they are not accessible to people with vision impairments. Therefore, it is important to add alternative text to images. When doing so, keep the following tips in mind:
- Keep it short, usually 1-2 sentences.
- Convey key elements of why the image is important.
- Don’t describe every little detail.
- There is no need to say, "image of" or "picture of," However, indicate if the image is a logo, illustration, painting, or cartoon.
- Don’t duplicate text that’s adjacent in the document or website.
For more in-depth information on image accessibility, read the W3 Schools Images Tutorial.
Audio & Video
When creating audio or video, avoid using distracting background music, speak slowly and clearly, and don't rely on machine generated captions or transcripts. Additionally, keep these tips in mind:
- Kaltura and Zoom can produce machine-generated captions, but machine captions should be edited for accuracy.
- Request captioning services using through Tech Support.
- Do not have videos start automatically, and allow users to stop and start audio/video at will.
- Allow users to control sound levels and playback speed.
- Avoid anything that flashes more than three times in one second to avoid triggering seizures.
For more in in-depth information read Making Audio and Video Media Accessible.
Text, Contrast, and Readability
Provide enough contrast between text and its background so that it can be read by people with moderately low vision. The contrast ratio for between text and its background is 4:5:1, except for large-scale text, Incidental text that is purely meant for decoration, and logos. The contrast ratio for large-scale text should be at least 3:1. Generally, 18-point text or 14-point bold text is judged to be large enough to require a lower contrast ratio. You can use the WCAG Color Contrast Checker to see if your text meets Level AA minimum contrast requirements. Other tips to keep in mind regarding design for readability are:
- Don't underline text that is not a link.
- Left-align your text with consistent margins.
- Avoid using all caps.
- Provide sufficient line spacing
- Avoid switching font types
- Use accessible fonts (e.g. Arial, Century Gothic, Helvetica, Tahoma, Verdana, Times New Roman, Rockwell)
Accessibility Tools & Resources
The following tools can help you determine if your digital content is accessible: