Beta: Front-End Checklist is currently in beta. Some issues are still being fixed. Thanks for your patience.

ListsLoading

Images

Image optimization, formats, and responsive image strategies.

Accessibility

Make your content usable by everyone.

0/2checked

Provide meaningful alt text for images

Critical

Use <figure> and <figcaption> for image captions

Medium

Formats

0/5checked

Use modern image formats (WebP, AVIF)

High

Use <picture> with an <img> fallback

High

Use WebP format with fallbacks

PerformanceHigh

Use AVIF format for modern browsers

PerformanceMedium

Use progressive JPEG encoding

PerformanceLow

Loading

0/1checked

Prioritize loading critical images

PerformanceHigh

Optimization

0/10checked

Fix broken images

High

Serve images from a CDN

PerformanceHigh

Compress images without quality loss

PerformanceHigh

Optimize all images for web

PerformanceHigh

Optimise images for faster loading

High

Manage inline SVG size and complexity

Medium

Optimize SVG files

PerformanceMedium

Handle image loading errors gracefully

HTMLLow

Use descriptive image filenames

Low

Use image sprites where appropriate

PerformanceLow

Performance

Optimize for speed and efficient resource loading.

0/5checked

Set explicit width and height on images

High

Keep image file sizes within recommended limits

High

Lazy load offscreen images

High

Serve images at the correct display size

High

Use srcset for responsive images

High

Responsive

0/2checked

Implement responsive images with srcset

HTMLHigh

Support high-DPI retina displays

Medium

0 / 385