表示されないことについて調べると、いろんなところで出てくるのがキャッシュを消せと。
キャッシュを消しても、ちゃんと載っているかわからない時、調べるサイトがありました。
Favicon checker
Check the favicon of your site. Does it look good on Windows? iPhone/iPad? Find out!
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/ファビコンが表示されない原因と対策（検索結果・ブラウザ） - 裏方ワークス
最近ではfaviconの重要性が高まってきています。というのも、Googleの検索結果にfaviconが表示されるようになったというのが非常に大きい要因です。まだテスト段階などもあってか時折変わっていたりなどする事もあるのですが、Googl...
urakata.me
コメント