Skip to content
This repository has been archived by the owner on Jul 2, 2024. It is now read-only.

[draft notes on what we might want to change] WCAG 2.1 updates #76

Draft
wants to merge 22 commits into
base: master
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion _people-use-web/abilities-barriers.md
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ instance, consider the following aspects:
experiencing constraints due to their surrounding or due to other
situational aspects. For example, they may be in a loud environment
and unable to hear audio, in bright sunlight and unable to see a
screen, or they may not be able to afford some technologies.
screen, or they may not be able to afford some technologies. @@@ Would probably be best to add clearer description of mobile situational issues here. @@@

Websites and web tools designed for people with a broad range of
abilities benefit everyone, including people without disabilities. It
Expand Down Expand Up @@ -221,6 +221,8 @@ neurological disabilities often rely on:
distracting content;
- Simpler text that is supplemented by images, graphs, and other
illustrations;
- @@@ Add bullet on timeouts @@@
- @@@ Add bullet on customization of text attributes @@@

People with cognitive, learning, and neurological disabilities use
different types of web browsing methods, depending on their particular
Expand Down Expand Up @@ -342,6 +344,7 @@ hardware and software such as:
movements;
- Voice recognition, eye tracking, and other approaches for hands-free
interaction.
- @@@ Add bullet about mechanisms to hold mobile/touchscreen devices @@@

People with physical disabilities may be using a mouse or mouse-like
device only, or keyboard or keyboard-like device only to operate the
Expand All @@ -361,6 +364,8 @@ current focus, and mechanisms to skip over blocks, such as over page
headers or navigation bars. People with cognitive and visual
disabilities share many of these requirements.

@@@ 2.5.1 Pointer gestures, 2.5.2, 2.5.3, 2.5.4, 2.5.5, 2.5.6, 1.3.4, 2.1.4, 2.2.6 all could potentially be talked about here.

{% include excol.html type="end" %}{% include excol.html type="start" id="" %}

### Examples of physical disabilities {#examples-of-physical-disabilities}
Expand Down Expand Up @@ -516,6 +521,7 @@ particular needs. For example by:
- Listening to text-to-speech synthesis of the content;
- Listening to audio descriptions of video in multimedia;
- Reading text using refreshable Braille.
- @@@ May want to add high contrast mode @@@

For these web browsing methods to work, developers need to ensure that
the presentation of web content is independent of its underlying
Expand All @@ -534,6 +540,8 @@ they cannot see the mouse pointer. An accessible design supports
different presentations of the web content and different ways of
interaction.

@@@ Need to add relevant low-vision criteria and potentially others - see our matrix in the google doc. @@@

{% include excol.html type="end" %}{% include excol.html type="start" id="" %}

### Examples of visual disabilities {#examples-of-visual-disabilities}
Expand Down
12 changes: 6 additions & 6 deletions _people-use-web/tools-techniques.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,19 +55,19 @@ perform certain tasks.

{% include excol.html type="middle" %}

Some common approaches for interacting with the Web include:
Some common approaches for interacting with the Web include: @@@ more about is getting too much into details - maybe incorporate this info into the profiles instead of repeating and giving too much info. @@@

