正解はレスポンシブイメージの提供です。<source>要素でメディアクエリや画像形式に応じた画像を指定でき、WebPなどの新しい画像形式のフォールバックも実現できます。<img>のsrcset属性でも類似の機能がありますが<picture>はより細かい制御が可能です。