Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
Sec-CH-Prefers-Reduced-Motion header
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimentell:Dies ist eineexperimentelle Technologie
Überprüfen Sie dieBrowser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Sicherer Kontext: Diese Funktion ist nur insicheren Kontexten (HTTPS) in einigen oder allenunterstützenden Browsern verfügbar.
Der HTTPSec-CH-Prefers-Reduced-MotionAnforderungsheader ist einUser-Agent-Client-Hinweis, der die Präferenz des User-Agents für die Anzeige von Animationen mit reduzierter Bewegung angibt.
Wenn ein Server einem Client über denAccept-CH-Header signalisiert, dass erSec-CH-Prefers-Reduced-Motion akzeptiert, kann der Client mit diesem Header antworten, um die Präferenz des Benutzers für reduzierte Bewegung anzugeben. Der Server kann dem Client entsprechend angepassten Inhalt senden, zum Beispiel JavaScript oder CSS, um die Bewegung von Animationen im nachfolgenden gerenderten Inhalt zu reduzieren. Dies könnte eine Reduzierung der Geschwindigkeit oder Amplitude von Bewegungen umfassen, um Unwohlsein bei Personen mit vestibulären Bewegungsstörungen zu reduzieren.
Dieser Header basiert auf derprefers-reduced-motion-Media-Query.
| Header-Typ | Anforderungsheader,Client-Hinweis |
|---|---|
| Verbotener Anforderungsheader | Ja (Sec--Präfix) |
Syntax
Sec-CH-Prefers-Reduced-Motion: <preference>Direktiven
<preference>Die Präferenz des User-Agents für reduzierte Bewegungs-Animationen. Dies wird oft aus der Einstellung des zugrunde liegenden Betriebssystems übernommen. Der Wert dieser Direktive kann entweder
no-preferenceoderreducesein.
Beispiele
Verwendung von Sec-CH-Prefers-Reduced-Motion
Der Client sendet eine erste Anfrage an den Server:
GET / HTTP/1.1Host: example.comDer Server antwortet und teilt dem Client überAccept-CH mit, dass erSec-CH-Prefers-Reduced-Motion akzeptiert. In diesem Beispiel wird auchCritical-CH verwendet, was anzeigt, dassSec-CH-Prefers-Reduced-Motion alskritischer Client-Hinweis betrachtet wird.
HTTP/1.1 200 OKContent-Type: text/htmlAccept-CH: Sec-CH-Prefers-Reduced-MotionVary: Sec-CH-Prefers-Reduced-MotionCritical-CH: Sec-CH-Prefers-Reduced-MotionHinweis:Wir haben auchSec-CH-Prefers-Reduced-Motion imVary-Header angegeben, um dem Browser mitzuteilen, dass sich der bereitgestellte Inhalt basierend auf diesem Header-Wert unterscheiden wird, selbst wenn die URL gleich bleibt. Der Browser sollte daher nicht einfach eine vorhandene zwischengespeicherte Antwort verwenden, sondern diese Antwort separat zwischenspeichern. Jeder imCritical-CH-Header aufgeführte Header sollte auch in denAccept-CH- undVary-Headern vorhanden sein.
Der Client führt automatisch die Anfrage erneut aus (daCritical-CH oben angegeben wurde) und teilt dem Server überSec-CH-Prefers-Reduced-Motion mit, dass eine Benutzerpräferenz für reduzierte Bewegungs-Animationen vorliegt:
GET / HTTP/1.1Host: example.comSec-CH-Prefers-Reduced-Motion: "reduce"Der Client wird den Header in nachfolgenden Anfragen in der aktuellen Sitzung einfügen, es sei denn, dieAccept-CH-Änderungen in den Antworten zeigen an, dass sie vom Server nicht mehr unterstützt wird.
Spezifikationen
| Specification |
|---|
| User Preference Media Features Client Hints Headers # sec-ch-prefers-reduced-motion |
Browser-Kompatibilität
Siehe auch
- Client-Hinweise
- User-Agent Client Hints API
Accept-CHprefers-reduced-motionCSS-Media-Query- HTTP-Caching: Vary und
Vary-Header - Verbesserung des Benutzerdatenschutzes und der Entwicklererfahrung mit User-Agent-Client-Hinweisen (developer.chrome.com)