ファビコンを作りました

ファビコンを作りました

faviconを作ったので、作り方をまとめました。

今回は、ブラウザで使用される16px × 16pxとデスクトップへのショートカット作成時などに使用される32px × 32pxのマルチアイコンを作ります。

マルチアイコンを作ります

ファビコンにする画像を作る

16px × 16pxと32px × 32pxの画像を作成します。

私はIllustratorで作りました。
拡張子は、後でico形式に変換するwebサービスを使うので、png形式で書き出しました。

透過してみました

マルチアイコンを作る

webサービスを利用して、先程作った画像をマルチアイコンにします。
http://ao-system.net/favicon/

2つの画像をマルチアイコンにします

ファビコンを設置する

<head>内で完成したファビコンを読み込みます。

<link rel="icon" href="favicon.ico" type="image/ico" />

Photoshopでico形式で書き出すには?

以下のサイトからプラグインをダウンロードできるみたいです。
Create a favicon for your web site with this free Photoshop plugin

下のボタンを押すと拍手送信&メッセージフォームが開きます。→WEB拍手お返事