iOS has a concept of "Web Clips" for Web sites and applications. There are two main front-facing parts to an iOS Web application's presence on an iOS device: its Home screen icon (or the Web Clip icon), and its startup image. These are represented by apple-touch-icon
and apple-touch-startup-image
respectively.
The main differences between traditional favicons and Home screen icons are:
Home screen icons are of a higher resolution. Even the smallest possible icon size, 29x29, is larger than the traditional favicon size, which is 16x16. Favicons in ICO format can have hi-res alternatives, but they weren't very well supported at the time iOS introduced Web Clips anyway.
iOS prior to 7 would apply a gloss effect to icons by default to make them look at home on a Home screen. To give developers the option of turning this effect off Apple provided another possible value,
apple-touch-icon-precomposed
. Of course, in iOS 7 these effects are no longer ever applied, but that's how it was previously.
Since Home screen icons are so fundamentally different from favicons, it doesn't make sense to try and make existing shortcut icon schemes work on iOS. Hence, apple-touch-icon
(and apple-touch-icon-precomposed
).
And of course, following the introduction of the iPad and the Retina display (and a combination of both), Home screen icons now come in all sorts of sizes. Now that Apple has its own icon type to work with it can simply introduce its own sizes
attribute for supplying different icon files for different sizes.
More details about Web apps in iOS can be found in the Safari Web Content Guide, particularly the section Configuring Web Applications.