【ファビコン設置でアクセスアップ・特集①】…ツイッターアイコンをアメブロのファビコンにする方法☆
みなさん、こんにちは♪シマザキです。
本日から数回にわたって「ファビコン設置でアクセスアップ」
という特集を行います。
あなたのアメブロに、オリジナルのファビコンを設置する方法を
色々ご紹介していこうと思います。
ファビコンて、何?
ファビコンとは何かというと、
FireFoxやIE(インターネット・エクスプローラ)などの
ブラウザで、このように表示されるアイコン画像のことです。
↓私はツイッターなので、青い鳥
アメブロですと、デフォルト(初期設定)だと、
どのブログも、この緑アメーバ画像です。
みんな同じは、つまらないから、
もっと個性を出したいですよね。
オリジナルの画像だと目立って、
・印象に残りやすくなる(覚えてもらえる)
・お気に入りに入れても出てくるので、
アクセスされやすくなる
という利点があります。
ファビコンのサイズは基本、16ピクセル×16ピクセルです。
ファビコン画像の作り方は、何通りかありますので、
本日から順にご紹介していきますが、
本日は、超簡単な方法として、
「ツイッターのアイコンをそのまま、
あなたのアメブロのファビコンにする方法」
を、ご紹介します。
↓こちらのサイトにアクセス
FavIcon from Pics
http://www.html-kit.com/favicon/
作成編
twitter.com/の後ろのボックスに、
あなたのツイッターアカウントを入力して、
「Generate FavIcon.ico」のボタンをクリック
Download FavIcon Packageの文字をクリックして
ダウンロードするだけ!
ファビコンの画像の拡張子は.gifや.jpgとかではダメで、
.ico にするよう、決められています。
かといって、.gifや.jpgとかの普通の画像ファイルの拡張子を
そのまま拡張子の部分だけ変更したりすると、
FireFoxだと表示されますが、IEだと表示されないなどの
不具合が起こります。(実験済み(^_^;))
なので、このようなサイトで、きちんと.icoという拡張子の
アイコンを作る必要があります。
zipファイルを開くと、こんな感じです。↓
ちなみに、アニメーション版のアイコンもダウンロードされますが、
ブラウザによっては表示されないので、静止画の方、
つまりfavicon.icoの方を使うのをおススメします。
設置編
あなたのサーバーに、favicon.icoをアップロードする
FC2の無料サーバーを使う場合は以下のページを参照して下さい。
【RTボタン関連Q&Aコーナー】プラグインが文字数超過です!FC2無料サーバーの借り方を教えて!
http://ameblo.jp/infostock/entry-10616976801.html
下記のタグを、あなたのアメブロのフリープラグインに貼り付ける。
<link rel="shortcut icon" href="ファイルサーバーのパス/favicon.ico">
【例】私の場合は以下の通り↓
<link rel="shortcut icon" href="http://free-sozai.jp/twitter/favicon.ico">
必ずhttp://…からfavicon.icoまで、フルパスで指定してくださいね。
これで出来上がりです♪
IE(インターネットエクスプローラ)でファビコンが表示されない場合は、
通常、キャッシュのクリアを行うと表示されます。
本日も最後までお読みいただきまして、ありがとうございました。
シマザキ
本日から数回にわたって「ファビコン設置でアクセスアップ」
という特集を行います。
あなたのアメブロに、オリジナルのファビコンを設置する方法を
色々ご紹介していこうと思います。
ファビコンて、何?
ファビコンとは何かというと、
FireFoxやIE(インターネット・エクスプローラ)などの
ブラウザで、このように表示されるアイコン画像のことです。
↓私はツイッターなので、青い鳥
アメブロですと、デフォルト(初期設定)だと、
どのブログも、この緑アメーバ画像です。
みんな同じは、つまらないから、
もっと個性を出したいですよね。
オリジナルの画像だと目立って、
・印象に残りやすくなる(覚えてもらえる)
・お気に入りに入れても出てくるので、
アクセスされやすくなる
という利点があります。
ファビコンのサイズは基本、16ピクセル×16ピクセルです。
ファビコン画像の作り方は、何通りかありますので、
本日から順にご紹介していきますが、
本日は、超簡単な方法として、
「ツイッターのアイコンをそのまま、
あなたのアメブロのファビコンにする方法」
を、ご紹介します。
↓こちらのサイトにアクセス
FavIcon from Pics
http://www.html-kit.com/favicon/
作成編
twitter.com/の後ろのボックスに、
あなたのツイッターアカウントを入力して、
「Generate FavIcon.ico」のボタンをクリック
Download FavIcon Packageの文字をクリックして
ダウンロードするだけ!
ファビコンの画像の拡張子は.gifや.jpgとかではダメで、
.ico にするよう、決められています。
かといって、.gifや.jpgとかの普通の画像ファイルの拡張子を
そのまま拡張子の部分だけ変更したりすると、
FireFoxだと表示されますが、IEだと表示されないなどの
不具合が起こります。(実験済み(^_^;))
なので、このようなサイトで、きちんと.icoという拡張子の
アイコンを作る必要があります。
zipファイルを開くと、こんな感じです。↓
ちなみに、アニメーション版のアイコンもダウンロードされますが、
ブラウザによっては表示されないので、静止画の方、
つまりfavicon.icoの方を使うのをおススメします。
設置編
あなたのサーバーに、favicon.icoをアップロードする
FC2の無料サーバーを使う場合は以下のページを参照して下さい。
【RTボタン関連Q&Aコーナー】プラグインが文字数超過です!FC2無料サーバーの借り方を教えて!
http://ameblo.jp/infostock/entry-10616976801.html
下記のタグを、あなたのアメブロのフリープラグインに貼り付ける。
<link rel="shortcut icon" href="ファイルサーバーのパス/favicon.ico">
【例】私の場合は以下の通り↓
<link rel="shortcut icon" href="http://free-sozai.jp/twitter/favicon.ico">
必ずhttp://…からfavicon.icoまで、フルパスで指定してくださいね。
これで出来上がりです♪
IE(インターネットエクスプローラ)でファビコンが表示されない場合は、
通常、キャッシュのクリアを行うと表示されます。
本日も最後までお読みいただきまして、ありがとうございました。
シマザキ
↑ここをクリック!↑
アメブロ専用RTボタンは、
こちらのサイトから簡単に
ご利用いただけます。
皆さん、どんどんご利用下さいませm(_ _)m