mirror of
https://github.com/h5bp/html5-boilerplate.git
synced 2026-01-09 14:48:02 -05:00
345925f043
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` 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¹ to rename
`apple-touch-icon-precomposed.png` to `apple-touch-icon.png`,
and include a `<link>` element in the `index.html`:
<link rel="apple-touch-icon" href="apple-touch-icon.png">
Notes:
* Just renaming `apple-touch-icon-precomposed.png` to
`apple-touch-icon.png` would have also worked², 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³.
* 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).
* Adding `<link rel="apple-touch-icon" ...>` in `index.html`
will also allow⁵ (some of) the default Android 2.2+ browsers
to use the touch icon.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
¹ h5bp/html5-boilerplate#1615
² https://mathiasbynens.be/notes/touch-icons
https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
³ https://code.google.com/p/chromium/issues/detail?id=259681
h5bp/html5-boilerplate#1615
⁴ According to Apple (as measured by the App Store on October 13, 2014):
* 5% iOS < 7
* 47% iOS 7
* 48% iOS 8
From: https://developer.apple.com/support/appstore/
https://cloud.githubusercontent.com/assets/1223565/4720999/2aa8ba26-5935-11e4-9492-92ff6a50ad7d.png
⁵ http://www.ravelrumba.com/blog/android-apple-touch-icon/
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Close h5bp/html5-boilerplate#1622
