Ben Rabicoff

Stop Specifying iOS Webpage Icons

I “view source” a lot. It’s a force of habit. I love seeing how websites are constructed. But I have to admit, one of my biggest pet peeves is seeing iOS Webpage Icons specified at EVERY resolution in the head of a document.

Just seeing multiple lines of the same icon at different resolutions feels, well, wrong. So you can imagine what goes through my head when I see:

<link rel="apple-touch-icon" sizes="57x57" href="apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon-180x180.png">

There is no reason to do this. In doing so, you’re just adding extraneous code and bytes. Apple states directly in their developer documentation:

If no icons are specified using a link element, the website root directory is searched for icons with the apple-touch-icon… prefix. For example, if the appropriate icon size for the device is 58 x 58, the system searches for filenames in the following order:

  1. apple-touch-icon-80×80.png
  2. apple-touch-icon.png

To verify Apple practices what they preach, I dug around with view source on Apple.com. Looking at the headof the document, Apple doesn't use any link element to specify an iOS webpage icon.

From what I could see, it looks as if Apple just uses the fallback of apple-touch-icon.png in the root of the site at a size of 152×152.

So please, don’t specify iOS icons in the document head. Instead, place them all in the root of your website and let iOS/Safari do the work.