- **Assistive Technologies**{:#at} – software and hardware that
people with disabilities use to improve interaction with the web.
These include screen readers that read aloud web pages for people
who cannot read the text, screen magnifiers for people with some
types of low vision, and voice recognition software and selection
switches for people who cannot use a keyboard or mouse.
switches for people who cannot use a keyboard or mouse. @@@ Add in mobile considerations of what assistive technogies are present as well. Maybe add another bullet for personalization. @@@
- **Adaptive Strategies**{:#as} – techniques that people with
disabilities use to improve interaction with the Web, such as
increasing text size, reducing mouse speed, and turning on captions.
Adaptive strategies include techniques with standard software, with
mainstream web browsers, and with assistive technologies.
mainstream web browsers, and with assistive technologies. @@@ Add assistive touch potentially. @@@

Accessibility benefits people with and without disabilities. Features
that support accessibility are becoming increasingly available in
Expand All @@ -83,7 +83,7 @@ not be available to an individual. For example, tools may not be
affordable, not installed or not compatible with the computer, not
available in some languages, or not available for other reasons. In
other cases, people are unaware of accessibility solutions or how to
configure and use them.
configure and use them. @@@ Why is this paragraph in here? @@@

{% include excol.html type="end" %}

Expand Down Expand Up @@ -125,14 +125,14 @@ provide alternative forms of the content. For example, at least some
level of human intervention is necessary to create textual descriptions
for images and captions for audio content. Sometimes software tools,
such as voice and picture recognition, can assist authors in providing
such alternatives but the conversion is usually not fully automatable.
such alternatives but the conversion is usually not fully automatable. @@@ Need to condense text - this is tools and techniques, don't need so much narrative. @@@

{% include excol.html type="end" %}{% include excol.html type="start" id="" %}

### Examples of accessibility features {#examples-of-accessibility-features}

{% include excol.html type="middle" %}

@@@ For all "examples of" sections, add any relevant cognitive, mobile, or low vision bullets. @@@
- **Audio descriptions**{:#audio} – (also referred to as "video
descriptions" and "described video") narrations that describe
important visual details in a video. These narrations can be during
Expand Down
18 changes: 14 additions & 4 deletions _people-use-web/user-stories.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ The following stories of people with disabilities using the Web highlight the ef
Lee, online shopper with color blindness {#shopper}
---------------------------------------------------

Lee is colorblind and encounters barriers when shopping online. He has one of the most common visual disabilities that affect men: red and green color blindness. Lee frequently shops online and sometimes encounters problems on websites and with apps where the color contrast of text and images is not adequate and where color alone is used to indicate required fields and sale prices. When red and green color combinations are used, Lee cannot distinguish between the two, since both look brown to him. It is also very difficult for him to make product choices when color swatches are not labeled with the name of the color.
Lee is colorblind and encounters barriers when shopping online. He has one of the most common visual disabilities that affect men: red and green color blindness. Lee frequently shops online and sometimes encounters problems on websites and with apps where the color contrast of text, images, buttons, and other controls is not adequate and where color alone is used to indicate required fields and sale prices. When red and green color combinations are used, Lee cannot distinguish between the two, since both look brown to him. It is also very difficult for him to make product choices when color swatches are not labeled with the name of the color.

Lee has better experiences with online content and apps that use adequate contrast and allow him to adjust contrast settings in his browser. He is also better able to recognize when information is required when asterisks are used. Lee can more easily identify the products he would like to purchase, especially clothing, when the color label names are included in the selection options rather than color swatches alone.

Expand Down Expand Up @@ -87,7 +87,7 @@ Though it took considerable research, time, and commitment to learn, he is able
* voice recognition software on his computer and mobile phone
* assistive touch on his mobile phone

Alex encounters problems when websites and other online content cannot be navigated by keyboard commands alone. He frequently encounters web forms that do not have keyboard equivalents. Sometimes it is also difficult to skip content and navigate to sections on a webpage without using many keyboard commands, which is very tiring and limits the time he can spend working comfortably. He also recently began to explore the use of assistive touch on his mobile phone which also helps him use fewer gestures and work for longer periods of time. As a temporary fix, Alex’s employer has built several custom work arounds that provide keyboard support for his use of the company’s internal Content Management System with the intention to implement improved keyboard support to benefit all users on the next release of the software.
Alex encounters problems when websites and other online content cannot be navigated by keyboard commands alone. He frequently encounters web forms or applications that do not have keyboard equivalents or that have single character keyboard shortcuts that interfere with his assistive technology. Sometimes it is also difficult to skip content and navigate to sections on a webpage without using many keyboard commands, which is very tiring and limits the time he can spend working comfortably. He also recently began to explore the use of assistive touch on his mobile phone which also helps him use fewer gestures and work for longer periods of time. As a temporary fix, Alex’s employer has built several custom work arounds that provide keyboard support for his use of the company’s internal Content Management System with the intention to implement improved keyboard support to benefit all users on the next release of the software.

For more information on implementing techniques that remove barriers for Alex, see the following resources:

Expand Down Expand Up @@ -178,7 +178,9 @@ she does not read Braille.

Ilya uses a screen reader and mobile phone to access the web. Both her screen reader and her mobile phone accessibility features provide her with information regarding the device’s operating system, applications, and text content in a speech output form.

When accessing web content, the screen reader indicates aloud the structural information on a webpage such as headings, column and row headers in tables, list items, links, form controls, and more that enable her to better navigate the page, complete and submit forms, and access information in an effective manner. She is able to listen to and understand speech output at a very high speed. Ilya encounters problems when websites are not properly coded and do not include alt text descriptions on images. These sites are unnavigable and require large amounts of time to read text from the top of the page to the bottom without navigation cues. Occasionally she finds herself trapped in areas on a webpage unable to move to another area and must abandon the page altogether.
When accessing web content, the screen reader indicates aloud the structural information on a webpage such as headings, column and row headers in tables, list items, links, form controls, and more that enable her to better navigate the page, complete and submit forms, and access information in an effective manner. She is able to listen to and understand speech output at a very high speed. Ilya encounters problems when websites are not properly coded and do not include alt text descriptions on images. These sites are unnavigable and require large amounts of time to read text from the top of the page to the bottom without navigation cues. Occasionally she finds herself trapped in areas on a webpage unable to move to another area and must abandon the page altogether. @@@ Add status messages @@@

When she uses her touchscreen device (e.g. mobile phone or tablet), she may also use an external keyboard or braille display. She sometimes encounters problems when they don't work correctly with the websites she uses.

As a senior member of her organization, Ilya provides training to employees in online environments through the use of video conferencing applications, document and slide sharing applications as well as chat rooms. Ilya and her staff evaluated a number of training tools before finding an effective application with accessibility features that meet the needs of a diverse staff with diverse abilities.

Expand Down Expand Up @@ -235,7 +237,9 @@ Preety, middle school student with attention deficit hyperactivity disorder and

Preety is a middle school student with attention deficit hyperactivity disorder with dyslexia. Although she has substantial difficulty reading, she particularly enjoys her literature class.

Preety’s school recently started using online digital textbooks. Preety was initially worried about using this new format, but with the use of text-to-speech software that highlights the text on the screen as it reads it aloud, she has found that she can focus on the content more easily instead of struggling over every word. The text-to-speech software is also helpful with other online text; however, Preety’s experience with websites varies greatly from one site to another. Some sites use graphics and illustrations in a way that helps her to focus on the sections and content that she would like to read, while other sites have a lot of advertisements and moving content that is very distracting. She also experiences problems with online content when the navigation is not clearly evident. She finds websites and apps that provide multiple means of navigation such as a navigation bar, search box, bread-crumb trails, and a sitemap to be much easier to use.
Preety’s school recently started using online digital textbooks. Preety was initially worried about using this new format, but with the use of text-to-speech software that highlights the text on the screen as it reads it aloud, she has found that she can focus on the content more easily instead of struggling over every word. The text-to-speech software is also helpful with other online text; however, Preety’s experience with websites varies greatly from one site to another. Some sites use graphics and illustrations in a way that helps her to focus on the sections and content that she would like to read, while other sites have a lot of advertisements and moving content that is very distracting. She also experiences problems with online content when the navigation is not clearly evident. She finds websites and apps that provide multiple means of navigation such as a navigation bar, search box, bread-crumb trails, and a sitemap to be much easier to use.

@@@ Add cognitive new criteria (1.3.5, 1.3.6, 2.2.6, 2.3.3) into descriptions of issues, etc. Some low vision (2.5.6, 1.4.12) may also apply - especially personalization ones. May need a rewrite. @@@

Preety's school is also using a new online library catalog with improved accessibility. Before the new catalog was implemented Preety had to physically visit the library to receive assistance in searching and locating material. Now she can search the catalog on her own using her mobile phone, tablet, or laptop. Preety still struggles with spelling but has found that search functionality that suggest alternative spellings and provide error corrections are very helpful and greatly improve her experience.

Expand Down Expand Up @@ -294,6 +298,8 @@ Yun, retiree with low vision, hand tremor, and mild short-term memory loss {#ret

Yun is an 85 year-old with reduced vision, hand-tremor, and mild memory loss; common age-related impairments for someone his age. Yun regularly browses the web reading news sites. In recent years he also started using social media to stay in touch with his family and friends. He maintains his own blog where he posts articles on art history and other topics he enjoys.

@@@ Definitly needs several additional references for low vision, mobility, and mobile (2.5.1, 2.5.2, 2.5.4, 2.5.5, 1.4.10, 1.4.11, 1.4.12, 1.4.13, 1.3.5, 2.2.6) Should mobile be added?. @@@

Like many older individuals, Yun has difficulty reading small text and clicking on small links and form elements. His daughter showed him how to enlarge text in the web browser, which works well on many websites. He encounters problems when text does not reflow when it is enlarged and he is forced to scroll back and forth to read the enlarged content, which means he easily loses track of his place. He also has problems with CAPTCHA images found on many social media sites. The text is so distorted, even when he enlarges it, that he often cannot accurately enter the text. He has a better experience on sites that use alternative CAPTCHA options, unfortunately only a small number currently do.

Yun’s daughter gave him a special mouse that is easier to control with his hand tremors. He also uses a web browser that saves thumbnail images of his frequently visited sites, which makes it easier for him to keep track of the sites he goes to most often.
Expand Down Expand Up @@ -354,6 +360,8 @@ Luis, supermarket assistant with Down syndrome {#supermarketassistant}

Luis has Down syndrome and has difficulty with abstract concepts, reading, and math calculations.

@@@ Some coga criteria apply (2.5.3, 1.3.5, 1.3.6, 2.2.6, 2.3.3, 4.1.3) and some low vision apply (1.4.12, 2.5.5, 1.4.13) @@@

Luis works at a market, bagging groceries for customers. Typically he buys his groceries at the same market where he works, but he is sometimes confused by the large number of product choices and sometimes has problems finding his favorite items when the store layout is changed.

Recently, a friend showed him an app for online grocery purchases that has consistent, easy-to-use navigation with clear and direct instructions. Luis is able to add the list of his most frequently purchased items into the app and save it for additional purchases. He also likes the search functionality that makes suggestions for mistyped or misspelled words. The app also keeps a running total of the items in his virtual shopping cart which helps him keep up with how much he is spending.
Expand Down Expand Up @@ -415,6 +423,8 @@ Kaseem, teenager who is deaf and blind {#teenager}

Kaseem is a teenager who is deaf and recently became legally blind too, which means she can see only small portions of a screen and read text when it is significantly enlarged.

@@@ Would need updates to incorporate some criteria (2.5.3, 4.1.3, 2.2.6) Need to add in mobile device usage to this persona and its related critria (2.5.4, 2.5.6, 2.1.4) @@@

Kaseem uses:

* screen magnification software to enlarge the text on websites to a suitable font size;
Expand Down