 WCAG 2.1 – Improving Digital Accessibility of
Web Applications: 1.4.13 and 4.1.3
Status messages and content on hover or focus
Editor's note: This is the second article in our series “WCAG 2.1 – Improving Digital Accessibility”. Missed the first installment? Read it in the March Newsletter: Improving Navigation Menus and Focus Indicators.
This month, we talked with John Watne, the accessibility coordinator for Minnesota IT Services partnering with the Minnesota Department of Revenue. We asked John about beginning the work to meet WCAG 2.1. This article shares specifically about his experiences with the success criteria for:
-
1.4.13 Content on Hover or Focus (AA):
- “Where receiving and then removing pointer hover or keyboard focus triggers additional content to become visible and then hidden, the following are true…”
- The success criterion goes on to describe the specifics of being dismissible, hoverable, and persistent.
- It also describes an exception.
-
4.1.3 Status Messages (AA):
- “In content implemented using markup languages, status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus.”
The following are some questions we asked John:
- What did you have before?
- How did you find the content to update?
- How did you test to ensure you met the new success criteria?
Guess what? He gave us all the details! You can have them too: WCAG 2.1 - Improving Digital Accessibility of Web Applications: 1.4.13 and 4.1.3.
 Oh Snap! Startling Discoveries When You Reflow Your PDF
Our test results and recommendations
By: Jessica Cavazos, Minnesota Department of Health and Jennie Delisi, Office of Accessibility
People use PDFs on many different devices. Each device has a different screen size. People with disabilities may need to zoom in to use the content. When they magnify information, some of the content may move off the screen, so they have to scroll horizontally to read sentences. The 1.4.10 – Reflow success criterion of the Web Content Accessibility Guidelines (WCAG) 2.1 makes sure that in situations like this the content can be enlarged without requiring horizontal scrolling, and that text reflows within the width of the user’s device. Reflow is an interesting success criterion for PDFs because they operate differently than web pages.
Reflow Basics
Let’s start by defining reflow. Reflow is presenting enlarged (or zoomed) content in one column so that you only scroll in one direction. You may be familiar with this concept for websites that use responsive design. Their content reflows into one column when a person zooms in to over 300%. The Understanding Document for success criterion 1.4.10: Reflow says “User agents for technologies such as HTML/CSS, PDF, and EPUB have methods for reflowing content to fit the width of the window (viewport).”
As we began to review this, that seemed simple enough. Then, we wondered how that applies to different views.
We considered two views when we began testing.
-
Desktops: people use PDFs in the native application, like Acrobat Reader or Pro DC. You can also open PDFs within the browser.
-
Mobile devices: people have many app options. Examples: Acrobat Reader and other PDF viewing apps, and browsers (like opening a PDF in Chrome browser on an iPhone).
And, people creating documents using Adobe InDesign use different techniques that can influence how people access content. For example, an area of content can link to another content area later in the document. You may know this as a threaded story or text frames. This is important to consider when learning about reflow. Imagine if you had to change the visual display of an entire newspaper into a single column! These are the kinds of questions State of Minnesota employees are reviewing as we prepare to adopt WCAG 2.1.
Don’t forget, not all digital information must reflow. In Easy Read that will Demystify Tables, Reflow, and Magnification Shoemaker and Watne shared why tables should not reflow. And, not all elements within PDFs are able to reflow at the time of this article. So yes, there are more than just the reflow basics to learn!
The full article includes:
- Links to the documents we used for our testing.
- Instructions on how to reflow PDFs on desktop and mobile.
- Our test results for background color, graphics, reading order and visual display.
- And, important step you should take for all of your PDFs.
Read more in Oh Snap! Startling Discoveries When You Reflow Your PDF.
 Tech Tip: Using YouTube Accessibility Features
Users have more flexibility with captions and playback speed
The Minnesota Commission of the Deaf, Deafblind and Hard of Hearing uses video in addition to text to communicate with their constituents. They recently posted information on how to take advantage of the multiple accessibility and usability functions on YouTube. We are reprinting it with their permission.
See “YouTube Accessibility Tools” on YouTube.
The Commission has routinely shared videos on a variety of topics, which are viewable on YouTube. Did you know that there are tools available to enhance your viewing experience? You can adjust caption size for readability as well as the font style and color options. Here’s how:
Adjusting Caption Size, Font, and Color
You can adjust the way you see captions on YouTube. There are options to adjust the size, font, and color of the captions to meet your preference.
Here are the steps to adjust the settings on YouTube:
- Step 1: Go to any video on YouTube that has closed captions available.
- Step 2: Click on the gear icon, which is next to the CC button, on the bottom right side of the video.
- Step 3: Click on “Subtitles/CC.”
- Step 4: Click on ‘Options’ on the top, right corner of the pop-up box.
- Step 5: Make the changes you want. You can change the type of font, the font size, the font color, the background color, etc., until the CC looks the way that is best for you. A sample view is available to help you choose your best settings.
Now that you have adjusted your preferred settings to view captions, you can also adjust the speed that you view those videos at. You can slow them down or speed them up.
Adjusting Speed
- Step 1: Click on the gear icon (right next to the CC button at the bottom right side of the video).
- Step 2: Click on ‘Playback Speed,” second item from top of dropdown list.
- Step 3: Choose your favorite speed. Slow speeds are .25 (slowest), 0.5 (medium slow), and 075 (slightly slow). “Normal” is the original speed. If you would like the video to go faster, the fast speeds are:
- 1.25 (slightly fast)
- 1.5 (medium fast)
- 1.75 (fast)
- 2.0 (fastest).
If it is too hard to find the gear icon, you can use YouTube’s keyboard shortcuts to increase or decrease the speed by 25%. Here are the shortcuts.
- To slow down video speed: Press the < key by holding down the Shift key and then press the comma key, which will decrease video speed by 25%.
- To speed up video speed: Press the > key by holding down the Shift key and then press the period key, which will increase speed by 25%.
Now you can watch any video at the speed that you are comfortable with. We hope these tools will enhance your viewing experience!
|
