Left Brain
The Apple Touch Icon
Published on: October 21, 2009, 1:23 pm
A favicon is a web icon that shows up in the address bar, and is used mainly for branding your website and making it easier to find when someone bookmarks your page.
In the world of iPhone and iTouch screens, you can also add a similar icon to your website. Apple called them Web Clips and they work the same way as the favicon did. You just have to make an image (non-animated) at 57x57 and save it on your website.
Then, in your header tags underneath your favicon tag, add:
link href="http://assets1.twitter.com/images/twitter_57.png" rel="apple-touch-icon"
And that's basically it. Most of the major sites have adopted this. For instance, Twitter has one.
Comments
How does this translate to other devices?
I'm just wondering if the icons are part of other mobile phones. I've used this on a few sites but didn't see it come up when navigating them through my phone. What am I missing?
Not sure if the Apple Touch icons serve <strong>that </strong>much of a purpose, but it's a good add-on.
