2

レスポンシブ デザインの人気が高まっている現在、レスポンシブ デザインの欠点の 1 つは、モバイル クライアントが不要な大きな画像をダウンロードする必要があることです。

http://twitter.github.io/bootstrap/examples/carousel.html

ページは私の iPhone で非常によく拡大縮小されますが、ダウンロードされた画像1500x550は無駄で、遅く、一部のユーザーにとってはコストがかかります。

クライアントがモバイルであることがわかっている場合、大きな画像を提供しない代替アプローチは何でしょうか? 独自の UA スニッフィング コードを記述する必要がない既存のメソッド/ライブラリはありますか?

4

3 に答える 3

1

http://www.w3.org/community/respimg/およびhttp://responsiveimages.org/をご覧ください。

これは、レスポンシブ イメージの仕様を作成する W3 ワーキング グループです。

http://picture.responsiveimages.org/

今のところ、同様の構文を持つ JavaScript で記述されたポリフィルを使用できます。これは、独自の仕様に従って同じ担当者によって維持されています。

https://github.com/scottjehl/picturefill

私はそれをテストしましたが、見事に動作するため、本番環境で使用します;)

お役に立てれば

于 2013-07-14T14:22:02.593 に答える
0

この記事Media Query Asset Downloadingをご覧ください。画像を別の要素でラップされた背景画像にするのが最も効果的であることがわかりました。

これは非常によくある質問であり、良い質問ですが、まだ「ベストアンサー」はありません。

クラウンカーテクニックの記事はこちら

これがお役に立てば幸いです。さまざまなデバイスでの画像についてご心配いただきありがとうございます。これは見過ごされがちな問題です。

于 2013-07-14T14:23:33.170 に答える