How to create a icon for any iOS device - Part 2

  • By Nilesh Parmar
  • 20/01/2012

At the beginning of the year we blogged about how to add your favourite websites to your Apple iOS devices as a shortcut on your home screen.

We have had a few questions asking how this was achieved, here's how in three easy steps.

Step 1

Create a.PNG image file in an image editing software of your company logo at 114 pixels by 114 pixels.

It does not matter if your logo is square, as the HTML code below will round off the corners like an app.

Step 2

Name your file: apple-touch-icon-precomposed.png and save it in to the root directory folder on your web server.

Step 3

And for the icing on the cake enter this simple HTML code below in the HEAD part of your websites HTML.

<link rel="apple-touch-icon" href="/apple-touch-icon-precomposed.png"/>

Let us know how you get on and any questions please post them on here.

You might also be interested in these…