From 4ef05e338f5a5e4565dca4f64db015fbca0006df Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 9 Aug 2024 00:05:35 +0100 Subject: [PATCH 01/12] Whitespace --- understanding/20/audio-control.html | 70 ++----------- understanding/20/pause-stop-hide.html | 139 ++++---------------------- 2 files changed, 29 insertions(+), 180 deletions(-) diff --git a/understanding/20/audio-control.html b/understanding/20/audio-control.html index 5ebd2fc3b4..1188513d9b 100644 --- a/understanding/20/audio-control.html +++ b/understanding/20/audio-control.html @@ -1,157 +1,103 @@ - + Understanding Audio Control

Understanding Audio Control

- +

In brief

Goal
A page that plays music or sounds doesn't disrupt people.
What to do
If you play audio content automatically, let people turn it down or off.
-
Why it's important
Sound distracts some people, and also interferes with screen readers.
+
Why it's important
Sound distracts some people, and also interferes with screen readers.
- +

Intent of Audio Control

- -

Individuals who use screen reading software can find it hard to hear the speech output if there is other audio playing at the same time. This difficulty is exacerbated when the screen reader's speech output is software based (as most are today) and is controlled via the same volume control as the sound. Therefore, it is important that the user - be able to turn off the background sound. + be able to turn off the background sound.

Having control of the volume includes being able to reduce its volume to zero. Muting the system volume is not "pausing or stopping" the autoplay audio. Both the "pause or stop" and control of audio volume need to be independent of the overall system volume.

-
-

Playing audio automatically when landing on a page may affect a screen reader user's ability to find the mechanism to stop it because they navigate by listening and automatically started sounds might interfere with that navigation. Therefore, we discourage the practice of automatically starting sounds (especially if they last more than 3 seconds), - and encourage that the sound be + and encourage that the sound be started by an action initiated by the user after they reach the page, rather than requiring - that the sound be + that the sound be stopped by an action of the user after they land on the page.

-
- -

See also - 1.4.7: Low or No Background Audio. -

- - +

See also 1.4.7: Low or No Background Audio.

Benefits of Audio Control

- - -
-

Examples of Audio Control

- -
-

Resources for Audio Control

- -
-

Techniques for Audio Control

- -

Sufficient Techniques for Audio Control

- - -
-

Additional Techniques (Advisory) for Audio Control

- -
-

Failures for Audio Control

- - -
-
- diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index e513facd7c..aface86b69 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -1,31 +1,30 @@ - + Understanding Pause, Stop, Hide

Understanding Pause, Stop, Hide

- +

In brief

Goal
Fewer users are distracted by content that updates or moves.
What to do
Let users control content changes that occur in parallel with other content.
-
Why it's important
Some people with cognitive disabilities and attention deficits cannot concentrate with continual movement.
+
Why it's important
Some people with cognitive disabilities and attention deficits cannot concentrate with continual movement.
- +

Intent of Pause, Stop, Hide

- - +

The intent of this Success Criterion is to avoid distracting users during their interaction with a Web page.

- +

"Moving, blinking and scrolling" refers to content in which the visible content conveys a sense of motion. Common examples include motion pictures, synchronized media presentations, animations, real-time games, and scrolling stock tickers. "Auto-updating" refers to @@ -34,74 +33,50 @@

Intent of Pause, Stop, Hide

updates, and auto-advancing presentations and messages. The requirements for moving, blinking and scrolling content and for auto-updating content are the same except that:

- + - +

Content that moves or auto-updates can be a barrier to anyone who has trouble reading stationary text quickly as well as anyone who has trouble tracking moving objects. It can also cause problems for screen readers.

- +

Moving content can also be a severe distraction for some people. Certain groups, particularly those with attention deficit disorders, find blinking content distracting, making it difficult for them to concentrate on other parts of the Web page. Five seconds was chosen because it is long enough to get a user's attention, but not so long that a user cannot wait out the distraction if necessary to use the page.

