Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-view-transitions] Users need to be able to disable view transitions#10267

Open
plinss opened this issue Apr 29, 2024 · 3 comments
Open
Labels
a11y-needs-resolution Issue the Accessibility Group has raised and looks for a response on. css-view-transitions-1 View Transitions; Bugs only

Comments

@plinss
Copy link
Member

plinss commented Apr 29, 2024

This is based on feedback from a related TAG review.

View transitions also need to be considered in #5321 and #7440.

There seems to be an attitude that view transitions are primary content under the complete control of the page author. This violates the priority of constituencies and potentially creates inaccessible content for many users.

It needs to be made clearer that view transitions are an enhancement and the web page should not break if they are disabled (and given the script component, it may be necessary to define behavior when they are disabled). The user also needs a mechanism to disable them.

@plinss plinss added a11y-tracker Group bringing to attention of a11y, or tracked by the a11y Group but not needing response. css-view-transitions-1 View Transitions; Bugs only labels Apr 29, 2024
@matatk
Copy link

matatk commented May 1, 2024

We discussed this on today's APA WG call and the consensus is: yes, please! We do think that view transitions should be disable-able. We mused on whether prefers-reduced-motion may be a good signal for the user's desire on this - however, this case is one of the (several, perhaps) cases where some users would likely need the feature to be completely disabled.

Does this invite the notion of a prefers-no-motion query? Not sure. There are several motion/animation sources over which it'd be good to give users control that aren't affected by media queries, so there seems to be a gap/opportunity of some kind here (but this feels like it's going way bigger than scope, so I'll desist).

@w3cbot w3cbot added a11y-needs-resolution Issue the Accessibility Group has raised and looks for a response on. and removed a11y-tracker Group bringing to attention of a11y, or tracked by the a11y Group but not needing response. labels May 9, 2024
@vmpstr
Copy link
Member

vmpstr commented May 13, 2024

There are two components of view transitions: running the callback, and running the animations. The callback that is run is part of the page state that modifies DOM in some way to advance the state. That isn't an enhancement and must be run (assuming script can indeed run startViewTransitions). It's a common pattern to have

if (document.startViewTransition) {
  document.startViewTransition(updateCallback);
} else {
  updateCallback();
}

As for the animations, view transition constructs CSS animations and relies on that to execute the visual transition. I presume that the treatment for view transitions would not be any different from the treatment of CSS animations.

@khushalsagar
Copy link
Member

+1 to the comment above. Since the animations in VT are powered by CSS/web animations (from UA and/or author), the strategy we use for CSS animations/web animations overall should by design apply to VT as well.

Reading through the comment threads on #7440 though, there is a desire to permit cross-fade style of animations wherever possible. If the user has a "no-motion/forced-reduced-motion" type of setting, then VT is maybe in a unique position to do this easily? The default UA CSS (which adds a name to the root with a cross-fade of old/new state) is already a simple cross-fade between the 2 states. We could force all VTs to only apply UA CSS rules for VT props/pseudos for the "no-motion/forced-reduced-motion" mode. @fantasai @flackr fyi.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y-needs-resolution Issue the Accessibility Group has raised and looks for a response on. css-view-transitions-1 View Transitions; Bugs only
Projects
None yet
Development

No branches or pull requests

5 participants