faviconの作成方法
「favicon（ファビコン）は、ウェブサイトのシンボルマーク・イメージとして、ウェブサイト運営者がウェブサイトやウェブページに配置するアイコンの俗称である」
（Wikipediaより）
現在鋭意作成中のウェブサイト用につくってみました。
そもそも、なぜfaviconが必要なのか？
- 目立つため
- スマートフォンではほとんど検索をせず、アプリやお気に入りからウェブサイトに移動するため、そのシンボルとして必要
- ファビコンを設定していない場合、同じサーバー内で他のファビコンを探してくるので、今やファビコン設定は必須
ファイル形式について
サイズについて
スマートフォンとタブレットの普及化により、２０種類以上あると言われる。
今回つくるのは３種類
16×16px（PC用）
32×32px
144×144px（スマートフォン用）
つくり方
①まず144×144pxのサイズで、イラストレーターやPhotoshopを使って作成
②他のサイズはジェネレーターで作成します
ジェネレーターは有料無料、色々ありますが、
上の３つのサイズを１つのICOファイルに収めてくれるジェネレーターを使います。
③「BROWSE」をクリックして、ジェネレーターにかけるファイルを選択する
OKを押すと、ほんの数秒で出来上がります
④BROWSEボタンの下に表示されたものをクリックして、ファイルを保存。
この時にはランダムに名前がついているので、「favicon.ico」とファイル名を変更
⑤これで２種類のfaviconができました。
faviconの置き場所は、imgフォルダ内ではなく、トップページのindex.htmlと同じ階層にします。
⑥HTMLへの記述方法 ※IE10以下にも対応できる方法
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>〜〜〜</title>
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.ico"/><link rel="apple-touch-icon" href="touch-icon-png"/>
</head>
⑦ブラウザでページを開いて、ブラウザのタブに表示されているか確認しよう。
