A new way of delivering Retina images on the web

Recently, high-resolution screens (Apple calls them Retina displays) have become popular – first on cell phones, then on tablets and now on laptops. I have been waiting for those for literally decades: all other computer components (memory, processor speed, etc.) improved predictably, but screen resolutions did not get much better over the years. The problem for web developers is that things look nicely on these displays if resolution-independent mechanism are used: fonts, vector graphics, CSS effects, etc. However, with bitmap graphics, you are forced to deliver images with many more pixels. That has the potential of greatly slowing things down on the web if you are using a Retina device.

Daan Jobsis has found an interesting solution: Use a high-resolution JPEG image, but but with an extreme compression rate (e.g. 75%):

[...] this image was razor sharp. The difference is even noticable on the iPad 1, 2 and normal computer screens. How bizarre, the filesize is smaller than the original. So a smaller filesize and a better quality on both screen types!

Details: “Retina revolution” by Daan Jobsis.