オリジナルファビコンを作ろう！
ファビコンってそもそもなに？
ファビコンとは、「お気に入りアイコン」のことで ブラウザのアドレスバーやお気に入りのリストに表示される、小さなアイコンのことです。
独自のファビコンを設定しておくことで、そのページをブックマークした際に、
オリジナルの「お気に入りアイコン」が表示されるようになります。
ファビコンを設置できるとサイトのオリジナリティが高まります。
作成するのも難しくないので早速設置してみましょう！
※ブラウザにより表示される条件は異なります。
（IE6では表示されない場合があります）
ファビコン作成手順
１）ファビコン作成に必要なもの
ソフトは必要に応じてインストールしてください
- ＦＴＰ関連ソフト（またはレンタルサーバーのファイルマネージャ）
- 今回は「FFFTP」を使用します
- 画像編集ソフト
- 今回は「Inkscape」を使用します
- 解凍・圧縮ソフト
- 今回は「Lhaplus」を使用します
- 「favicon.ico」作成サイト
- 今回は「FavIcon from Pics 」を使用します
２）ファビコン画像を作成する
※画像が作れればどのようなソフトを使ってもかまいません
2-1 「Inkscape」を起動します
2-2 「ファイル」→「新規」→「icon 64×64」を選択します
※「icon 64×64」で作ることできめ細かな画像が作れます
※最終的に「16×16」になることを考慮して画像は作成してください
2-3 「ファビコン用画像」を作成します
2-4 画像が完成したら「名前を付けて保存」します
2-5 「save in folder（保存先）」を指定したら、「save」をクリックします
2-6 「ファイル」→「ビットマップにエクスポート」をクリックします
2-7 新しいウィンドウが開いたら「参照」をクリックします
2-8 「name」に保存したい名前を付けます。今回は「icon」と付けました
2-9 「save in folder（保存先）」を指定したら、「save」をクリックします
2-10 「エクスポート」をクリックをします
2-11 デスクトップに「icon.png」が作成されました
３）ファビコン画像を「favicon.ico」に変換する
3-1 「FavIcon from Pics 」にアクセスします
3-2 「参照」をクリックして先ほど作った画像を選択します
3-3 「Generate FavIcon.ico」をクリックします
3-4 「Generate FavIcon.ico」をクリックすると画像が切り替わり「Downlord Favicon」と「Test in Browser」が新たにでてきます
3-5 「Test in Browser」をクリックすると表示例がでてきます
3-6 表示例に問題がなかったら「Downlord Favicon」をクリックします
3-7 「favicon.ico」をダウンロードします
3-8 今回はデスクトップに保存しました
3-9 「favicon.zip」を「解凍」します
3-10 「favicon.zip」の中身は↓のようになっています
４）「favicon.ico」をアップロードする
4-1 「FFFTP」を起動します
4-2 「ＰＣ側ウィンドウ」を先ほど「解凍」した「faviconフォルダ」に合わせます
4-3 「faviconフォルダ内」の「favicon.ico」を選択し、アップロードします
※アップロードする場所はルートディレクトリにアップして下さい。具体的には「attach」「backup」「cache」「counter」「diff」これらのフォルダ、ファイルと同じ場所になります
4-4 アップロードが完了すると、「サーバー側」に移動します
4-5 faviconをアップロードしても反映されるまでには時間がかかる場合があります。
すぐに表示されなくても時間を空けて確認してください。
4-6 これで以上になります。お疲れ様でした
