An icon that iPhone users can easily create
iPhone users have the option of adding an icon to their home screen that will take them directly to the URL of a site they are interested in. To do so, they simply tap the "Add to Home Screen" button.
By default, however, the icon will show a thumbnail preview of the page — essentially a screenshot. For a better aesthetic, it is possible to modify this icon. Users will then see your logo, or any image you wish to display, rather than a miniature preview of your page.
Customise your icon
To do this, the first step is obvious: you need to create the icon. The image must measure 150 px × 150 px to be the correct size.
Then save it in .png format, under the name "apple-touch-icon.png".
Then upload it to your FTP web server, in the correct target directory. And that is all there is to it.
Apple automatically generates icons with rounded edges and a glossy effect. To achieve this look, you can use the following code:
This way, you can easily avoid an unappealing visual on users' iPhone home screens.