今回はPhotoshopだけで誰でも簡単にできるサイトのアイコンやファビコンの作り方を解説します。Illustratorいらずです。
ブラウザのタブに表示されているアイコン(ファビコン)をサクッと作ってしまいましょう。
アイコンを作る
まずは元となるアイコンをPhotoshopで作ります。
画像の大きさは180x180pxがおすすめです。大きくする分には問題ないですが、小さくするとアイコン自体が小さく表示されてしまうのでカッコ悪くなってしまいます。
今回はこんな感じのアイコンを作ってみました。
作る時のポイントはできるだけシンプルに、かつ幅いっぱいに作ることです。幅いっぱいに作らないとただでさえ小さいアイコンがさらに小さくなってしまうので気をつけましょう。
画像ができたら保存します。保存形式はjpgやpngなどにしましょう。psdはダメです。
ico形式へ変換する
アイコンやファビコン画像の拡張子は.ico形式がベストです。
もちろんjpgやpngがダメなわけではないですが、アイコンやファビコンに一番適しているのはico形式です。
では作った画像をico形式に変換します。
以下のサイトで拡張子をアイコン向けに変更します。
「ファイルを選択」をクリックして先ほど作った画像を選択しましょう。
すると画像がico形式とpng形式に変換されます。
一番左上の128×128のico形式の画像で「Download」をクリックすると、黒背景で画像が表示されるはずです。
適当な場所で右クリックし、「別名で保存」を選択します。
意味不明なファイル名になっていると思いますが、名前を好きなように変更して保存すればオーケーです。
拡張子が.icoで保存されていればアイコン(ファビコン)の完成です。
まとめ
Illustratorを使わなくても、Photoshopだけでアイコンやファビコンはサクッと作れます。
jpg画像でもpng画像でもアイコン(ファビコン)に変換できるのでとても便利です。