# HTML Images Checklist

Use this checklist before publishing pages with images.

- Use `img` for content images.
- Use CSS `background-image` only for decorative imagery.
- Write useful `alt` text for meaningful images.
- Use `alt=""` for decorative images.
- Set `width` and `height` to reduce layout shift.
- Use modern formats such as WebP or AVIF when appropriate.
- Compress images before deployment.
- Lazy-load images below the first viewport.
- Use `srcset` and `sizes` when resolution switching is needed.
- Use `picture` when the crop or art direction changes by viewport.
- Avoid hiding important text inside an image.
- Test the page on mobile and desktop.