表示されないことについて調べると、いろんなところで出てくるのがキャッシュを消せと。
キャッシュを消しても、ちゃんと載っているかわからない時、調べるサイトがありました。
Favicon checker
Test the favicon of your site. Make sure it works on all platforms, including Google result pages. Our free favicon chec...
realfavicongenerator.net
これで確認すると、パスの誤りや、サーバーのアップロード先の誤りなどが見つかりました
確認したい事項
① 画像のサイズ
② ファイル名
③ ルートディレクトリにアップロードしているか
特に確認したいのがサイズ！
サイズとファイル名は指定されているので、間違えないようにします。
＋ルートディレクトリにアップ！
マルチアイコンの作成
1つの画像ファイルから複数形式のマルチアイコンを作成します。色数は「2色(1bit)/16色(4bit)/256色(8bit)/24bit/32bit」でアイコンサイズは「16x16/20x20/24x24/32x32/40x40/48x4...
www.petitmonte.com
最終的にできた方法
下記のサイトを使用しました。
Favicon Generator for perfect icons on all browsers
The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including i...
realfavicongenerator.net
これは、色々なサイズのファビコンができて、かつHTMLコードも作成してくれるものです。
画像をルートディレクトリにアップロードして、HTMLを追記するとできました。
まとめ
① ファビコンが表示されているかサイトでチェック
② パスが間違っていないかチェック
→ ルートディレクトリにアップロード
③ 画像のサイズをマルチサイズにする
→ このサイトで簡単にできます！
④ それでもできない場合は、マルチアイコンを作成できるサイトで画像を作成
Favicon Generator for perfect icons on all browsers
The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including i...
realfavicongenerator.net
参考にしたサイト
ありがとうございました！
favicon/ファビコンが表示されない原因と対策（検索結果・ブラウザ） - 裏方ワークス
【2024.12.26追加】実際にクライアントサイトの1つで、今まで表示されていたfaviconが非表示に変わっている状況が発覚し、再表示されるまでやったこととして記事にまとめておきました。あまり対した情報や対策として成り立つかは未知数です...
urakata.me
