Sunday Morning

March Forth!

More on resizing files to improve load times and display quality

Following up from yesterday. I resized the Gray Sky picture to 218dpi and loaded it into the standard width. I realize now that this has less to do with the dpi of the image and more to do with the browser scaling a larger (more pixels) image than the actual file resolution. That makes sense. It's still a balance of file size vs. load time.

Gray Sky - Click to enlarge - 1962x1308 into a 648 wide frame

In the photo above, the file is resampled to 1962x1308 pixels at 218ppi. But that still makes the file too big to put on the page. I constrained the image by using the width attribute set to 648, letting the height fall where it may.

Native resolution for the Nikon sensor is 6000x400 at 300dpi. Why not just scale it to 600x400?

Here's the big file loaded into a small window

Looking at this on the Dell displays, I don't see much difference. The Apple Retina displays in my iMac and MacBookPro really show a difference.

Conclusion

High DPI displays (Apple Retina) benefit from a scaled image that would fit 218ppi. A standard 1920x1080 display isn't going to see this. Using larger files just slows down page loading.