That's how you cater for high density devices. If you take a 320x image and display it at 320x CSS pixels, it'll look blurry on the vast majority of mobile dev

That's how you cater for high density devices. If you take a 320x image and display it at 320x CSS pixels, it'll look blurry on the vast majority of mobile devices, and a lot of laptops, because 1 CSS pixel is larger than 1 device pixel. https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio https://developer.mozilla.org/en-US/docs/Web/API/Window/devi... Fwiw this is covered in the article https://jakearchibald.com/2020/avif-has-landed/#what-is-acceptable-quality https://jakearchibald.com/2020/avif-has-landed/#what-is-acce...