Web: Retina images in html page !

While I was searching about Retina images for dmg, I found text about “retina images in html page” (Safari).

After a simple search in my hard disk, I found a <img …/…> tag, a special line, a line build in an unknown (to me) way. It have two entries to load an image:

data-src= data-src-retina=

the first loads the 1x image while the second loads a 2x image.

I searched for “2x.jpg”, and located some html files. I loaded one of them in TextEdit, search for “2x.jpg”, and watch carefully the html text to locate what I wrote above.

The relevant entry in the Apple documentation is here .


It’s worth noting that those tags are only supported by safari.