画像からfaviconを作成する方法
更新日
faviconとは、ブラウザのタブに表示される小さなアイコンで、.icoファイルとして保存されます。作成するには、まず正方形の画像を用意して変換します。EditItAllのPNGからICOへの変換ツールを開き、ロゴをドロップして、.icoをダウンロードしてください。処理はブラウザ内で完結するため、画像がアップロードされることはありません。
今すぐ実行——無料、ブラウザで
Open the PNG → ICO converterfaviconとは、そして必要な形式
faviconとは、ブラウザのタブやブックマーク、履歴内でサイト名の横に表示される小さな画像です。伝統的な形式はICOで、多くのブラウザが特別な設定なしに認識できる小さなアイコンファイルです。
良いfaviconにはポイントが二つあります。ほぼ正方形であること、そして爪ほどのサイズに縮小されても判読できることです。そのため、faviconには詳細な写真ではなく、太字の一文字やロゴマーク、シンプルな形が使われるのが一般的です。
画像を.icoに変換する
すでに正方形のロゴがあるなら、変換はワンステップです。
- PNGからICOへの変換ツールを開き、画像をドロップします。
- 変換されたら、
.icoファイルをダウンロードします。 favicon.icoとしてサイトに追加するか、HTMLから参照してください。
別の形式から始めますか？写真やフラットなロゴにはJPGからICOへの変換ツールを、ベクター素材にはSVGからICOへの変換ツールを使ってください。ベクター素材が理想的なのは、アイコンに必要などんなサイズにも綺麗に描画できるからです。変換はすべてブラウザ内で行われるため、画像がアップロードされることはありません。
きれいな正方形の元画像を用意する
アイコンの仕上がりは、元にする画像の質で決まります。画像が正方形でない場合は、まず写真編集ツールで正方形に切り抜いておきましょう。そうすれば変換ツール側で推測する必要がなくなります。重要な部分を中央に配置し、それ以外を切り取ってください。faviconのサイズでは細かいディテールが潰れてしまうため、複雑なデザインは一つの力強い形や文字にシンプル化してください。
ロゴがベクター素材として存在する場合は、できるだけ長くSVGのまま保ち、ICOへの変換は最後にしましょう。ベクターは正確なピクセルサイズでレンダリングされるため、小さなビットマップを引き伸ばすよりも鮮明さを保てます。ベクターをきれいにラスタライズする関連情報については、品質を落とさずSVGをPNGに変換する方法を参照してください。
よくある質問
faviconのサイズはどれくらいにすべきですか？+
faviconは小さく正方形で、ブラウザがタブに表示するコンパクトなアイコンです。正方形の元画像から始めれば、変換ツールがサイトにそのまま使える.icoファイルを生成します。
写真からfaviconを作ることはできますか？+
はい、ただし写真はタブサイズではきれいに見えないことがほとんどです。正方形に切り抜き、被写体がはっきり分かる画像を選んでください。シンプルなロゴや文字のほうが、詳細な写真よりくっきり見えることがほとんどです。
.ico形式にする必要はありますか？+
ICOはfaviconとして最も広く認識されている形式で、追加設定なしで機能します。画像を.icoに変換しておくのが、幅広いブラウザに対応するための最も安全な選択です。
faviconを作るときに画像はアップロードされますか？+
いいえ。変換ツールはすべてブラウザ内で完結するため、ロゴや写真が端末の外に出ることはありません。ページを読み込んだ後はオフラインでも作業できます。
faviconがぼやけて見えるのはなぜですか？+
ぼやける原因は、たいてい元画像が小さすぎるか、細かすぎることです。縮小してアイコンサイズにしても十分な鮮明さを保てるよう、より大きく、正方形で、コントラストの高い画像、またはベクター素材から始めてください。