- +

Content that is paused can either resume in real-time or continue playing from the point in the presentation where the user left off.

- + - +

For a mechanism to be considered "a mechanism for the user to pause," it must provide the user with a means to pause that does not tie up the user or the focus so that the page cannot be used. The word "pause" here is meant in the sense of a "pause @@ -110,58 +85,44 @@

Intent of Pause, Stop, Hide

moves the focus away) would not be considered a "mechanism for the user to pause" because it makes the page unusable in the process and would not meet this SC.

- +

It is important to note that the terms "blinking" and "flashing" can sometimes refer to the same content.

- + - -

Benefits of Pause, Stop, Hide

- - + -
-

Examples of Pause, Stop, Hide

-
An essential animation can be paused without affecting the activity
A Web site helps users understand 'how things work' through animations that demonstrate @@ -195,127 +156,69 @@

Examples of Pause, Stop, Hide

for all users and because it is not presented in parallel with other content, no mechanism to pause, stop or hide it needs to be provided.
-
-

Resources for Pause, Stop, Hide

- -
-

Techniques for Pause, Stop, Hide

- -

Sufficient Techniques for Pause, Stop, Hide

- - -
-

Additional Techniques (Advisory) for Pause, Stop, Hide

-
-

Failures for Pause, Stop, Hide

- - -
-
- From dd3a053c9f621c07311b290172a9a58465b9b47d Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 9 Aug 2024 00:07:10 +0100 Subject: [PATCH 02/12] Remove the "audio" mention in the intent - this is not about audio, it's visual --- understanding/20/pause-stop-hide.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index aface86b69..7677766c7e 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -29,7 +29,7 @@

Intent of Pause, Stop, Hide

a sense of motion. Common examples include motion pictures, synchronized media presentations, animations, real-time games, and scrolling stock tickers. "Auto-updating" refers to content that updates or disappears based on a preset time interval. Common time-based - content includes audio, automatically updated weather information, news, stock price + content includes automatically updated weather information, news, stock price updates, and auto-advancing presentations and messages. The requirements for moving, blinking and scrolling content and for auto-updating content are the same except that:

From 43c629b5fc4ac2abd1ca51f952e11c84a5c19c20 Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 9 Aug 2024 00:20:04 +0100 Subject: [PATCH 03/12] Add explanation of what "starts automatically" means, plus notes with cross-references to related/overlapping SCs. --- understanding/20/pause-stop-hide.html | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index 7677766c7e..10ec434952 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -25,6 +25,9 @@

Intent of Pause, Stop, Hide

with a Web page.

+

In the context of this Success Criterion, "starts automatically" broadly refers to animations/updates + that are not the direct result of a user's explicit activation.

+

"Moving, blinking and scrolling" refers to content in which the visible content conveys a sense of motion. Common examples include motion pictures, synchronized media presentations, animations, real-time games, and scrolling stock tickers. "Auto-updating" refers to @@ -86,9 +89,16 @@

Intent of Pause, Stop, Hide

because it makes the page unusable in the process and would not meet this SC.

-

It is important to note that the terms "blinking" and "flashing" can sometimes refer - to the same content. -

+
+

This Success Criterion is specifically concerned with moving, blinking, scrolling, and + auto-updating visual content. For audio content that starts automatically, refer to 1.4.2 Audio Control.

+

Moving, blinking, scrolling content that starts automatically not as a result of explicit *activation* (such as activating a button), + but because of a more general user interaction (such as focusing/hovering over an element, or scrolling the page), and doesn't provide + a way to Pause, Stop, or Hide, will fail this Criterion, and potentially + 2.3.3 Animation from Interaction.

+
+ +

It is important to note that the terms "blinking" and "flashing" can sometimes refer to the same content.

  • "Blinking" refers to content that causes a distraction problem. Blinking can be allowed @@ -103,6 +113,13 @@

    Intent of Pause, Stop, Hide

    blinking occurs faster than 3 per second, it would also be considered a flash.
