どうもこんにちは。あっきぃです。
最近また身長が伸びた気がします。小三から成長期が続いてます。
毎分0.000001cmくらい伸びてます。すごいです。誰かほめてください。
（ってことは...って計算したそこの君は理系だ！）
さてファビコンを設定したいと思います。
ブラウザのタブのタイトルの横とかに出てくる小さな画像です。
1.ファビコンの画像を用意
今はブラウザが進化しているので「.ico」なんて形式の画像は用意しないで、PNGで行きましょう。
（※IEはIE11からPNGをサポート。でもIEは滅びればいいので無視しましょう。）
サイズも勝手にリサイズしてくれるはずなので
256px*256pxくらいの大きめのを用意しました。
設定する前はこんな感じ。
なんだか味気ないですね。
2.ファビコンの記述
百聞は一見にしかず。ってな感じで、次の記述をhead内に書きます。
<link rel="shortcut icon" href="http://appstars.jp/img/icon.png">
相対パスでも大丈夫そうですが、
絶対パス（http://〜）の方がミスが少なそうです。
えいやっ
どうでしょう。
味が出ましたね。（何味だろう...）
3.Web Appのアイコンも設定
iPhoneなどでホーム画面に
Webページを追加した時に表示されるアイコンを指定出来ます。
何も設定していないとこんな感じ。
ちょっとダサいですね。
そこでこんな記述をhead内に書きましょう。
<link rel="apple-touch-icon" href="http://appstars.jp/img/icon.png">
<meta name="apple-mobile-web-app-title" content="あぷすた">
<meta name="apple-mobile-web-app-title" content="あぷすた">
そいやっ
素敵ーっ
画像を256pxにしたのはこのためなのです。
（iPadAirで152px*152pxだからちょっと無駄にデカいかも。でもAppleが「大きいことはいいことだ」って言ってた。）
参考にしてくださいましー
