無料でファビコンを作成してくれるサイト

公開日： 2014/02/25 : 最終更新日：2014/02/26 WEB favicon

ファビコンとは…

ネットをしていたらタブの頭にマークがついてるよね。

このサイトだとていうマークが出てると思うけどそれがファビコンと呼ばれるものです。
私もあんまり知らなかったんだけど、このファビコンっていうのが結構優秀で
普段はブラウザでしかお世話になってなかったけどIEでデスクトップにショートカットを作った場合もこのファビコンが表示されるそうです。

今はTVやゲーム機でもネットができる時代！
色んなデバイスに最適な大きさのロゴが表示されるのがいいですよね。

複数のアイコンを１つのアイコンにできる.ico

複数のアイコンが１つに？？？？
どういうことなの…私も最初言っているイミがわかりませんでした。
ファビコンに使われている拡張子".ico"このコが優秀なのです！

例えばブラウザのタブやブックマークの頭に表示されているアイコンのサイズは16x16。
そしてデスクトップに表示されるショートカットアイコンのサイズは32x32。
これを１つのアイコンでまかなってしまえるのが".ico"です。

１つのサイズの画像でもいいんだけど、例えば16x16しか作ってなかった場合デスクトップでは32x32に拡大されて表示されてしまうのです。
じゃあ32x32で作っておけばいいじゃんって話にもなりますが…(´∀`;)
まあ適材適所な画像があった方が綺麗に表示されていいんじゃね？って事です。

ファビコンってどうやって作るのよ？

ファビコンが優秀なコなのはわかった！でも作り方わからんのだが。
そんな時にお役立ちなサイトがこちらです。
無料で半透明マルチアイコンやファビコン(favicon.ico)が作れます。ギザギザの無い美しい影を持ったアイコンが作成できます。

さすがに画像は自分で用意しないといけませんが、ファイルを選択するだけでfavicon.icoファイルを自動生成してくれます。
この時に画像ファイルを透過済のPNGを指定するとファビコンの背景が透明になるのです♪
しかもフチがギザギザじゃないのがいいね。gifだと透過処理してもフチがギザギザで凹んだものだよ…。

難しい事はわからん。簡単にぱぱっと作りたい

そういうあなたにはこちら。
ファビコン favicon.ico ファブアイコン作成。無料でブックマークアイコン、透過マルチアイコンが作れます。作り方は簡単！画像を指定するだけ。

jpgもgifもpngも指定できます。
１つの画像ファイルでもいいので楽でしょう。

ファビコンの設定のしかた

作ったはいいが表示のさせ方がわからん！というあなた！
なんだか今は（昔からかも…）ディレクトリにfavicon.icoをアップすると自動でファビコンとして表示されるみたいですよ！？
でもブログやサイトでテンプレートを使っている場合、そのテンプレートでファビコンの設定がされている場合があるので、そういう時はテンプレートで指定してあるファビコンを自作の物と差し替えればOKです。
ディレクトリトップにアップしても表示されねーよ！というあなたはファビコン作成サイトの説明にもあるこちらを試してみてください。

ファビコンをルートに設置できない場合、また、ディレクトリごとで違うfaviconを表示させたい場合は<head>セクション内に以下の記述をすることで指定できます。(URLは適宜変更して下さい)

<link rel="shortcut icon" href="http://www.sample.jp/favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="http://www.sample.jp/favicon.ico" type="image/vnd.microsoft.icon">

ファビコン表示されないんだけど！？

ファビコンを設定してもキャッシュが残っていてすぐに表示されない場合があります。
すぐ見たい！今見たい！はよ！！というあなたは、キャッシュの削除をしてみてください。
それでも見れない時は普段使ってないブラウザで確認してみるといいかも。
私が初めてファビコン設定した時はキャッシュの削除でも表示されなかったので普段はFirefox使ってるけどIEを立ち上げて見てみたら無事ファビコンが表示されているのが確認できて感動した覚えがあります(*´Д｀*)

ファビコンを設定するだけで、自分のサイトにますます愛着が湧いてきますね♪
ブックマークでファビコンが表示されるとそれだけで目立つし覚えてもらいやすくなるのでチャレンジしてみてください。