あなたは自分のブログが好きですか？もちろん好きだと思いますが、もし更新疲れなどで少し気持ちがうすれてきたと感じたら、モノは試しでファビコンをつけてみてはどうでしょうか？本日は、「自分のブログが愛しく思える？favicon.icoの作り方」についてです。
猫ITソリューションズをこの度リニューアルいたしました。
今後も御愛顧の程宜しくお願い致します。
さて、今回のリニューアル作業の一つとしてfavicon.ico（以下ファビコン）をつけてみました。
Favicon - Wikipedia
ファビコンはSEO/SEM的な効果は期待できませんが、「目立つ」という役割で十分意味があると私は思っています。何よりも冒頭でも書きましたが、自分のブログが愛しく思え「愛着」が沸く事でしょう。
これは実際に作って自分でブラウザに表示される様子を見てみないと気持ちは分らないと思いますが、意外なくらい楽に作れますので是非ともチャレンジしてみてください。
それでは以下よりファビコン作成方法について説明していきます。
1、2枚の異なるサイズの画像を用意する。
16x1632x32
形式はpng,BMPあたりが良いでしょう。
2、ファビコンを作ってくれるWebサービスへ2枚の画像をアップロード
このサイトが一番シンプルで分かりやすいです。専用アプリケーションをインストールする手間も省けます。
http://ao-system.net/multiicon/
3､ブログやwebサイトのドキュメントルートへアップロード
猫ITソリューションズでしたら、https://www.neko-it.com/favicon.ico
となります。
4、webブラウザに認識されるように設定する。
2通りの方法が考えられますが、case 1 をやっておけば確実と思われます。case:1 HTMLで指定する。
以下を追記します。
※favicon.icoへのパスは各自置き換えが必要。
|
1 2 |
<link href="http://example.com/favicon.ico" rel="icon" type="image/x-icon" /> <link href="http://example.com/favicon.ico" rel="Shortcut Icon" type="image/x-icon" /> |
case 2: サーバーの設定を確認・変更する。
※CentOSの場合
/etc/mime.types に以下の記述があるか確認する。なければ追記する。
|
1 |
image/x-icon ico |
環境により4は必要ない場合もあります。お使いのブログポータルサイトの仕様をご確認ください。
これで作業完了です。
ファビコンのデザインは是非とも既存データの流用ではなく、自分のオリジナルで頑張ってみてください。きっと愛着が湧きますよ。
あなたのオリジナルファビコン、そして愛着が湧くことによるあなたの素晴らしいアウトプットに期待しています！
