Media Queries: Width vs. Device Width

Hi Ryan,

Thanks for the write up!

Little late on the article but was wondering…

What about using the ‘device-width’ media query for background image to load different sizes depending on the general size of the device? If you use the ‘width’ media query - resizing the browser viewport will make unwanted network requests for smaller images and cause white flashes to load the smaller images.

Even with its flaws (e.g. not being accurate with issues of pixels and not being future proof…), this method seems to work… although I have not extensively tested it. Wondering if there are any better ways to load responsive background images without the previously mentioned ‘width’ media query setbacks?