From 2fe7134fb544207173bb7c63f31f08d7b05b0224 Mon Sep 17 00:00:00 2001
From: Hans Christian Reinl <anything@drublic.de>
Date: Fri, 30 Aug 2013 15:08:06 +0200
Subject: [PATCH] Use one apple-touch-icon instead of six

This commit removes five Apple Touch Icons with different sizes for
the same icon and adds a new icon `apple-touch-icon-precomposed.png`
with a resolution of 152x152px.
Apart from that it adds documentation on how to add more icons if
you need them within your project.
Using only one Apple Touch Icon saves time and is enough in most
cases.

Closes #1367.
Closes #1425.
---
 CHANGELOG.md                             |   1 +
 apple-touch-icon-114x114-precomposed.png | Bin 751 -> 0 bytes
 apple-touch-icon-144x144-precomposed.png | Bin 939 -> 0 bytes
 apple-touch-icon-57x57-precomposed.png   | Bin 450 -> 0 bytes
 apple-touch-icon-72x72-precomposed.png   | Bin 512 -> 0 bytes
 apple-touch-icon-precomposed.png         | Bin 450 -> 1226 bytes
 apple-touch-icon.png                     | Bin 450 -> 0 bytes
 doc/extend.md                            |  28 +++++++++++++++++++++++
 doc/html.md                              |  15 ++++--------
 doc/usage.md                             |  16 ++++++++-----
 10 files changed, 44 insertions(+), 16 deletions(-)
 delete mode 100644 apple-touch-icon-114x114-precomposed.png
 delete mode 100644 apple-touch-icon-144x144-precomposed.png
 delete mode 100644 apple-touch-icon-57x57-precomposed.png
 delete mode 100644 apple-touch-icon-72x72-precomposed.png
 delete mode 100644 apple-touch-icon.png

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 63e6d61ff1..49e575d4b6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ### HEAD
 
