モーションのRetina対応はしていますか？

AppleのRetinaディスプレイをはじめとした高精細ディスプレイにWebページを対応させる・・・俗にいう「Retina対応」。
多くの場合、Retina対応といえば高解像度用の画像を用意したり、SVGやWebフォントを使うことで対応していると思います。
ちょっと前まではスマホやタブレット端末用の「Retina対応」というイメージでしたが、高精細ディスプレイのPCも増えRetina対応の必要性が高まっています。

近頃ではJSやCSSでダイナミックなモーションをつけたページを見かける事も多くなりましたが、モーションもRetina対応が必要です。一般的な低解像度のディスプレイとRetinaディスプレイとではモーションが変化します。多少動きが重い程度ならいいのですが、画像のチラツキや不具合が起きる場合もあります。
そのため、モーションのブラウザチェックは上記の２種類のディスプレイで確認することをおすすめします。

明確なRetina対応の方法は今のところないのですが、
Retinaでもモーションをスムーズにする効果的な方法としてはCSS3でのアニメーションがあります。
対応ブラウザにもよりますが、できるだけCSS3でモーションを設定していくといいかもしれません。

今後は ぜひモーションのRetina対応を意識してみてください。