Making pages fast.
THE PROBLEM
Images are usually the largest part of a page. Unoptimised images are the most common cause of a slow site.
A photograph from a phone can be several megabytes. The web version should be a small fraction of that.
WHAT TO DO
Resize to the dimensions actually needed, before uploading Compress, either with a tool before upload or a plugin afterwards Use an appropriate format Enable lazy loading, so offscreen images load only when scrolled to
FORMATS
JPEG for photographs PNG for logos and images needing transparency WebP for both, where supported, which is smaller SVG for logos and icons, which scale perfectly
SIZE GUIDANCE
- Full-width images: around 1600 pixels wide
- Content images: around 1200
- Thumbnails: sized to their display
Anything larger is wasted bandwidth on every visit.
TOOLS
An image optimisation plugin handles compression automatically on upload, which removes the discipline problem.
THE TEST
Check your page weight. If a page is several megabytes, images are almost certainly why.
