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 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 Anforderungsheader ist ein User-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 den Accept-CH-Header signalisiert, dass er Sec-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 der prefers-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.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/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 auch Sec-CH-Prefers-Reduced-Motion im Vary-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 im Critical-CH-Header aufgeführte Header sollte auch in den Accept-CH- und Vary-Headern vorhanden sein.
Der Client führt automatisch die Anfrage erneut aus (da Critical-CH oben angegeben wurde) und teilt dem Server über Sec-CH-Prefers-Reduced-Motion mit, dass eine Benutzerpräferenz für reduzierte Bewegungs-Animationen vorliegt:
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, die Accept-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)