Ga naar hoofdinhoud

2026-05-19 · 1 min leestijd

Afbeeldingen resizen voor responsive layouts

Exporteer exacte breedtes die je layout gebruikt — stuur geen 4000px bronnen naar mobile.

imageperformancefrontend

Belangrijkste punten

  • Resize eerst, comprimeer daarna — volgorde telt voor kwaliteit en bytes.
  • Behoud aspect ratio tenzij art direction crops vereist.

Match je srcset

Genereer 1x/2x breedtes per breakpoint in plaats van één gigantisch masterbestand.

Koppel resized outputs aan Image Compress met hetzelfde formaat dat je shipt.

Veelgestelde vragen

Welk formaat na resize?

WebP voor foto's in moderne stacks; PNG wanneer je scherpe UI-randen nodig hebt.

Breedte in secundair veld?

Voer doelbreedte of WxH in; tool past binnen grenzen zonder onnodig upscalen.