近頃は、スマホに特化したしたサイトも多くみられるようになりましたが、スマホ用のサイトを作ったらスマホ用のアイコンを設置しておくのが望ましいです。
スマホが無い時代は、サイトに用意するアイコンというと、favicon.icoでしたが、今ではそれぞれの端末用に以下のようなアイコンが必要になります。
- favicon.ico
- (32ピクセル x 32ピクセル)
IEやChrome等のデスクトップブラウザで、タイトルやタブの横に表示される小さなアイコンです。特にWeb開発者にはお馴染みのアイコンだと思います。 - apple-touch-icon.png
- (57ピクセル × 57ピクセル)
iOSで使われるデフォルトのアイコンです。Webページをホームスクリーンに置いた時に使用されるデフォルトの(他のアイコンが置いてなければこれが使われる)アイコンです。iOSによって自動的に角が丸められ、影と光沢の効果が付加されます。 - apple-touch-icon-precomposed.png
- (57ピクセル × 57ピクセル)
これもiOS（とv2.1以上のAndroid端末）で使われるアイコンですが、iOSによる影や光沢の効果をつけたくない時はこちらを使用します。precomposed とは事前に作成されたという意味です。Android2.1以上の端末でもこのアイコンは認識されます。 - apple-touch-icon-57x57-precomposed.png
- (57ピクセル × 57ピクセル)
非RetinaディスプレイのiPhone（ちょっと昔の解像度が低い端末）で使用されるアイコンです。apple-touch-icon.png名前が違うだけで大きさは同じです。 - apple-touch-icon-72x72-precomposed.png
- (72ピクセル × 72ピクセル)
非RetinaディスプレイのiPad(初代iPadやiPad miniなど)で使用されるアイコンです。 - apple-touch-icon-114x114-precomposed.png
- (114ピクセル × 114ピクセル)
RetinaディスプレイのiPhone(iPhone4以降)で使用されるアイコンです。 - apple-touch-icon-144x144-precomposed.png
- (144ピクセル × 144ピクセル)
RetinaディスプレイのiPad（第３世代iPad以降)で使用されるアイコンです。
結構種類がありますね。全て最適化して作るのが面倒なら、一番大きなサイズのアイコンを作成して、それぞれのサイズに縮小してやれば手っとり早いと思います。