iPhone Home Screen Icon

A cool little tip I came across for the iPhone earlier today was how to get your own personal icon on the home screen on the iPhone. What I mean is if you have a website, that you want your users to view on an iPhone, you can create a customised icon for them to use everytime they want to access your site. It looks like an application button on the homescreen as well.

So for example, if you visit my site on your iPhone Safari browser, you will see a rendered mobile site, using the MobilePress WordPress plugin. Now if you really like my site (*hint* *hint*), you can add an icon to your home screen on your iPhone, by clicking the plus button at the bottom of the screen, and then selecting “Add to Home Screen”.

This will then add an icon to your home screen and  allow you a one touch “click” to my site.

Now if you have a site that you would like this nifty little feature, you need to follow the 3 very simple steps below:

• Create a PNG file, which is 57×57 pixels big. This can be any image you want.  Don’t worry about the rounded edges and glossy icon. The iPhone takes care of this for you.
• Save the file as “apple-touch-icon.png”
• Upload the PNG file to the ROOT directory of your website, and then visit your site on your iPhone to test it out.

A very simple little trick if you want to ensure your visitors come back to your site over and over :)