Sec-CH-Prefers-Reduced-Motion

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Der HTTP-Sec-CH-Prefers-Reduced-Motion Request-Header ist ein Client-Hinweis des User-Agents, der die Präferenz des User-Agents angibt, dass Animationen mit reduzierter Bewegung angezeigt werden sollen.

Wenn ein Server einem Client über den Accept-CH-Header signalisiert, dass er Sec-CH-Prefers-Reduced-Motion akzeptiert, kann der Client daraufhin mit diesem Header antworten, um die Benutzerpräferenz für reduzierte Bewegungen anzugeben. Der Server kann dann entsprechend angepassten Inhalt, zum Beispiel JavaScript oder CSS, an den Client senden, um die Bewegung von Animationen im dargestellten Inhalt zu reduzieren. Dies könnte das Verringern der Geschwindigkeit oder der Amplitude der Bewegung beinhalten, um Unbehagen für Personen mit vestibulären Bewegungsstörungen zu reduzieren.

Dieser Header ist dem prefers-reduced-motion Media Query nachempfunden.

Header-Typ Request-Header, Client-Hinweis
Verbotener Header-Name Ja (Sec--Präfix)

Syntax

http
Sec-CH-Prefers-Reduced-Motion: <preference>

Direktiven

<preference>

Die Präferenz des User-Agents für Animationen mit reduzierter Bewegung. Diese wird oft von den Einstellungen des zugrunde liegenden Betriebssystems übernommen. Der Wert dieser Direktive kann entweder no-preference oder reduce sein.

Beispiele

Verwendung von Sec-CH-Prefers-Reduced-Motion

Der Client macht eine erste Anfrage an den Server:

http
GET / HTTP/1.1
Host: example.com

Der Server antwortet und teilt dem Client über Accept-CH mit, dass er Sec-CH-Prefers-Reduced-Motion akzeptiert. In diesem Beispiel wird auch Critical-CH verwendet, was anzeigt, dass Sec-CH-Prefers-Reduced-Motion als kritischer Client-Hinweis betrachtet wird.

http
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Sec-CH-Prefers-Reduced-Motion
Vary: Sec-CH-Prefers-Reduced-Motion
Critical-CH: Sec-CH-Prefers-Reduced-Motion

Hinweis: Wir haben Sec-CH-Prefers-Reduced-Motion auch im Vary-Header angegeben, um dem Browser mitzuteilen, dass der ausgelieferte Inhalt basierend auf diesem Header-Wert unterschiedlich sein wird, auch wenn die URL gleich bleibt, sodass der Browser nicht einfach eine vorhandene zwischengespeicherte Antwort verwenden, sondern diese Antwort separat zwischenspeichern sollte. Jeder im Critical-CH-Header aufgeführte Header sollte auch in den Accept-CH- und Vary-Headern vorhanden sein.

Der Client wiederholt automatisch die Anfrage (aufgrund der oben angegebenen Critical-CH), indem er dem Server über Sec-CH-Prefers-Reduced-Motion mitteilt, dass eine Benutzerpräferenz für Animationen mit reduzierter Bewegung besteht:

http
GET / HTTP/1.1
Host: example.com
Sec-CH-Prefers-Reduced-Motion: "reduce"

Der Client wird den Header in nachfolgenden Anfragen in der aktuellen Sitzung einfügen, es sei denn, das Accept-CH ändert sich in Antworten, um anzuzeigen, dass er vom Server nicht mehr unterstützt wird.

Spezifikationen

Specification
User Preference Media Features Client Hints Headers
# sec-ch-prefers-reduced-motion

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Sec-CH-Prefers-Reduced-Motion request header
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.

Siehe auch