favicon.ico(ファビコン)の作り方
February 11, 2008 2:14 PM written by Gen Taguchi
ちょっと個人的なまとめ。いまさらですが。favicon.icoの作り方&設置方法です。

↑ ブラウザのアドレスバーとかブックマークに出てくるこのアイコンがfavicon.icoね。
■ オンラインで作る(エディター付き)
いくつかありますね。ちょいちょいと作りたいときに便利。エディター付きのものをご紹介。
- favicon.ico Generator
- Favicon Japan!! -ファビコン作成方法-
- Favicon Editor

2.0っぽい作りが良いかも。慣れている人だと便利かな。画像をアップしてそれを編集することもできます。
こちらは日本語で安心。
こちらもよろしければ。画像をアップする機能もついていますね。
■ オンラインで作る(エディターなし)
こちらはただ画像をアップするだけですね。ピクセル単位の編集とかはできません。
- favikon
- Favicon Japan!! -ファビコン作成方法-
- FavIcon from Pics -- how to create a favicon.ico for your website
- Dynamic Drive- FavIcon Generator
- Favicon Generator | Make Free Favicons | Create a Favicon.ico Design

個人的には最強。シンプルで使いやすいっす。画像をアップしたあとに微調整できます。

こちらはアップしたらそのまま変換してくれます。微調整とかはなしですね。
こちらも定番。たまに落ちてますが。
これも上とほぼ同じ。
こっちも同じ。
■ ソフトウェアを使って作る
Faviconは普通の画像をicon形式に変換するだけでOKです。画像はPhotoshopなり、Paintなりで作ってください。GIFアニメもOKですよ。
そうして作った画像を次のソフトウェアで変換すると良いでしょう。
■ faviconの設置方法
設置方法はHTMLのHead部分に次の一行を加えるだけ。もちろんfavicon.icoをアップロードしておくことも忘れずに。
<link rel="shortcut icon" href="/favicon.ico" >
以上ですかね。他にもあれば教えてください。Faviconついているとかっこいいですよね。よろしければ使ってみてください。
■ 関連記事
- これが決定版じゃね?とってもお手軽なFavicon作成ツール『Favikon』 | 100SHIKI.COM
- 百式ブログシリーズにFAVICONがついた、の巻 | IDEA*IDEA
- Faviconをつくるときに参考にしたいデザイン&ツールいろいろ | POP*POP
- 百式ブログシリーズにFAVICONがついた、の巻 | IDEA*IDEA
- ブラウザ上で簡単にFaviconが作れる『favicon.cc』 | POP*POP
Info: Lifehacks |
固定リンク |
コメント (2) |
トラックバック (3) |
↑


