アップルのWebサイトにRetina対応のiPadでアクセスすると、一昔前のWebサイト(インターレースGIF)のように、ボケた画像がジワっとシャープに切り替わります。通常の画像を表示した後で、Retinaディスプレイの場合には解像度が高い画像へ切り替えているのです。 それぞれの画像について、低解像度版と高解像度版の2種類を読み込むことになるので、転送データ量が増えてサイトの表示が遅くなってしまいますが、アップルは自社商品のイチオシ機能であるRetinaディスプレイでの表示の美しさを優先させたのでしょう。 このような画像切り替えは、「retina.js」や「retina-replace.js」などのJavaScriptライブラリーを使うと比較的簡単に実装できますが、すでに掲載している画像の高解像度版を用意したり(素材が残っていない場合は作り直しになる)、今後掲載する新しい画像を通常版と高解
![WebサイトのRetina対応は必要か?](https://cdn-ak-scissors.b.st-hatena.com/image/square/ebbc83c40b4765ff8a8ad5954daf643b27091134/height=288;version=1;width=512/https%3A%2F%2Fascii.jp%2Fimg%2F2011%2F07%2F07%2F298663%2Fl%2F0c7ae60c14c0a012.jpg)