srcset生成（レスポンシブ画像）

ツール概要

画像の複数サイズと `srcset/sizes` を生成し、レスポンシブ画像を簡単に導入できます。

使い方

1. 元画像を読み込み。
2. 必要な幅のリストを指定。
3. HTMLのサンプルをコピー。

活用例

• 記事本文の画像最適化。
• トップのヒーロー画像に複数解像度を用意。
• ギャラリー/カードでの通信量削減。

ポイント・知識

• `sizes` はレイアウトに合わせて正確に。
• 幅ごとに適切な品質でさらに軽量化。
• `loading=lazy` と組み合わせてLCPに配慮。