How To Create A Website Icon For The iPhone / iPod Touch

February 17th, 2008

This tip came from early-early Apple adopter JC who sent me a link to this article about how to add a custom icon to your website that appears when an iPhone / iPod Touch user saves your website.

It’s really simple - all you need is a graphic editor that can output PNG files, which is pretty much all of them out there.

  1. Create your icon and make it 158 x 158 square.
  2. Output it to PNG and name it apple-touch-icon.png
  3. Upload it to the root directory of your web server.

That’s pretty much it. The cool part is the iPhone / iPod Touch will automatically do the rounded corner and slight glossy look for you.

Disclosure: I own a tiny amount of Apple stock.

2 comments!

  1. comment Gravatar Louis Gray - February 17th, 2008

    Thank you sir, I made mine following along to your post.

    http://www.louisgray.com/live/apple-touch-icon.png

  2. comment Gravatar webomatica - February 17th, 2008

    Glad to pass the word on. Your new blog design looks good!

Please comment!