なぜこの画像は高解像度ですか？

Question

私はこのウェブページhereのヘッダーイメージが高解像度であるにもかかわらず、私がHTMLで作成したときに低解像度が出てくる理由で完全に混乱しています。私はまったく同じimgリンクにリンクしています。コードを調べると、この画像はimg data-srcでリンクされていますが、これが画像の品質に影響する可能性がありますか？

誰かがこれの周りに何かを知っていれば大いに感謝するでしょう。

Answer 1

：それはコードのサンプルです

https://static1.squarespace.com/static/57c0dbb31b631b53bedecc7e/t/57c29deb6a4963efc2c2eced/1472372377741/uxuihero.jpeg

いますが、よく見ると<image>要素の実際のsrc属性が

にあります

https://static1.squarespace.com/static/57c0dbb31b631b53bedecc7e/t/57c29deb6a4963efc2c2eced/1472372377741/uxuihero.jpeg?format=2500w

お知らせ終わり?format=2500w - それは一定の幅（これはモバイルデバイス上のネットワークトラフィックを節約する）で、画像を提供するように求めするためのサーバー用の一般的な方法です。

独自のコードにクエリパラメータを追加すると、同じ画像が表示されます。

Answer 2

このページの写真では、透明な背景色が追加されています。それは写真のフィルトルとして働く。画像のアドレスがある

background-color: rgba(0,0,0,.3);