iPhone-Touch Webclip Icons
Posted on Thursday, January 17th, 2008 at 9:32 am under Web.Tags: iphone
With the latest software update for the iPhone and iPod touch, users can now save webclips to their springboard(desktop). These act as a shortcut to a website. Now, the iphone/touch will remember exactly the crop and zoom that you saved and will create an icon automatically but the icon is not always the most desired visual representation of the site. For example, if I want a webclip of CNN’s latest news, it will show a screenshot of the news, not a CNN icon. And if I zoom into the icon just for the logo and then save the webclip, when i click on the webclip it will take me to the zoom in of the icon and not the news. Fortunately, the iPhone/Touch can use a predetermined icon provided by the website. Here’s how to create a custom webclip icon for the the iPhone/iPod Touch.
Save your 57×57px icon as a PNG, name it “apple-touch-icon.png” and upload to the root folder of your site files(where you index file is). The iPhone/Touch will automatically look for it here. It will also automatically round the edges and make give it that gloss look so you don’t need to worry about that.
If you want to name it differently, or place the file somewhere else, you need to specify it in the html file as a header item like this:
<head>
<link rel="apple-touch-icon" href="/pathto/mywebclipicon.jpg"/>
</head>
ps. thanks to abraham for letting me borrow his camera at work
p.s. Drew McLellan at All In The Head has posted a bookmarklet that dynamically adds the icon code to any page. This makes it possible for you to design your own icons for any website. Very clever Mr. Drew. Via Rob.
Jan 17th, 2008 at 9:46 am
Wow, what a nice quality picture, what camera did you use? I want it.
Thanks for the info about the webclip icon.
Jan 17th, 2008 at 12:31 pm
Check out my website (above) to see how to set your own icons using a nifty bookmarklet written by Drew McLellan and modded by myself. You have to upload your icons to the web though :)
p.s. Your photo trumps mine! Loverly!
Jan 31st, 2008 at 3:25 pm
Good to know, thanks!
Apr 26th, 2008 at 2:12 am
Thanks for the info and link I’ve been getting super pee’d off with the ugly shortcut icons on my touch desktop thingy! Love your site too by the way!