アイコンファイル(.ico)の作り方

突然ですが、みなさん、アイコンファイルってご存じでしょうか？

Twitterとかのアイコンじゃないですよ、「.ico」の形式の画像です

この「.ico」ファイル、良く使う割に作り方が少しややこしいので、今回はこの「.ico」ファイルの作り方をご紹介します。

icoファイルとは？

「.ico」ファイルと言うのはMicrosoftがWindows向けに策定した画像フォーマットで、文字通りアイコンでの利用を目的としており、複数の画像サイズを格納出来るのが特徴です。

マイナーな画像ファイルに見えて、実は身近な所に存在しています。

例えば、Webサイトにアクセスした際にブラウザのタブの部分に表示されている物は殆どがicoです。(pngとかでも行けるのですが、マルチサイズの関係でicoが多い)

nmap.orgに世界中のWebサイトのアイコンから影響力の強い物を集めたりしているページがありますよ、興味があればどうぞ。

他には、Windows用ソフトウェアで表示されている物なんかは全てicoです。

余談:圧縮出来るんだぜ、これ

少しニッチなお話ですが、稀にWebサーバの設定で「画像だから」と「.ico」を圧縮して転送「しない」設定にしている方が居ます。

icoは非圧縮のデータ形式なので、画像ではありますがbmpと同じく圧縮「出来ます」、場合によっては9割くらい圧縮できるので圧縮転送を行いましょう。

実際に作る

早速作って行きますが、そもそもの話、pngとicoでは物が全く違うので、拡張子を変えたって無意味です。

拡張子を変えて上手く行ったのであれば、それは上手く行ったのではなくソフトが優秀なため「これはpngだ」と判別出来ているだけです。

(むしろ、拡張子書き換えでまともに動くのなんて「.jar」を「.zip」に変更した時だけでは?)

準備する物

• @icon変換(フリーウェアです)
• アイコンにしたい画像(png形式,16x16の倍数を推奨,透過可)

今回は単一の大きさの画像を含むシングルサイズと、複数の大きさの画像を含むマルチサイズの作り方を紹介しましょう。

とりあえず、@icon変換をダウンロードして起動出来る様にしておいて下さい、zipで圧縮されているだけなのでインストールなどは不要です。

アイコンにする画像は今回、サンプルとして以下のx16,x32,x64の3サイズを用意しました。

シングルサイズのアイコンを作る

では、標準的な32x32pxの画像で説明します。

＠icon変換を起動してください

アイコンにしたい画像をドラッグ＆ドロップで読み込んでくだい

後は至って普通にアイコンを選択して保存するだけ!!

残念ながらico形式はここには載せられないのですが、これでアイコンファイルが出来上がります。

先程説明した通り、非圧縮なので劣化などはありません。

マルチサイズのアイコンを作る

至って簡単です、アイコンに含めたい画像を全てドラッグ＆ドロップで読み込んで下さい

後は、含めたい画像を全て選択して、「マルチアイコンに保存」をクリック

残念ながら(2回目)、やはりここには載せられないのですが、この場合、1つのファイルに複数の大きさを持つ画像が含まれており、各ソフトウェアが必要に応じて最適なサイズを利用してくれます。

工夫すれば、状況に応じて見た目が変わるアイコン、なんてのも出来ますよ。(最も、分かりづらくなるのでお勧めはしませんが)

当然ですが、複数含めればしっかりサイズは大きくなる事は忘れない方が良いでしょう。

これでアイコンファイルの作成は完了です、ね?簡単でしょ?

 - Web制作 Windows