+ +
+

"Flashing" content that starts automatically will fail this Success Criterion, as well as 2.3.2 Three Flashes + and – if not below the threshold – 2.3.1 Three Flashes or Below Threshold. +

+
+

Benefits of Pause, Stop, Hide

From 9e48446a6fc2dff422432af1b8d17066d2cfdb73 Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 9 Aug 2024 00:23:22 +0100 Subject: [PATCH 04/12] Add the same explanation of "automatic" to 1.4.2 --- understanding/20/audio-control.html | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/understanding/20/audio-control.html b/understanding/20/audio-control.html index 1188513d9b..b0f112b064 100644 --- a/understanding/20/audio-control.html +++ b/understanding/20/audio-control.html @@ -40,7 +40,9 @@

Intent of Audio Control

stopped by an action of the user after they land on the page.

-

See also 1.4.7: Low or No Background Audio.

+

See also 1.4.7 Low or No Background Audio.

+

In the context of this Success Criterion, "plays automatically" broadly refers to audio that + is not stated/played as a direct result of a user's explicit activation.

Benefits of Audio Control

From 10a8283f10a304578fea4a57681d9caaea36ba60 Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 9 Aug 2024 00:40:13 +0100 Subject: [PATCH 05/12] Clean up formatting and add additional note to 2.3.3 --- .../21/animation-from-interactions.html | 56 +++++++++---------- 1 file changed, 25 insertions(+), 31 deletions(-) diff --git a/understanding/21/animation-from-interactions.html b/understanding/21/animation-from-interactions.html index 4f92d73997..a226548a93 100644 --- a/understanding/21/animation-from-interactions.html +++ b/understanding/21/animation-from-interactions.html @@ -15,22 +15,22 @@

In brief

What to do
Support user preferences for motion, and eliminate unnecessary motion effects.
Why it's important
People can get sick from motion effects.
- -
- + + +

Intent

The intent of this Success Criterion is to allow users to prevent animation from being displayed on Web pages. Some users experience distraction or nausea from animated content. For example, if scrolling a page causes elements to move (other than the essential movement associated with scrolling) it can trigger vestibular disorders. Vestibular (inner ear) disorder reactions include dizziness, nausea and headaches. Another animation that is often non-essential is parallax scrolling. Parallax scrolling occurs when backgrounds move at a different rate to foregrounds. Animation that is essential to the functionality or information of a web page is allowed by this Success Criterion.

-

"Animation from interactions" applies when a user’s interaction initiates non-essential animation. In contrast, 2.2.2 Pause, Stop, Hide applies when the web page initiates animation.

+

"Animation from interactions" applies when a user’s interaction initiates non-essential animation. In contrast, 2.2.2 Pause, Stop, Hide applies when the web page initiates animation "automatically" that is not in response to an explicit user activation. There may be situations where a particular animation may fail both Success Criteria.

The impact of animation on people with vestibular disorders can be quite severe. Triggered reactions include nausea, migraine headaches, and potentially needing bed rest to recover.

How can a website reduce the chances of triggering a vestibular disorder? Choose any one of the following solutions. Avoid using unnecessary animation. Provide a control for users to turn off non-essential animations from user interaction. Take advantage of the reduce motion feature in the user agent or operating system.

- +

What about movement caused by a user scrolling a page? Moving new content into the viewport is essential for scrolling. The user controls the essential scrolling movement so it is allowed. Only add non-essential animation to the scrolling interaction in a responsible way. Always give users the ability to turn off unnecessary movement.

- +

Benefits

    @@ -45,35 +45,29 @@

    Benefits

Examples

