After much Googling and research, what follows is code that adds favicons to your site in all browsers that are young enough to not be allowed into bars.
<meta name="apple-mobile-web-app-title" content="Icon Title"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="icon" href="/favicon.png"> <!--[if IE]><link rel="shortcut icon" href="/favicon.ico"><![endif]--> <meta name="msapplication-TileColor" content="#1E355E"> <meta name="msapplication-TileImage" content="/tile-icon.png">
You will need:
- favicon.ico (16px, no padding, transparent background)
- favicon.png (32px, no padding, transparent background)
- apple-touch-icon.png (153px, padding & background)
- tile-icon.png (558px, padding but no background)
Put these files in the root of your site, set the `content` of `apple-mobile-web-app-title` to whatever you’d like the icon text to be when saved to iOS homescreens and you’re good to go!