|
|
How To Make iPhone Webclip Icons
|
 |
|
2008-01-19 20:19:17
Years ago the cool, new thing to do to really put your own stamp on your website was to create a custom 16x16 pixel favicon for the browser address bar. Now this is standard practice, but thanks to the iPhone and iPod touch and Apple's recent 1.1.3 software update, there's a whole new cool thing to do to your site: create iPhone / iPod touch webclip icons.
Thanks to the latest firmware, a link icon to any site of your choosing can be placed on the home screen of your iPhone or iPod touch. Without doing anything special, the icon that is generated is a thumbnail of the website's layout. It's possible, however, to create a custom icon that will appear when any iPhone or iPod touch user creates such a link.
The process:- Create a 60x60 pixel, 72dpi PNG image for your icon file (57x57 is the actual icon size, but we're hearing 60x60 works best)
- Name it "apple-touch-icon.png"
- Throw it in the root folder of your website. (Not the root of your server, the root of your web documents.)
If you need, for some reason, to specify a different location from webroot or a different filename, you can do so by specifying the image location with an entry in your page's HEAD section:<link rel="apple-touch-icon" href="/whatever.jpg"/> The iPhone / iPod touch takes care of the rounding of the edges and the rounded, gloss compositing that makes it appear to be a button with depth.
We gave it a shake here at iPod Hacks and much prefer our site logo, which will now appear if you link us from your home screen, to the default front page thumbnail that appeared by default.
[ via The Primary Vivid Weblog ]
<< Previous story: Changing System Time Extends 24hr iTunes Rental Window
>> Next story: Google: Gmail Issues With iPod Software v1.1.3
| |
more
iPhone Web Apps
stories...
|
