gazou-compressor.jp
ホームsrcset生成

srcset生成

幅リストとベース名を入力するだけで、srcset/sizes付きのHTMLを生成します。ブラウザ内処理で安全です。

ブラウザ内処理・アップロードなし

使い方(かんたん3ステップ)

  1. 画像を選択(複数可)。
  2. オプションを設定(品質/サイズ/形式など)。
  3. 「一括処理」→ 完了したらZIPで保存。
生成されたHTML
<img
  src="image-320.webp"
  srcset="image-320.webp 320w, image-480.webp 480w, image-640.webp 640w, image-800.webp 800w, image-1024.webp 1024w, image-1280.webp 1280w, image-1600.webp 1600w"
  sizes="(max-width: 640px) 100vw, 640px"
  alt="サンプル画像"
  loading="lazy"
  decoding="async"
/>
ヒーロー画像は loading="eager"、一覧は lazy 推奨。CLS回避のためwidth/height か CSS の aspect-ratio を必ず指定してください。

補足リソース