Favicon & iOS/Android/MS Image tags (via threespot/shortline)

favicon.html

<!-- Remember this needs to be an icon bundle with 16px and 32px in it -->
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">

<!-- iOS/Android -->
<meta name="apple-mobile-web-app-title" content="FIXME">
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="/apple-touch-icon-152x152-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144x144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="/apple-touch-icon-120x120-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-114x114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="/apple-touch-icon-76x76-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-72x72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-precomposed.png">

<!-- Windows 8 metro/pinning -->
<meta name="application-name" content="FIXME">
<meta name="msapplication-tooltip" content="FIXME SHORT DESCRIPTION OF SITE">
<meta name="msapplication-TileColor" content="#b5106e">
<!-- "msapplication-TileImage" is only used in Windows 8.0 and should be a 144×144 transparent PNG -->
<meta name="msapplication-TileImage" content="/msapplication-tile.png">
<!-- Despite the names, image sizes are actually 128×128, 270×270, 558×270, and 558×558 -->
<meta name="msapplication-square70x70logo" content="/msapplication-tiny.png">
<meta name="msapplication-square150x150logo" content="/msapplication-square.png">
<meta name="msapplication-wide310x150logo" content="/msapplication-wide.png">
<meta name="msapplication-square310x310logo" content="/msapplication-large.png">

Courtesy of Mr. Jon Neal: http://www.jonathantneal.com/blog/understand-the-favicon/

Important: Make sure you name the .ico file exactly favicon.ico, otherwise IE will not pick it up.