生成された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
を必ず指定してください。