I’ve been using H5BP for what seems like Eons and find it really useful however I’ve never really understood what all of the icons are for.
I know they are for various devices but I’ve never really bothered you think more about it… I’ve just sheepishly replaced the icons with my own set for the site I’m working on.
I’ve just been googling and can’t find any good explanation for each of them and in what context they are used?
I have an iPhone & iPad but to be honest I’m kind pretty un-impressed by both and therefore I’m probably not well versed enough to know exactly where the H5BP icons would be used for on these devices…
On the iPod/iPhone/iPad you can decide to place a website on your home screen (think of it as a bookmark). The bookmark will then have the same look as the icon of an ordinary iOS app (a large icon and a small text beneath it). The H5BP icon is used as the app icon, if someone decide to save your website like that.
The reason there are three different resolutions is simply because different apple-devices need different resolutions on their icons. The new iPad (retina) needs to have a high-res icon, and so forth.