ステートメント 1: <link rel="shortcut icon" href="favicon.ico" /> ステートメント 2 <link rel="icon" href="animated_favicon.gif" type="image/gif" /> 注: ステートメント 1 のショートカット アイコンは、URL バーの前に表示されるアイコンです。 質問: ステートメント 2 のアイコンの機能は何ですか? ステートメント 1 との違いは何ですか? これまで、Web サイトのデザイナーや開発者は、ファビコンが表示されるようにさまざまな方法を採用してきました。同じバージョンのブラウザを使用している場合でも、すべてのコンピューターでファビコンが表示されることを確実に保証することは困難です。 次のコードのもう 1 つの制限は、ファビコンを特定の HTML または XHTML ドキュメントに関連付けることです。これを回避するには、favicon.ico ファイルをルート ディレクトリに配置する必要があります。ほとんどのブラウザはそれを自動的に検出して使用します。 次の 2 行の HTML コードを含めることをお勧めします。 コード: <link rel="ショートカットアイコン" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon"> <link rel="icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon"> ただし、"shortcut icon" 文字列は、ほとんどの標準準拠ブラウザによって、可能なキーワードのリストとして解釈されます ("shortcut" は無視され、"icon" のみが使用されます)。一方、Internet Explorer では、単一の名前 ("shortcut icon") として扱われるため、最初の行のみが必要です。これにより、コードがすべてのブラウザで理解可能になります。 2 行目の追加は、新しいブラウザに代替のフォールバック画像 (アニメーション GIF など) を提供する場合にのみ必要です。 HTML では、リンク要素はヘッド要素内 (<head> と </head> の間) に配置する必要があります。 XHTML の場合、リンクは「 />」(または「></link>」)で終わる必要があり、「>」で終わることはできません。 href は /favicon.ico の場所を指すことができますが、必ずしもそうである必要はありません。任意の URL を指すことができます。 通常、画像にはブラウザでサポートされている任意の画像形式を使用できます。 通常、.ico ファイル形式は、ファビコンを表示できるすべてのブラウザで読み取ることができます。 正しい MIME 識別子を送信するようにサーバーを構成します。 ICO ファイル image/vnd.microsoft.icon (互換性のため image/x-icon も使用できます。ただし、ほとんどの主要ブラウザが現在サポートしているため、IANA 登録済みの MIME タイプを使用することをお勧めします) GIF ファイルimage/gif PNG ファイルimage/png 適切な解像度と色深度を使用してください。 ICO: さまざまな解像度 (最も一般的なのは 16×16 と 32×32 ですが、Mac OS X では 64×64 と 128×128 が使用されることもあります) とビット深度 (ピクセルあたりのビット数) (主に 4、8、24 bpp、つまり 1600 万色、256 万色、1600 万色) が含まれます。 GIF: 16×16、256色を使用します。 PNG: 16×16、256 色または 24 ビットを使用します。 注意: favicon.ico がドキュメント ルートに配置されている場合、サイト上にそのページを指すリンクがない場合でも、リンク要素を処理しない一部のブラウザーによって検出されます。 標準化 ファビコン機能は Microsoft によって最初に作成され、Microsoft の Internet Explorer Web ブラウザはすべての Web サイトにファビコンを要求します。 Microsoftがサポートするリンクタグは、以下の理由により、World Wide Web Consortium (W3C)のHTML勧告[1]に準拠していません。 rel 属性には、スペースで区切られたリンク タイプのリストが含まれている必要があるため、2 語のリンク タイプは標準に準拠したブラウザーでは認識されません。 「.ico」ファイル タイプ (Microsoft Windows のアイコンに使用されるラスター形式) には登録された MIME タイプがなく、現時点ではほとんどのブラウザーで認識されないようです。しかし、2003 年に、この形式は MIME タイプ image/vnd.microsoft.icon で IANA に登録され、問題の最初の部分は解消されました。 ウェブサイト上の予約済み場所を使用することは、World Wide Web のアーキテクチャと一致しておらず、リンク スクワッティングまたは URI スクワッティングと見なされます。 Mozilla ブラウザは、Web 標準に準拠したアプローチを使用してファビコンのサポートを追加しました。 rel="icon" を使用すると、Web デザイナーはサポートされている任意の画像形式でファビコンを追加できます。たとえば、<link rel="icon" type="image/png" href="/path/image.png"> です。その後、ほとんどのブラウザは、すべての新しいコンテンツにこの機能が使用されることを考慮して、この機能のサポートを追加しました。 |
<<: Jenkins + Docker + ASP.NET Core の自動デプロイメントの問題について (落とし穴を避ける)
>>: デザインのヒント: きっと気に入っていただけると思います
企業の Web サイト、個人のブログ、ショッピング Web サイト、ゲーム Web サイトなど、どの...
スロークエリログ関連のパラメータMySQL スロー クエリ関連のパラメータの説明: slow_que...
目次MVCCとはMVCC 実装MVCC はファントム リードを解決しますか? MVCCとはMVCC ...
1. レスポンシブ デザインとは何ですか?レスポンシブデザインとは、ウェブサイトの開発プロセス中に、...
序文MySQL マスター スレーブ レプリケーションの基本原理は、スレーブ データベースがマスター ...
目次1. 原則の概要クエリキャッシュシステム変数1. クエリキャッシュを持つ2. クエリキャッシュ制...
このチュートリアルでは、ウェブデザインにおけるFORMフォームタグのさまざまな属性の応用を紹介します...
目次1. フックとは何ですか? 2. フックはなぜ現れるのでしょうか? 3. よく使われるフックは何...
序文Reduce は ES5 で追加された新しい従来の配列メソッドの 1 つです。forEach、f...
この記事では、アンカー配置を実現するためのVue +要素UIの具体的なコードを例として紹介します。具...
序文RabbitMQ を使用する場合、一定期間クライアントと RabbitMQ サーバーの間でトラフ...
序文簡単に言えば、tcpdump は、ネットワーク上のトラフィックをダンプし、ユーザーの定義に従って...
序文アプリケーションを Docker コンテナとしてサーバーにデプロイする場合、通常はネットワークと...
ステップ1: システムのアーキテクチャを確認する dpkg --print-architecture...
一時テーブルの概要一時テーブルとは: MySQL は中間結果セットを保存するために使用されます。一時...