The other day, I noticed that the button image for a bookmarked site on my iPhone home screen (our corporate GMail) looked really nice, and was different than before:

I got to wondering how it came to be.

Scanning the View Source of the GMail page, I didn’t see any tags that were relevant, so I thought it might be handled by iPhone OS, similar to the favicon.ico .

So I pointed my iPhone browser at a web site, added the site to the home screen, and then checked out the web logs to see what was going on.

Sure enough, there were requests for /apple-touch-icon-precomposed.png and then /apple-touch-icon.png. It seems that the precomposed does not apply any processing on the iphone itself (it is used raw), while the second one applies a glass effect. Presumably, the latter one is only requested if the first one 404s.

A nice finishing touch if you have a mobile version of your site. Or perhaps regardless. Add this to the list of “standard web site items” like favicon.ico, robots.txt, 404, 500, sitemap.xml, etc.