-
    -
  • Parallax scrolling with option to turn off unnecessary motion globally: -
      -
    • A site includes extra animations when the user scrolls. Decorative elements move in and out of view horizontally when the essential page content is scrolled vertically. A control at the top of each page allows the user to turn off unnecessary animations. The ability to turn off non-essential animations is a site-wide setting.
      • -
    -
    • -
  • Transitions that support the reduce motion preference: -
      -
    • A site includes a non-essential transition when loading new content. The transition is a page-flipping animation that respects the reduce-motion CSS media query. When the user enables the reduce motion preference, the page-flipping animation is turned off.
      • -
    -
    • -
  • Essential animation: -
      -
    • A web application provides a feature to author animated sequences. As part of this tool the author needs to preview the animation.
      • -
    -
    • -
+
+
Parallax scrolling with option to turn off unnecessary motion globally
+
A site includes extra animations when the user scrolls. Decorative elements move in and out of view + horizontally when the essential page content is scrolled vertically. A control at the top of each page + allows the user to turn off unnecessary animations. The ability to turn off non-essential animations is a site-wide setting.
+
Transitions that support the reduce motion preference
+
A site includes a non-essential transition when loading new content. The transition is a page-flipping + animation that respects the reduce-motion CSS media query. When the user enables the reduce motion preference, + the page-flipping animation is turned off.
+
Essential animation
+
A web application provides a feature to author animated sequences. As part of this tool the author needs to preview the animation.
+

Resources

From 10957c509a3414f68009644cabcda8f3b3660ad1 Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:26:18 +0100 Subject: [PATCH 06/12] Update understanding/20/audio-control.html --- understanding/20/audio-control.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/20/audio-control.html b/understanding/20/audio-control.html index b0f112b064..83cc68b2d5 100644 --- a/understanding/20/audio-control.html +++ b/understanding/20/audio-control.html @@ -42,7 +42,7 @@

Intent of Audio Control

See also 1.4.7 Low or No Background Audio.

In the context of this Success Criterion, "plays automatically" broadly refers to audio that - is not stated/played as a direct result of a user's explicit activation.

+ is not started/played as a direct result of a user's explicit activation.

Benefits of Audio Control

From c2a39ab2d999ccd1184fd7b7cb286bf454cbb612 Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:44:12 +0100 Subject: [PATCH 07/12] Update understanding/20/pause-stop-hide.html --- understanding/20/pause-stop-hide.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index 10ec434952..16bda9b991 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -26,7 +26,7 @@

Intent of Pause, Stop, Hide

In the context of this Success Criterion, "starts automatically" broadly refers to animations/updates - that are not the direct result of a user's explicit activation.

+ that are not the direct result of a user's intentional activation, e.g., selecting a link or button.

"Moving, blinking and scrolling" refers to content in which the visible content conveys a sense of motion. Common examples include motion pictures, synchronized media presentations, From b511327f8f88897ad53079d6e3c3055bb1f08082 Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:45:12 +0100 Subject: [PATCH 08/12] Update understanding/20/pause-stop-hide.html --- understanding/20/pause-stop-hide.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index 16bda9b991..613ad2e061 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -26,7 +26,7 @@

Intent of Pause, Stop, Hide

In the context of this Success Criterion, "starts automatically" broadly refers to animations/updates - that are not the direct result of a user's intentional activation, e.g., selecting a link or button.

+ that are not the direct result of a user's intentional activation, for example, selecting a link or button.

"Moving, blinking and scrolling" refers to content in which the visible content conveys a sense of motion. Common examples include motion pictures, synchronized media presentations, From 4b3558e57f551471fb792476076e3257ad976ee4 Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:46:04 +0100 Subject: [PATCH 09/12] Update understanding/20/audio-control.html --- understanding/20/audio-control.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/understanding/20/audio-control.html b/understanding/20/audio-control.html index 83cc68b2d5..f38b302fd5 100644 --- a/understanding/20/audio-control.html +++ b/understanding/20/audio-control.html @@ -41,8 +41,8 @@

Intent of Audio Control

See also 1.4.7 Low or No Background Audio.

-

In the context of this Success Criterion, "plays automatically" broadly refers to audio that - is not started/played as a direct result of a user's explicit activation.

+

