Photoshopとか持っていないけど、Faviconを自作して設置しました

唐突ですがFavicon大好きです。便利だし、かわいいし。Faviconを作るのってちょっとひと手間かかるじゃないですか。だからFaviconを設置しているWebサイトやブログって結構思い入れがあるんだろうなと勝手に思ってしまったりします。

というわけで、PhotoshopもFireworksも持っていないけれど、Faviconを作って設置しました。使った画像作成ソフトはPictbear SE（フリーウェア）です。

やってみると思ったより簡単なものですね。16×16ピクセルの正方形の中でデザインをすればOK。作業のしやすさを考えると64×64ピクセルで作った方が良いと思いますが、圧縮をかける際に必ず汚くなってしまうので、そこはYour Choice。

こちらのPOP * POPの記事を見ると参考になるデザインとか、簡単Faviconジェネレーターとかが載っていますのでどうぞ。

Faviconをつくるときに参考にしたいデザイン＆ツールいろいろ | P O P * P O P

参考になりそうなきれいなデザインやツール類があったのでご紹介。これからFaviconつくるぞー、という人はよろしければどうぞ

ボクの場合は全部で２案作りました。一つ目は後ろをベタ塗りにしたもの。

ニバイハンの「×」を英数字の「*」にして、その下に2.5の数字を入れたものです。2.5の可読性はこちらの方が良いですね。ちなみにこのfaviconは上記記事中でも紹介されていたFavIcon from Picsを使って作りました。簡単お手軽に画像からFaviconが作成できますが、背景の透過はできません。

２案目は現在うちのブログで採用されているやつです。「*」って星っぽいなあとか、数字をもっと真ん中にとかやっていたら某ケータイキャリアのものに似てきてしまったので、途中からは狙って同じものにしようとしましたw

こちらは背景を透過させたかったので＠icon変換というフリーウェアを使っています。ただし、この＠icon変換はGIFが読めません。一度Windows付属のペイントに読み込んでBMPで保存、その後に＠icon変換に読み込んで透過処理を施すという過程を経て完成です。

やっぱり自分用のアイコンがあるって良いですね！

以下は参考にしたサイト。

▼Favicon全般について：Favicon Japan!! -16×16の小宇宙ファビコン-

▼Photoshopをお持ちなら：Photoshop で背景透過の美しい favicon (ファビコン) を作成する – 2xup.org

▼もっとアイコンが見たいなら：シナトラ千代子 – はてなプロフィールアイコン大図鑑