Web Image Flow

Web Image Flow Guides

Technical guides for agencies and developers migrating and optimising website images: WebP rollout, responsive image packs, migration manifests and build handoff.

Recent guides

How to migrate a client site to WebP without breaking layouts (webp-migration)
Use a migration manifest to hand optimised images to a build (migration-handoff)
Save PNG transparency in WebP without artefacts (webp-migration)
Set up a responsive image pack for an agency build (responsive-images)

Browse topics

WebP migration

Move a client site to WebP without breaking layouts or losing quality.

2 guides
Responsive images

Width sets, srcset and sizes for breakpoint-aligned image packs.

1 guide
Migration handoff

Manifests, filename conventions and build integration for agency releases.

1 guide
Page performance

Page-weight budgets and Core Web Vitals related to images.

0 guides