h5bp/html5-boilerplate — pull request #1622 by alrra (2014-10-21 16:31:52+00:00)
Title: Rename Apple touch icon & add <link> in index.html

Until now we recommended to our users to include an image named `apple-touch-icon-precomposed.png` in the root of their website.

Since the iOS 8 release however, Safari [will no longer request the `/apple-touch-icon-precomposed.png`](https://github.com/h5bp/html5-boilerplate/issues/1615) by default, and instead, it will make the following requests:

/apple-touch-icon-152x152-precomposed.png
/apple-touch-icon-152x152.png
/apple-touch-icon.png

In order to fix this issue [we decided](https://github.com/h5bp/html5-boilerplate/issues/1615) to rename `apple-touch-icon-precomposed.png` to `apple-touch-icon.png`, and include a `` element in the `index.html`:

Notes:

* Just renaming `apple-touch-icon-precomposed.png` to `apple-touch-icon.png` would have [also worked](https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html), even with older version of iOS. Unfortunately, it wouldn't have represented a good solution as Apple may change again what is requested by default, plus, it would have generated quite a few [404s](https://code.google.com/p/chromium/issues/detail?id=259681).

* We decided to rename the touch icon because most iOS users are on iOS 7+, so the `precomposed` keyword no longer brings much benefit (as of iOS 7, no special effects are applied to touch icons).

[According to Apple](https://developer.apple.com/support/appstore/) (as measured by the App Store on October 13, 2014)

![](https://cloud.githubusercontent.com/assets/1223565/4720999/2aa8ba26-5935-11e4-9492-92ff6a50ad7d.png)

(_Apple doesn't know how to count_)

* Adding `` in `index.html` will also [allow](http://www.ravelrumba.com/blog/android-apple-touch-icon/) (some of) the default Android 2.2+ browsers to use the touch icon.

---

This fixes h5bp/html5-boilerplate#1615 (to test, just go to http://html5boilerplate.com/ and `Add to Home Screen`).