srcset
同じ画像を複数用意して、どれを使うかはブラウザに任せる。画面や回線の事情を知っているのはブラウザのほうだ。
この属性には候補となる画像をディスクリプターとともに並べる。x はピクセル密度、w は画像の実際の幅(ピクセル)を表す。w を使う場合は sizes も必要で、レイアウト上の表示幅を伝えなければならない。選択はCSSが適用される前に行われるため、これがないとブラウザはどの候補で足りるか判断できない。
要点は判断を委ねることにある。ブラウザはビューポート幅、ピクセル密度、ズーム率、場合によっては回線状況まで把握しており、訪問のたびに違う選択をしてもよい。逆に、デスクトップでは横長、モバイルでは縦に切り抜いた画像、というようにトリミングを制御したいなら srcset は不向きで、条件を明示できる <picture> を使う。