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">
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.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With