Update frequency media query

概要

update メディアクエリはデバイスが描画後にどの程度の速度で表示を更新できるかを検出します。none（eインクなど）、slow（更新が遅い）、fast（通常のディスプレイ）の3つの値があります。eインクデバイスやプリンターなどアニメーションに対応できないデバイスでの最適な表示を提供するために使用します。

対応ブラウザ

基本構文

@media (update: slow) {
  * { animation: none !important; }
}
@media (update: none) {
  .animated { display: none; }
}

実務での使いどころ

• eインクデバイス対応

  eインクディスプレイのような更新が遅いデバイスでアニメーションを無効化し、適切な静的表示を提供します。

注意点

アクセシビリティ

• アニメーションが表示できないデバイスのユーザーに対して、同等の情報を静的な方法で提供してください。

参考リンク

• MDN Web Docs — Update frequency media query