Custom WebClip Bookmark Icons for iPhone
Following the iPhone update I tried the new WebClip feature for the homepage and was pleasantly surprised at how Google’s icon didn’t look like a screen capture–but instead was a nicely-cropped logo (surprisingly, Apple.com doesn’t have its own WebClip icon as of this writing).
I’m not all about proprietary standards, but, naturally, I had to figure out how to do it for my own sites.
Basically, you create a 57×57 PNG file and host it on the top level of your domain. In the <head> of your HTML page(s), add a link (similar to a custom favicon):
<link rel=”apple-touch-icon” href=”/customicon.png”/>
You can get the full details at Apple’s developer site.