"apple-touch-icon-precomposed" is not a real value for the rel attribute?

11.2k views Asked by At

Why do people (h5bp, Mathias Bynens) say to use a <link rel="apple-touch-icon-precomposed"> element? Apple's documentation on this makes no mention of apple-touch-icon-precomposed as a value for the rel attribute.


Apple's docs say this about precomposed icons:

Safari on iOS 7 doesn’t add effects to icons. Older versions of Safari will not add effects for icon files named with the -precomposed.png suffix.


So it seems that we could reference the precomposed apple touch icon like this, right?:

<link rel="apple-touch-icon" href="apple-touch-icon-precomposed.png">
2

There are 2 answers

3
Mathias Bynens On

This direct quote from the write-up on touch icons you linked to explains it:

As of iOS 7, no special effects are applied to touch icons anymore, so if you only care about iOS 7 and up you don’t have to use precomposed anymore.

In other words, it’s recommended for optimal display of your touch icons on older iOS versions. Feel free to not use it.

0
breams On

My own testing of iOS 6 on an iPad 3 made it seem as though the rel value was necessary when the filename used wasn't apple-touch-icon-*.

Adding -precomposed to an irregular filename (e.g. app-icon76x76.png) had no effect, whereas adding rel="apple-touch-icon-precomposed" removed the effects as expected.