HTML
🌐 faviconが表示されない
faviconのパスまたは形式が間違っている
😰 こんな症状
ブラウザのタブにアイコンが表示されない。faviconを設置したのに反映されないときに起きるよ。
🔍 原因
<link rel="icon">タグのhrefパスが間違っている、ファイル形式がブラウザに対応していない、またはキャッシュが残っていて古い状態が表示されているよ。faviconはブラウザが強くキャッシュするため、変更が反映されにくいんだ。
❌ エラーが起きるコード
<head><title>サイト</title></head>
<!-- favicon link なし -->✅ 直し方
1. <head>内に<link rel="icon" href="/favicon.ico">を追加する。 2. ファイルがルートディレクトリ（/）に置かれているか確認する。 3. PNG形式ならtype="image/png"を追加する。 4. キャッシュが原因の場合はブラウザのキャッシュをクリアするか、href="favicon.ico?v=2"のようにクエリパラメータを付けて強制更新する。
✅ 修正後のコード
<head><link rel="icon" href="/favicon.ico"><title>サイト</title></head>この解決法は役立ちましたか？
🔗 関連するエラー
- 外部CSSが読み込まれない — link要素のrel="stylesheet"の書き忘れ
- 画像が表示されない — 画像パスが間違っている
- 拡張子が表示されない（.html が見えない） — OS の設定で拡張子が非表示
- iframeが表示されない — 埋め込み先がiframeを拒否している
- videoタグで動画が再生されない — ファイルパスまたはフォーマットの問題
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- HTMLとは？初心者向けにわかりやすく解説 — タグの書き方・ページ構造の基本
- HTMLのパス（相対パス・絶対パス）の書き方 — パスの書き方を初心者向けに解説