In the context of this Success Criterion, "plays automatically" broadly refers to audio + that is not the direct result of a user's intentional activation, for example, selecting a link or button.

Benefits of Audio Control

From 3e2cda7d2234a7c8fb454c033b13f27f7dbb6126 Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:49:11 +0100 Subject: [PATCH 10/12] Update understanding/20/audio-control.html --- understanding/20/audio-control.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/understanding/20/audio-control.html b/understanding/20/audio-control.html index f38b302fd5..0009d2697e 100644 --- a/understanding/20/audio-control.html +++ b/understanding/20/audio-control.html @@ -41,8 +41,7 @@

Intent of Audio Control

See also 1.4.7 Low or No Background Audio.

-

In the context of this Success Criterion, "plays automatically" broadly refers to audio - that is not the direct result of a user's intentional activation, for example, selecting a link or button.

+

In the context of this Success Criterion, "plays automatically" broadly refers to audio that is not started/played as a direct result of a user's intentional activation. For example, not selecting a link or button.

Benefits of Audio Control

From 2ebcde135c5d5c55071f117b926306c1938dc37f Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:50:04 +0100 Subject: [PATCH 11/12] Update understanding/21/animation-from-interactions.html --- understanding/21/animation-from-interactions.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/21/animation-from-interactions.html b/understanding/21/animation-from-interactions.html index a226548a93..84ae1e23b9 100644 --- a/understanding/21/animation-from-interactions.html +++ b/understanding/21/animation-from-interactions.html @@ -23,7 +23,7 @@

Intent

The intent of this Success Criterion is to allow users to prevent animation from being displayed on Web pages. Some users experience distraction or nausea from animated content. For example, if scrolling a page causes elements to move (other than the essential movement associated with scrolling) it can trigger vestibular disorders. Vestibular (inner ear) disorder reactions include dizziness, nausea and headaches. Another animation that is often non-essential is parallax scrolling. Parallax scrolling occurs when backgrounds move at a different rate to foregrounds. Animation that is essential to the functionality or information of a web page is allowed by this Success Criterion.

-

"Animation from interactions" applies when a user’s interaction initiates non-essential animation. In contrast, 2.2.2 Pause, Stop, Hide applies when the web page initiates animation "automatically" that is not in response to an explicit user activation. There may be situations where a particular animation may fail both Success Criteria.

+

"Animation from interactions" applies when a user’s interaction initiates non-essential animation. In contrast, 2.2.2 Pause, Stop, Hide applies when the web page initiates animation "automatically" that is not in response to an intentional user activation. There may be situations where a particular animation may fail both Success Criteria.

The impact of animation on people with vestibular disorders can be quite severe. Triggered reactions include nausea, migraine headaches, and potentially needing bed rest to recover.

From 0909e505d6bb847d6c51d3b84cf500a263e0dcec Mon Sep 17 00:00:00 2001 From: Alastair Campbell Date: Fri, 23 Aug 2024 16:51:25 +0100 Subject: [PATCH 12/12] Update understanding/20/pause-stop-hide.html --- understanding/20/pause-stop-hide.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/understanding/20/pause-stop-hide.html b/understanding/20/pause-stop-hide.html index 613ad2e061..bf1aa3835c 100644 --- a/understanding/20/pause-stop-hide.html +++ b/understanding/20/pause-stop-hide.html @@ -92,7 +92,7 @@

Intent of Pause, Stop, Hide

This Success Criterion is specifically concerned with moving, blinking, scrolling, and auto-updating visual content. For audio content that starts automatically, refer to 1.4.2 Audio Control.

-

Moving, blinking, scrolling content that starts automatically not as a result of explicit *activation* (such as activating a button), +

Moving, blinking, scrolling content that starts automatically not as a result of intentional activation (such as activating a button), but because of a more general user interaction (such as focusing/hovering over an element, or scrolling the page), and doesn't provide a way to Pause, Stop, or Hide, will fail this Criterion, and potentially 2.3.3 Animation from Interaction.