16

ここ数年、ファビコン ビジネスは複雑になりました。タブレットやスマート スマートフォンなど、新しい種類のデバイスが (再) 発明されました。彼らはファビコンを新しい方法で使用し (ホーム画面のアプリケーション アイコンなど)、それらをリンクするベンダー固有の方法を必要とします。同様に、ブラウザーは Web アプリのデスクトップ ショートカットを作成できるようになりました (アイコンのファビコンも使用します)。さらに悪いことに、ポータブル デバイスとラップトップの両方で高解像度 (「レティーナ」) ディスプレイが使用されているため、アイコンにはより高解像度の画像が必要です。さらに悪いことに、ブラウザ (およびバージョン) が異なれば、サポートされるアイコンの画像形式やサイズも異なります。16x16 のみの .ico のみの IE6 から始まり、.svg アイコンをサポートするようになった Opera で終わります。

今日のほとんどのデバイスやブラウザで鮮明なアイコンをサポートするにはどうすればよいですか?

これまでのところ、私が見つけた最良のリソースはhtml5boilerplateで、次のファイルを推奨しています。

apple-touch-icon-114x114-precomposed.png
apple-touch-icon-144x144-precomposed.png
apple-touch-icon-57x57-precomposed.png
apple-touch-icon-72x72-precomposed.png
apple-touch-icon-precomposed.png
apple-touch-icon.png
favicon.ico  # 32x32

<head>タグにそれらへのリンクを入れないでください。

編集:別の考慮事項は、.ico ファイルが異なる解像度の複数の画像を保存できることです。これは有用ですか、サポートされていますか?

4

1 に答える 1

13

http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.htmlに公式のアドバイスがあり、リストを確認しているようです。

理想的には、favicon.ico ファイルには 1 つのファイルに複数の解像度を含める必要があります。これは、最新のブラウザーがこれを利用できるようになり、16 x 16 のアイコンが Retina 画面で見栄えがよくないためです。

Microsoft は現在、favicon.ico ファイルに少なくとも 16×16、24×24、32×32、および 64×64 を含めることを推奨しているようです。

このようなファビコンを作成する無料のオンライン ツールを立ち上げました: http://iconifier.net

最新の favicon 情報へのリンクについては、Web サイトの readme ページを参照してください。

于 2013-01-16T11:58:28.177 に答える