2

レスポンシブ サイトでモバイルとデスクトップのどちらに提供する画像アセットを決定するためのベスト プラクティスは何ですか? 望ましい結果は、大きな高解像度の画像をデスクトップ ユーザーに提供し、小さな画像をモバイル ユーザーに提供することです。

4

1 に答える 1

1

前回これを調べたときの方法はこれでしたが、これはまだ問題を解決する良い方法だと思います。

  • 最初に低解像度の画像を読み込んでみてください。これにより、ブラウザーに適切なデータが迅速に提供されます。
  • 次に、JavaScript (このためのライブラリがあります) を使用して、ブラウザーの機能を検出できます (ピクセル比率が高いか、画面が大きいかなど)。
  • 次に、より大きなバージョンをロードするかどうか、および特定の画像を決定します (このために画像のデータ属性にさまざまな URL を入れると便利な場合があります)。

もちろん、あなたのソリューションは少し異なるかもしれませんが、プログレッシブエンハンスメントを常に心に留めておいてください (最初に大きな画像をロードするのは意味がありません)。

于 2016-03-08T19:21:58.527 に答える