Skip to content

Responsivt billede — nødvendig filbredde (srcset)

Hvor bred skal billedfilen reelt være, når skærmens pixel-tæthed tælles med?

Et billede, der vises 400 CSS-pixels bredt på en skærm med device pixel ratio (DPR) 2, skal reelt leveres i 800 fysiske pixels bredde for at se skarpt ud — ellers bliver det sløret. Denne teknik er kernen i srcset/sizes-attributterne til responsive billeder. Beregneren viser den nødvendige pixelbredde og runder op til nærmeste almindelige srcset-breddetrin.

800px
Anbefalet srcset-breddetrin1.024 px
3D …

nødvendig pixelbredde = visningsbredde (CSS px) × device pixel ratio

vælg den mindste almindelige srcset-breddefil (320/480/640/768/1024/1280/1600/1920/2560 px), der er ≥ den nødvendige pixelbredde

The result is indicative and an aid tool for estimates and learning. It does not replace design, applicable standards and legislation or a qualified professional's specific assessment. Always check against the source (web.dev/MDN — responsive billeder (srcset/sizes-teknik)) and actual conditions on the task. See sources & reservations.