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)
Checking PDFs for accessibility
If possible, it is always best to start with an accessible source document (e.g., in Microsoft Word) and export it to an accessible PDF. This way, if the document is edited later, the document’s accessibility features will still be intact. When the document is exported to PDF the accessibility features will be passed to the PDF.
However, if the original source document is not available, accessibility features can be added to the PDF using Adobe Acrobat Pro DC.
Checking PDF accessibility yourself
Consult the following checklist to review a PDF for accessibility. To complete each of the items in this checklist, you will need Adobe Acrobat Pro DC. The checklist specifically applies to Acrobat Pro DC.
WebAIM’s tutorial on PDF Accessibility is an excellent accompaniment to the current checklist.
NOTE: Modifying PDFs can have unpredictable results. Save often! (Saving multiple versions is recommended.)
Step 1. Does document have text?
How to test: Try selecting text using a mouse, or select all text using Edit > “Select All” from the Acrobat menu.
If No, this is an image file and is not accessible. Covert to text using View > Tools > “Recognize Text.”
Step 2. Is document tagged?
How to test: Go to File Properties (Ctrl+D in Windows, Command+D in Mac). In the bottom left corner of the Document Properties dialog, see the “Tagged PDF” field.
If No, this document needs to be tagged. Tags provide the structure on which accessibility is built. Add tags by selecting View > Tools > Accessibility > “Add Tags To Document.”
Step 3. Check for any lingering errors.
How to test: Run the accessibility checker that is built in to Acrobat Pro. Select Tools > Accessibility > “Full Check” then read the report and follow the prompts.
The report lists items in various categories such as Document, Page Content, etc. Each item is preceded by an icon indicating that the item either passes, fails, or requires manual inspection. Right-click on any item to see a list of options for fixing the problem or learning more about it.
This is the final step in our checklist, rather than the first step, because some documents generate dozens of errors that can easily be addressed with the first two steps. This way, the accessibility checker will report fewer problems and will be easier to read and work with.
“Walking” the Tag tree
To manually inspect the tag tree in Adobe Acrobat Pro, from the View drop-down menu select Show/Hide > Navigation Panes > Tags. This will display the tags in descending order from top to bottom. Place focus at the top of the tag tree and use the down arrow on your keyboard to inspect the tags to make sure the heading level structure is correct and elements are tagged accurately. For details, see Adobe’s Accessibility Repair Workflow for PDFs using Acrobat DC.
Accessibility Reports
Adobe Acrobat
The built-in Accessibility Checker in Adobe Acrobat helps identify potential accessibility issues in PDFs and provides guidance on how to fix them. It evaluates the document against accessibility standards, such as making sure the document has tags with proper semantic structure, figures have alt text, metadata such as document title and language assignment are included, as well as other accessibility checkpoints.
How to Run the Accessibility Checker
- Open the PDF in Adobe Acrobat Pro. ( Download from Software Center )
- Go to All Tools > Prepare for Accessibility > Check for Accessibility.
- Select the desired options and select, Start Checking.
- Review the Accessibility Report, which highlights errors, warnings, and suggestions.
In some instances, you may be able to fix issues addressed in the Accessibility Report by right clicking and selecting Fix from the context menu. In most instances, you will need to find the issue within the tag tree and make the correction.
PAC
PAC (PDF Accessibility Checker) is a free tool for Windows users designed to test PDF/UA (Universal Accessibility) compliance in PDF documents. It is more specialized than Adobe Acrobat’s built-in accessibility checker and provides a detailed report on accessibility issues. PAC is widely used by accessibility professionals to ensure PDFs meet ISO 14289-1 (PDF/UA) standards. Key features of the PAC Accessibility Checker include a detailed compliance check against PDF/UA success criteria, a built-in table inspector, and a logical structure preview that shous how a screen reader interprets the document.
How to Run the Accessibility Checker
- Download the PAC PDF Accessibility Checker.
- Run the application from the file, then upload the PDF to the application.
- This will generate a report and visual inspection with pass/fail results.
- Use Adobe Acrobat to fix errors identified in the report.
Accessibility Tools & Resources
The following tools can help you determine if your digital content is accessible: