Not long ago, I started seeing repetitive 404 errors in my server logs
for two files /apple-touch-icon-precomposed.png and
/apple-touch-icon.png. Most of the errors were coming from my main
index page but I had 404 errors scattered across all my pages on
PCHell.com concerning the two files. Now I would not have been
concerned if I never look at 404 not found errors, but I do. What
exactly was causing the error and how could I fix it. I figured it had
something to do with either an Apple device or Safari, Apple's browser.
After some research, here is what I found.
Apple devices, tablets, android devices, and other mobile hardware look
for these particular files when a person bookmarks a site on the
device. In some cases, just the task of viewing the site in a mobile
browser like Google Chrome will cause the 404 error if the files are
not there. This is similar to the
favicon.ico
file that you want to put on your site when someone bookmarks
it or adds it to their favorites list.
Solution
1) Create two png files. One named apple-touch-icon-precomposed.png and
the other named apple-touch-icon.png. The size of the png files should
be about 100 X 100 pixels square.
2) Save these two files in the root directory of your website alongside
favicon.ico.
When a visitor using a mobile device tries to bookmark your site, they
will find the two files and no 404 error will be generated.
You can read through an extensive tutorial on these touch icons by
visiting
Mathias
Bynens website.
He talks about the exact sizes of the png files and what devices call
the files.
Bottom line, the files are similar to favicon.ico for visitors to your
site.