No.381


【HTML】faviconファイルの作成

ICOファイルを簡単に作成したい!

 ホームページの重要な構成要素のfaviconファイル。意外と作成するのが面倒くさい。なにせ万能兵器Photoshopでもプラグインを入れないと書き出せないのだ。

 ファイルのフォーマットは簡単なので、画像の種類を絞ってツールを自作してしまう方が早いかもしれないと思う今日この頃だけど、ひとまずは変換サイト公開してくれているの好意に甘えてしまおう。

Wikipedia ICO (ファイルフォーマット)


手順

 変換サイトのConvertioを使わせてもらう。

  1. 48×48のpngもしくはpsdファイルを作成する。
    背景を透明にしておくと、きちんと透過してくれる。
  2. PNGからICOもしくはPSDからICOにてICOファイルに変換する。

 Convertioは様々な画像を変換できる。普段使っているものを利用すればよい。

 上記はWEBブラウザ用のfaviconを作成する手順。解像度の高い用途に用いる場合はファイルサイズを適宜変更すること。

Windows Dev Center Icons Size requirements