确保可访问性是使您的网站变得更好的明确途径。当您使您的网站可访问时，您会增加您的受众，改善所有使用它的人（不仅仅是那些有可访问性需求的人）的体验，并且您也可以获得​​SEO 好处​​。

同样，​​首选项查询​​定制是另一个很好的机会，可以为您的用户提供个性化的体验，与他们交谈并且使用起来更愉快。

您可以利用的一种偏好查询是​​prefers-reduced-motion​​. 这种偏好意味着您的用户更喜欢没有华丽、快速动画的 Web 体验。您可以以支持此首选项的方式编写样式，然后为没有设置此首选项的人编写媒体查询以获得“更响亮”的交互体验：

另一个需要考虑的偏好是用户的首选配色方案。虽然今天大多数网站默认使用浅色主题，但深色主题在过去几年中一直是最热门的需求，尤其是在夜间浏览网页时。提供符合用户偏好的​​定制主题​​是改善用户体验的另一种方式。 

​​prefers-color-scheme​​​您可以通过使用 CSS 自定义属性并使用媒体功能调整这些自定义属性值来有效地做到这一点。如果您使用 、 和 等通用值​​background​​​，​​text​​​您​​highlight​​可以在一处更新您的值。

不要忘记使用该​​color-scheme​​属性来自动从浏览器获取一些主题转换。设置此属性会告诉浏览器页面支持哪些颜色主题（浅色、深色或两者）。反过来，浏览器也会自动将表单控件和浏览器 UI（如滚动条）转换为正确的主题：

在这个演示中，尽管我没有为我的颜色主题设置文本颜色，但由于我告诉浏览器该站点同时支持浅色和深色主题​​color-scheme: light dark​​​，​​:root​​它会自动将字体从黑色切换为白色。

您可以在 Chrome DevTools 的“渲染”面板下测试您的深色主题，而无需更改系统设置。下图显示了网站​​houdini.how​​在其暗模式下：

创建深色主题的另一个好处是您为用户提供的​​电池寿命节省。​​在 Pixel 6 Lab 的一项研究中发现，对于 OLED 屏幕，深色主题可节省 11% 的功耗。 

因此，现在您尊重用户的可访问性需求、偏好和电池寿命，这是让您的网站更好地为用户服务的一种非常好的方式。