Photoshopでfavicon.ico(ファビコン)を作る方法
Webサイトを作る時にfaviconを設定しておくことで、ブラウザのタブや、ブックマークされた時にアイコンを表示させることができます。
このfaviconは.icoというファイル形式で作成する必要があります。しかし、この.iconファイルはphotoshopでは作ることができません。
なぜならデフォルトでは、photoshopの保存できるファイル形式に.icoが用意されていないからです。
しかし、プラグインを入れることでphotoshopでもfavicon.icoを作ることができるようになります。
プラグインをダウンロード
まず、↓のサイトのICO (Windows Icon) Formatから使っているPhotoshopのバージョンに合わせてプラグインをダウンロードします。
僕は以前にブログに書いたようにadobe cloudを使っているのCS6です。
ここではMac CS5と記載されている所のプラグインをダウンロードします。
ダウンロードデータを解凍すると下記のようになっています。
この内、ICOFormat.pluginを↓のようにAdobe Photoshop CS6/Plug-ins/〜の形になるようにコピーします。
コピーしたらPhotoshopを再起動してください。インストールは以上です。
favicon.icoを作ってみる
.icoファイルの作りかたは簡単です。
faviconのサイズである16px×16pxで画像を作ったら、「ファイル」→「別名で保存」を選択すると↓のようにICO (Windows icon)が増えています。この形式で保存するだけです。
「Web用に保存」ではないので間違えないでください。
以上です!
favicon.icoを作るジェネレーターは沢山ありますけど、僕は使いなれたphotoshopで完結したいのです。
