Mediafuncties voor gebruikersvoorkeuren geven u de mogelijkheid om webervaringen vorm te geven die aansluiten bij de eigen specifieke voorkeuren en behoeften van de gebruiker. Met andere woorden: met voorkeursmediafuncties kunt u uw gebruikerservaringen aanpassen aan de verwachtingen van uw gebruiker.
U kunt de gebruikerservaring van uw website verbeteren door de volgende drie stappen te volgen:
- Ontdek de mogelijkheden . Leer alle mediafuncties voor gebruikersvoorkeuren kennen.
- Geef uw webervaringen vorm . Implementeer bijvoorbeeld wijzigingen in kleur, lay-out en elementgrootte op basis van de voorkeuren.
- Test de gebruikersinterface . Emuleer in DevTools de voorkeuren en test hoe uw website zich gedraagt.
DevTools ondersteunt een verscheidenheid aan emulatieopties. Om u te helpen het zoeken naar en aanpassen van systeem- en browserinstellingen te voorkomen, bevinden alle emulatieopties zich op één plek: onder het tabblad Rendering in DevTools.
De emulatieopties van de voorkeuren van de gebruiker omvatten, maar zijn niet beperkt tot:
-
prefers-color scheme: licht of donker kleurenschema -
prefers-contrast: lager of hoger contrast -
prefers-reduced-motion– minimaliseer beweging of niet -
prefers-reduced-dataverbruikt minder verkeer of niet
Zie CSS-mediafuncties emuleren voor een uitgebreide lijst met alle emulatieopties.
Om meer effecten te ontdekken die u kunt toepassen via het tabblad Rendering , zie het tabblad Rendering .
Bovendien zijn uw testmogelijkheden met DevTools niet beperkt tot het enkele apparaat waarop u werkt. U kunt mobiele apparaten simuleren met Apparaatmodus .