[favicon]1枚の画像から簡単にマルチサイズの透過ファビコンを生成する『X-Icon Editor』が絶対オススメ!

  • あとで読みたい人は…

こんばんは、@cappeeです。

favicon(ファビコン)ってちょい前までは16x16のico形式でつくっていたけど、新しいブラウザのバーションでまくってるし最近は何か新しくなってるかしら思ってfavicon事情を調べてみました。

faviconのフォーマット

png形式で指定しているサイトもたまに見るので調べて見たんですが、IEではpngで指定すると見れないそうです。なんとまぁ。

なので今まで通りico形式が良いかと思います。

faviconのサイズ

一般的にfaviconというとアドレスバーで表示される「16×16px」ですよね。

それ以外でも主にWindowsのショートカットアイコンでデスクトップ上に置かれた場合は「32×32px」になります。

また、faviconのpng非対応であるIE9の「ピン留めサイト」機能を使うと「24×24px」のアイコンが表示されます。お気に入りのサイトをアドレスバー付近に固定で表示してくれる機能みたいです。(詳しくはこちら

さらに、ショートカットアイコンで 48×48px、64×64px、128×128px、258×258px を使用するOSもでてきているのでキリがないですね。個人的には主要なサイズのみで問題ないと思います。

オススメの複数サイズfavicon生成ツール

そこでオススメしたいのがこちらのfavicon生成ツールです。

ico形式は1つのファイルでマルチサイズを表示してくれるのですが、1枚画像を指定すれば複数サイズ生成できるfaviconをさくっとつくってくれる「x-icon editor」です。

「16x16」、「24×24」、「32×32」、「64×64」の4サイズで書きだしてくれます。

X Icon Editor [favicon]1枚の画像から簡単にマルチサイズの透過ファビコンを生成する『X Icon Editor』が絶対オススメ!
x-icon editor

まずは一番大きいサイズ「64×64」のアイコン画像を用意します。透過pngで書き出せば、背景透過ももちろん可能です!

右上にある「1.Import」をクリックして画像を選択するともう完成です。ありがたいですね。

「4.Export」からダウンロードできます。

画像をドットで編集することもできるのでそれは「2.Edit」を、プレビューする場合は「3.Preview」で確認してください。

参考にさせていただいたこちらにもっと詳しく掲載されています。

複数サイズのサイトアイコン(ファビコン)を簡単作成

Pocket
article clipper [favicon]1枚の画像から簡単にマルチサイズの透過ファビコンを生成する『X Icon Editor』が絶対オススメ!

One thought on “[favicon]1枚の画像から簡単にマルチサイズの透過ファビコンを生成する『X-Icon Editor』が絶対オススメ!

  1. Pingback: 1つのPNG画像から、ファビコン(favicon)を簡単に作る方法 【マルチアイコン】 | 某氏の猫空

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)