+* Use one apple-touch-icon instead of six ([#1367](https://github.com/h5bp/html5-boilerplate/issues/1367))
 * Move font-related declarations from `body` to `html` ([#1411](https://github.com/h5bp/html5-boilerplate/issues/1411)).
 * Update to Apache Server Configs 1.1.0.
 * Vertical centering for audio-, canvas- and video-tags ([#1326](https://github.com/h5bp/html5-boilerplate/issues/1326)).
diff --git a/apple-touch-icon-114x114-precomposed.png b/apple-touch-icon-114x114-precomposed.png
deleted file mode 100644
index 1a7d0a542d597dacb787f2365ae389cf3ea6bdfa..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 751
zcmV<L0ucR)P)<h;3K|Lk000e1NJLTq0043T0043b0{{R3xC3=h0000mP)t-sAt52(
zg(ELXQG-+>B`hv2Kt?JyI-+GF!F3})F(EA{A#X||SUn=se<Ma`Z#`IE(ySFM0007d
zNkl<ZcmeI0TMpYm2t{GuZ|{G%jaAe{@-)=-wLjW98$dbXVi;Qd2P_tg#Ud9U=vizH
zV|%t}N;F>h2fZ?9Gj@!7$}6*VV?0?jF(=xj=0*?D_(k?ZaCASBUql*$r~B#rqLb0h
z0=@3kpqqty-OX-N(mdjIr<fto%~Teu8$x)->x0oO{EMtN5X`G!^=QJp3Q3P9&a2RL
zvpBC$Ml<mTz4-g1nOOiwQ}=o_yWQ{g5Y79&3KbSj-77wtx>q5)A-LPU3ijq`T0YRp
z>t<12g+?y?g#L<Vzrquu{YE>d4nQmv94WNUFnT5O#(1r0i3}oTa%M*_YH?DHpcc&u
zCRNajmWY%3MoCfaIH`gsx=(Iz<h=456}bSZYR_JZs3k?JA{QgoUHWwBQiCEDEY}k0
zeWP~~UaE@4hY`|6x>UT}-p+<mp|V24NfjC^MDm+17284-#@HZIg~S?-#`q{204uX@
z){J*i2RTI)`fgT=deoDIZWg$<7uJyDM1Y-m3W>rHJj|;?Mw;#XCsd%>#)4+n!=6Vh
zA4xN_ZU_c{Ri<1l(yTsuY#~RjPX-XkY@L1?!{p0dP-f$N-SCd=Z_RGV(No_WmB^i%
zbr7$|HPusz^U*#$%BwAho3Y+7+WXgy%27^ev+c8QrhBo-mC+7}i9PhqafPcLI@;5*
zZ;ty-PQZ_5p7zagg|oQPUZro;w}#eHqdiLB=&OH;n9*M5eKVJ4A!h5eZye2O31BwP
z`sRz2czv{=exs__2ar2^z!h?rM|(Jbz<J%Qg7c>jI3s4S77eHV5IrVpQSZ)nfoc|y
hGqhMN7K_C{!w=c;GGda16e9ot002ovPDHLkV1mb$S*rj5

diff --git a/apple-touch-icon-144x144-precomposed.png b/apple-touch-icon-144x144-precomposed.png
deleted file mode 100644
index 6c0ab269eec532d8957e3fe7e16c3eb9afc3f2b7..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 939
zcmV;c162HpP)<h;3K|Lk000e1NJLTq0058x0058(0{{R3(3ld60000mP)t-sAt50r
zDJb8CBf)heDmFT5M<OptQH)t4N;V<We<L|AAud5jK3QKzXK$};BBN#^ChaNl0009v
zNkl<ZcwX(92@cyZ3<OE)zU=@1wrGP8ZXwlHVp>A0d4Z5wEQ2-tXDk+r#bU8oEEWh>
z!$d>{w&aPPWGG@O6Fo_hgIs<+38yedq(GM!31=`y<gvW5INlhM16vpzZj2~^F3jL?
zJNk)%%+m6BV?;ZoNt}6lfmj$j*w|do6unTB#M;xFID<1bHcu4=B6fxoI5WhM9~)~n
z#<;On#KxF#be4u1o2QB#9odIh5z_BOD2yFwj4`9DXeVZZDq>^vR1q6v+%eWT&KRSH
zR#7CT8tXjR*m!4(D&Qg3cBnCSmI^b_7_*J5B1Ki=s49w7$Bc@#BW8{&Qq;hMPH!Fz
zk*5~!b{E?f6txK36<k*X%i{o0<7FL+WC<Pst+kh*ggZ&HBY?Kn_B_c162kysvTrmF
z)}}oFJbh0>C#&m-9;S_TefFfNWOVgEh`CprLx5y!AY8@Yr!BN}*#sTnHj6IC$m&W6
zy?8Z=E(UioT?iG#E6G8JE?I4?t1Hd2mqf)LUGm!6y5MV~dQO+nCD~Y4XPSjBiTkj8
zgf2<&qPm#NLGq%ynAjmqm;6DR#ZIjP$fe}I^66)z%lOycm?d;ENY^p%9VCnBVq-nd
zc)9A(C0LE|xDnd~5(MgUri<{r=c$LCo$<Uk&KQr@jF#Q;`kh&k<+Tq7SVU)ZLwy7g
zcDD6z3rW%$5`E(=KV~dA^|u4d;6pX7V!IDKB*9%jG#6d~6P|bG+oMK8h}+}NTzxWp
zjR@G#7Qu=+Q`J#J^U4EWJ$hhcHO=X`9N=DaCRNs^mS%fI*O~#r3YGPCviY#KhYl>(
z)6B3o_ebod4y>u9xxQ(b@W`Jc*Glsd%`=I-vrtKMbJKA0W$n)wOkJNzf=pSvR+<@X
z%_K(Tz^c<U|A`TG7EjWQHOoryz?$<kw+DAGaA3ESG&e9o$Qg2)I~OspWSp6Hn)QW3
zjkh0Iw{e=g2SXDC%Gv<n$9rnrHi17y`kSv64sLe_I(_-6G#{ObJgGOFI^TX^b*iPg
z|49h<KS_TmKHt7NV5)Rsr??Eaf=PcTJ{N?!&>H?J7K_DVu~;k?iys^&V}>&3>fHbU
N002ovPDHLkV1hirrS1R#

diff --git a/apple-touch-icon-57x57-precomposed.png b/apple-touch-icon-57x57-precomposed.png
deleted file mode 100644
index d155af6bf46da3121d140ee9268b549f39f28fe9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 450
zcmV;z0X_bSP)<h;3K|Lk000e1NJLTq0021v0021%0{{R3yT)_30000mP)t-sAt50q
zC@0T-Bj1H1MrUubZ6Yf;J1<F5KU!d&V<Ip@MsG?YSwAE>E+IuUA%|8XAzbFS0003^
zNkl<Zcmds&+m3)B3`9GWJBa`Px2pj+>ox-T=y{)TQkX*D=TmHC=^cigkDzrjXREb-
zkqsQkA5llEC{`4Yq+ge1PS6K-S(e}Ff=^)e0ceH9{8BgYi6OT-BXFf)RX1^EU!GCm
z%JP+Ne32Jtl=vc0^xk)p$=pzUq0Eh)0C~y;J6Y%Kzicr)Lgh2)L>7Vj7{E2+e`CcR
z5?R-<@-m){RiWq_Ad>74!2rku?_@P=Du7{Wip#XW&qQ==+7P}Qw4VtUVVlmXd1*Qx
zuOT<pZ^MGEQ#DadsjJ<5H5E5P)t%iV88L7JcB~7o1e~uX|LW?YZmtJj&n>Dyx_&Hc
zHn@g0bp?*U3DtH+1MPk@M!Kbr=JrgBY8$(&yK{gj6vBkAIY%Q4l~ny;V&?@t6slyQ
sD}a4yFrw6z*><4JT6zgUAK=sc0PjT+V!Vv+n*aa+07*qoM6N<$g8o*$?*IS*

diff --git a/apple-touch-icon-72x72-precomposed.png b/apple-touch-icon-72x72-precomposed.png
deleted file mode 100644
index 10e2a49e4830c63c27d234814e84c4bef8314a7b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 512
zcmV+b0{{JqP)<h;3K|Lk000e1NJLTq002k;002k`0{{R3VlzW^0000mP)t-sAt50r
zDJUv7Ip2jNMP_a<Nl~F>BENJa(|;pyN+MW3B1JSIi&!E#FCr~KMm$wqA3%wS0004t
zNkl<ZcmeI!S&qXn2!LS&-nZQUwo^+*>8La^<z+_7cLM(w!Eyh}?FQ&fSnG#J#|(N#
z@BIX4m8kj!olPZ*!7t7x5)oRC#4-^TzXWR;QJj7OTiG(~ZJCyG_=m$*wj|^>OWD%=
zGTpa;o~)x(=qZEkx+AfASVjqm@hBO}n5B)&%%e2uMFLzlMlX|Abl?OKNhKGUL0+7l
z6jH;mOpx-@eiqE|G~uf}&I;^9UfIrK)5%)e%VOx5HZNB>OHlGv)<F3<lJPmOzh-T0
z%x=zN)tbc`2{QOYK8~i1_vFFDvnP?HPycWPRIMUG0_|TwAzAavJsC+>g6_!$VshKm
zJozk@OsBzZ>aq?v(${VI{3dV>UndsPFWRx@&4cF~1DdwZ3l+}~G@cLTq8aPder=4R
zZyRr$XP!$qD~7x9Ei-&w!gaqb@-4q@jFL6~%D}fQEU=aoA8t)UI1cO7c7JdN%&UD`
z%YGYPKNAqPKU~1;eF|ZFxB)p!27%km0NfvTyZr!Zei&RDs03;N0000<MNUMnLSTZ-
CUEH7m

diff --git a/apple-touch-icon-precomposed.png b/apple-touch-icon-precomposed.png
index d155af6bf46da3121d140ee9268b549f39f28fe9..1ea85edc6fd9d63f688509c47959a98e10a1c0d0 100644
GIT binary patch
literal 1226
zcmV;*1U37KP)<h;3K|Lk000e1NJLTq005W(005W>0{{R3FC5Sl0000mP)t-s>x(1c
zh9kRjBbi_#Y)B%5bVf#Ja6DFAFiBA<Gd3<hLnSFHOE)1hDj^{uAr>1T=)mCp000D4
zNkl<ZcmeI1VXoXD41@=WvIzuy|J$}3Jy}Jqx2!Xf@`E|S_wsqiz(adzCfEd<U=PX!
zn_v@cf=#dqHo+!XDNh8G<tXb`9takbyw>$qo(5J!Y<c~i*ZwFlS%9OhtD-#yECwXm
z)*rO|6fmjbcj~@s@<YHDgn&g}t7d<O${0dGlx@{)PXLo6oT+8iyvSgFlYEy1l@TXc
zY&-Xpfnf5?yUH{V082Qrw906W0fNahY?ok|{CoTh9n4`;U1nyLfn$<iWw>Tix#(2}
zlF4%|{W<<Z26LFy973!zTwO<<%gn1XuuS^b5+AIFJ~)U~hASq6hF@i1nA9|0m4RbY
z$A4p0892X5b-A-#f?`rr+ly3XV3;&qW;&R|q^>2$_>;kO9d)5q8N6I-(yp>gF2OOW
ziLG&5f^)FY;2>2QE+6)9sxoj*@~R9xlUil_rYSTq8H;7|bUB!>z?PVX5`&#In6JQU
z!dQYG3?&|)|2+WX^mliXNGscx%kc0^jkuc%;gHt$?VbF^uQJ_ChFGPQy!~V^qhNA`
zThW##KcCA+Q!u|yzeW?yE?8;HO=L)_vCnRU`E`0V_89|fQWN-7|JIoQ%~b}#w9;_5
zMos=^iOUhe)z~bJ`*)`c(Mr2lV>avJew|27TCqRZI2gIo7BMvz??Ex)R*n7>tiRH{
z8WrqTofy;T0MomN|0rQ=^n<x|s>Wt(yauKlimNe~#sJewV`<zS_e$1=LK3kwmgWFs
zZK%W6NV|zUew|K@_k)G%*609><6u~%tgA<(1FU{G`scfkq0s?GTL7))^&PvsXkh6p
zu+!z4m;JdoDkB^&6-~L=U~(XQlX$vRG}TB2bC?V`q^#bTV%%j?U23+wz~uOPhxabs
zVEohKA-nC82Nu8O!qU0SH-S~hv0B>ZbctI`YHH`Q_`!T-fzONF<r3G+0x?-=NN$(7
zT>D6$4&7Dqs#$LVOR(=jQWMB7;Ww%GpglL~?oej=zl07Zhw-`OJl7XXXY5?Q3K7gM
z3&ca8E_b~{krp}pr+uV9U!Zeos*|zE;jMjypU<T!|9lqmE^;_cBGvA}UUjk-Ih<v&
zv~%h;s`Ci=w8%FySdB2IzR&(wr6D#~`NL8B-PHHV`YdF*EL^YzW9s{q{#i&}I?5m8
zwQo(mCU?(57Y}6^Gigk{dHGkJ?n4>I%R;Aq<mFN;&0gdTun2SN?aP0HeJCS=)&EU>
zE+1dIJ&PQ}CXwp+=Te>SMULUJu&2I!`jfni97DDLaq9p7(j9x31Td|Ad+N)`KQ0_D
zF=Fz=)Q?Q4;qto5(W$p}8i%sW!{3@!5<`)ej75GC%;4JFcxvlkS6E<e&z{fKC)+L^
zV49L0pUXlkL@-6ulDL4Dd0-t{ZvJfQk_M(|s?m?e1Jjhfw2LX*y7R#(DNhB{Ot1+y
o!6w)Qn_v@cf=#dqHo<PrF9NLk#K`kjh5!Hn07*qoM6N<$f=ez_VE_OC

literal 450
zcmV;z0X_bSP)<h;3K|Lk000e1NJLTq0021v0021%0{{R3yT)_30000mP)t-sAt50q
zC@0T-Bj1H1MrUubZ6Yf;J1<F5KU!d&V<Ip@MsG?YSwAE>E+IuUA%|8XAzbFS0003^
zNkl<Zcmds&+m3)B3`9GWJBa`Px2pj+>ox-T=y{)TQkX*D=TmHC=^cigkDzrjXREb-
zkqsQkA5llEC{`4Yq+ge1PS6K-S(e}Ff=^)e0ceH9{8BgYi6OT-BXFf)RX1^EU!GCm
z%JP+Ne32Jtl=vc0^xk)p$=pzUq0Eh)0C~y;J6Y%Kzicr)Lgh2)L>7Vj7{E2+e`CcR
z5?R-<@-m){RiWq_Ad>74!2rku?_@P=Du7{Wip#XW&qQ==+7P}Qw4VtUVVlmXd1*Qx
zuOT<pZ^MGEQ#DadsjJ<5H5E5P)t%iV88L7JcB~7o1e~uX|LW?YZmtJj&n>Dyx_&Hc
zHn@g0bp?*U3DtH+1MPk@M!Kbr=JrgBY8$(&yK{gj6vBkAIY%Q4l~ny;V&?@t6slyQ
sD}a4yFrw6z*><4JT6zgUAK=sc0PjT+V!Vv+n*aa+07*qoM6N<$g8o*$?*IS*

diff --git a/apple-touch-icon.png b/apple-touch-icon.png
deleted file mode 100644
index d155af6bf46da3121d140ee9268b549f39f28fe9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 450
zcmV;z0X_bSP)<h;3K|Lk000e1NJLTq0021v0021%0{{R3yT)_30000mP)t-sAt50q
zC@0T-Bj1H1MrUubZ6Yf;J1<F5KU!d&V<Ip@MsG?YSwAE>E+IuUA%|8XAzbFS0003^
zNkl<Zcmds&+m3)B3`9GWJBa`Px2pj+>ox-T=y{)TQkX*D=TmHC=^cigkDzrjXREb-
zkqsQkA5llEC{`4Yq+ge1PS6K-S(e}Ff=^)e0ceH9{8BgYi6OT-BXFf)RX1^EU!GCm
z%JP+Ne32Jtl=vc0^xk)p$=pzUq0Eh)0C~y;J6Y%Kzicr)Lgh2)L>7Vj7{E2+e`CcR
z5?R-<@-m){RiWq_Ad>74!2rku?_@P=Du7{Wip#XW&qQ==+7P}Qw4VtUVVlmXd1*Qx
zuOT<pZ^MGEQ#DadsjJ<5H5E5P)t%iV88L7JcB~7o1e~uX|LW?YZmtJj&n>Dyx_&Hc
zHn@g0bp?*U3DtH+1MPk@M!Kbr=JrgBY8$(&yK{gj6vBkAIY%Q4l~ny;V&?@t6slyQ
sD}a4yFrw6z*><4JT6zgUAK=sc0PjT+V!Vv+n*aa+07*qoM6N<$g8o*$?*IS*

diff --git a/doc/extend.md b/doc/extend.md
index 572f166547..87ba790fae 100644
--- a/doc/extend.md
+++ b/doc/extend.md
@@ -516,6 +516,34 @@ Home Screen icon. This works since iOS 6.
 For further information please read the [official documentation](http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html)
 on Apple's site.
 
+### Apple Touch Icons
+
+Touch Icons can be seen as the favicons of mobile devices and tablets.
+
+If your site or icons are in a sub-directory, you will need to reference the
+icons using `link` elements placed in the HTML `head` of your document.
+
+```html
+<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
+```
+
+The main sizes of the icons on iOS are:
+
+* iPad, high-resolution display, iOS 7: 152x152
+* iPad, high-resolution display, iOS ≤ 6: 144x144
+* iPhone, high-resolution display, iOS 7: 120x120
+* iPhone, high-resolution display, iOS ≤ 6: 114x114
+* iPad, non-Retina, iOS ≤ 6: 72x72
+
+For non-Retina iPhone, iPod Touch, and Android 2.1+ devices you can use the
+example from above or replace the `apple-touch-icon-precomposed.png` within this
+project's root folder.
+
+Please refer to Mathias' [article on Touch
+Icons](http://mathiasbynens.be/notes/touch-icons) for a comprehensive overview.
+
+### Apple Touch Startup Image
+
 Apart from that it is possible to add start-up screens for web apps on iOS. This
 basically works by defining `apple-touch-startup-image` with an according link
 to the image. Since iOS devices have different screen resolutions it is
diff --git a/doc/html.md b/doc/html.md
index 1ac39b4eed..b7fbbd6031 100644
--- a/doc/html.md
+++ b/doc/html.md
@@ -91,19 +91,14 @@ a simple setup that strikes a good balance for general use cases.
 <meta name="viewport" content="width=device-width, initial-scale=1">
 ```
 
-## Favicons and Touch Icons
+## Favicons and Touch Icon
 
 The shortcut icons should be put in the root directory of your site. HTML5
-Boilerplate comes with a default set of icons (include favicon and Apple Touch
-Icons) that you can use as a baseline to create your own.
-
-If your site or icons are in a sub-directory, you will need to reference the
-icons using `link` elements placed in the HTML `head` of your document.
-
-For a comprehensive overview, please read [Everything you always wanted to know
-about touch icons](http://mathiasbynens.be/notes/touch-icons) by Mathias
-Bynens.
+Boilerplate comes with a default set of icons (include favicon and one Apple
+Touch Icon) that you can use as a baseline to create your own.
 
+Please refer to the more detailed description in the [Extend section](extend.md)
+of these docs.
 
 ## Modernizr
 
diff --git a/doc/usage.md b/doc/usage.md
index 29ea6ce77f..df54996b0f 100644
--- a/doc/usage.md
+++ b/doc/usage.md
@@ -34,12 +34,12 @@ A basic HTML5 Boilerplate site initially looks something like this:
 │       └── modernizr.min.js
 ├── .htaccess
 ├── 404.html
+├── apple-touch-icon-precomposed.png
 ├── index.html
 ├── humans.txt
 ├── robots.txt
 ├── crossdomain.xml
-├── favicon.ico
-└── [apple-touch-icons]
+└── favicon.ico
 ```
 
 What follows is a general overview of each major part and how to use them.
@@ -101,9 +101,13 @@ Edit this file to include any pages you need hidden from search engines.
 A template for working with cross-domain requests. [About
 crossdomain.xml](crossdomain.md).
 
-### icons
+### Icons
 
-Replace the default `favicon.ico` and apple touch icons with your own. You
-might want to check out Hans Christian's handy [HTML5 Boilerplate Favicon and
-Apple Touch Icon
+Replace the default `favicon.ico` and Apple Touch Icon with your own.
+
+If you want to use different Apple Touch Icons for different resolutions please
+refer to the [according documentation](extend.md#apple-touch-icons).
+
+You might want to check out Hans' handy [HTML5 Boilerplate Favicon and Apple
+Touch Icon
 PSD-Template](http://drublic.de/blog/html5-boilerplate-favicons-psd-template/).