HTMLで画像個別にRetina画像に差し替える

以下のように指定することで、画像ごとにスマホ用の別画像を指定することができます。

html

<img src="img/top/img_01.png" alt="" srcset="img/top/img_01.png 1x,img/top/img_01@2x.png 2x" />

こちらの場合img/top/img_01.pngが通常の画面での画像、img/top/img_01@2x.pngがretina対応ディスプレイの画面で表示される画像です。

参考：HTMLのsrcsetを使って画像をレスポンシブにRetina対応させてみよう