
ネット上に掲載されているファビコン設定の説明に従っているつもりなのですが、
どうしてもファビコンが表示されません。
HPの構成は以下で、「index.html」に「menu.htm」と「top.html」を呼び出している
フレーム形式のトップページです。
/home
├index.html
├top.html
├menu.html
└imageフォルダ
└favicon.ico
「index.html」だけでなく、念のため「menu.htm」と「top.html」にも<HEAD>内に
下記タグを入れていますが、ファビコンが表示されません…。
<link rel="shortcut icon" href="image/favicon.ico">
以下のことは試してみました。
・ファビコンはico生成ソフトで作っています
・インターネットオプションで、一時ファイル履歴を削除
・ブラウザを再起動
・ブックマークを削除し、お気に入りに追加を改めてしてみる
これだけしても、やはりファビコンが表示されないのです。
一体何が悪いのでしょうか…?? 詳しい方、是非お助け下さい!
No.2ベストアンサー
- 回答日時:
一つ一つ問題を切り分けてみてはどうでしょう?
1. ブラウザがfaviconを表示できる?
念のため、ローカルテストで。
---
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …
<html lang='ja' xml:lang='ja' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='content-type' content='text/html; charset=utf-8' />
<meta http-equiv='content-style-type' content='text/css' />
<meta http-equiv='content-script-type' content='text/javascript' />
<title>TEST</title>
<link href="http://okwave.jp/favicon.ico?20081110" rel="shortcut icon"/>
</head>
<body>
</body>
</html>
---
2. icoを相対パスにして表示できる?
http://okwave.jp/favicon.ico?20081110 を /home にダウンロードして、
<link href="favicon.ico" rel="shortcut icon" /> でローカルテスト。
3. favicon.ico のパスは正しい?
/image にOKWaveからDLした favicon を置いて、
<link href="image/favicon.ico" rel="shortcut icon" /> でローカルテスト。
4. 自作の favicon.ico は問題ない?
favicon.ico を自作のアイコンに取り替えて、ローカルテスト。
5. サーバの設定に問題はない?
index.html と favicon.ico をサーバにUPしてテスト。
私の環境では、4. まではパスしました。(サーバテストはやっていません)
HTMLは上で示したように可能な限り、簡易的なものにしてみてください。
少しずつ今のHTMLにしていけば「どこで躓くか」わかりますから、そこで問題を切り分ければいいと思います。
詳しい導きをありがとうございました!
「1.」で既にダメでした。これは一体どういう問題なのでしょうか?
ブラウザの問題?になるのですか? ファビコンと言うものが見られない訳ではなく、
私のお気に入りには様々なサイトのファビコンがちゃんと見られます。
ブラウザのアドレスバーにもちゃんとファビコンが出ます…。
もし宜しければ更なる導きをお願いいたします。自力で解決できません…。
No.5
- 回答日時:
#4の方の回答を見て気が付いたことを。
> http://shimax.cocolog-nifty.com/search/2007/07/f …
ブラウザ依存だとは気が付きませんでした。
これでテストして気が付いたのですが、ローカルテストは
file:// … IE7でNG、FxでOK
http://127.0.0.1/ … IE7,FxでOK
なんですね。
htmlファイルをダブルクリックしていたら、IE7では表示されないようです。
ですので、お使いのPCでApacheなどのサーバプログラムを立ち上げていないようでしたら、ローカルテストは止めてサーバにUPしてテストしてみてください。
それにしても、テストが面倒な仕様ですねぇ…。
この回答への補足
「この回答へのお礼」の続きです。履歴を削除してみると、「OK」ファビコンは消えましたが、私が用意したファビコンは表示されませんでした。どうやらファビコンに問題があるようです。作り直して再アップしてみます。
補足日時:2009/06/13 21:56!!! 進展がありました!! 教えていただいたTEST.htmlをサーバに置いてアクセスしたところ、OKファビコンが表示されるのを確認できました。「2.」に進み <link href="favicon.ico" rel="shortcut icon"/> と変更して、自分で用意したファビコンが表示されるかテストしたら、そのままOKファビコンが表示されています。これもまた履歴を削除しないとダメなのでしょうかね? 今からブラウザを閉じて再チャレンジしてみます。
No.4
- 回答日時:
ありがとうございます! 読んでいてまさに私の環境なのではないかと、ようやく解決か!と、喜び勇んですべての履歴を消し、一時ファイルも消し、ブラウザを再起動するだけでは飽き足らず、PCまで再起動して、サーバ上でテストしてみました! しかし! やはり表示されませんでした…!!(血涙) 念のため、家族のPCで確認してみましたが、やはりファビコンは表示されておりませんでした。かれこれ4日間ほど格闘しているのですが、一体何が原因なのでしょうか…泣きそうです…。
No.3
- 回答日時:
#2です。
補足を読みました。> 「1.」で既にダメでした。これは一体どういう問題なのでしょうか?
すみません。HTMLに半角スペースが混在していたようです。
<link href="http://okwave.jp/favicon.ico?20081110" rel="shortcut icon"/>
この部分で http:// の前にスペースが入っているので、取り除いてみてください。
私の環境では、これでファビコンが表示されました。
この回答への補足
ご報告を書ける欄がなくなってしまったので、こんなところから失礼します。
ついに!! 解決しました!!! ありがとうございます! think49さんの
導きがあったお陰です。
一応、解決までの経緯をご報告いたしますと、現在のfavicon.icoを、これを作った
ソフトとは別のソフトで開こうとしたところ、「ファイル形式にエラーがあります」
と出て、これが原因かと思い、新しいソフトでfavicon.icoを作り直しましたが、
まだ上手く行かず。その後さらに調べて、FTPで「バイナリモードで転送」を選んで
アップしたところ、ようやく表示されました!!
favicon.icoがマズかったのと、バイナリモードで上げていなかったことの両方が
原因だったようです。
長かった……しかし皆様のお陰でで解決いたしました。本当にありがとうございました!!!
何回も本当にありがとうございます(感涙)
確かにご指摘のhttpの前に半角スペースが入っていたので、削除の上
テストしてみましたが、やはりファビコンは出現しませんでした。
ソースの他の箇所にもhttpの前に半角スペースが入っていたので、
それも削除しましたが、やはり出現せず…。
ちなみに http://okwave.jp/favicon.ico?20081110 のリンクを
押せば「OK」ファビコンは確認できたので、URLが間違っている訳
ではなさそうです。一体何が悪いのでしょうか…。
No.1
- 回答日時:
ローカルではどうでしょうか?
imageディレクトリでは無くhomeに直接置いた場合はどうですか?
<link rel="shortcut icon" type="image/x-icon" href="image/favicon.ico">
と記述した場合は如何でしょうか?
homeに直接favicon.icoを置いて、下記のようにしてもダメでした。
<link rel="shortcut icon" href="favicon.ico">
教えていただいた下記タグでもダメでした…。
<link rel="shortcut icon" type="image/x-icon" href="image/favicon.ico">
念のため、上記タグをindex.htmlだけに入れたり、他menu.htmlに入れたりもしたのですが、やはりダメでした…。
一体何がいけないのでしょうか?? ちなみにブラウザはIE ver7です。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- PHP imageフォルダに、画像をリサイズして保存する時のファイル名を変更したい 1 2023/05/30 11:39
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLファイルのインクルードで...
-
▲▲METAタグについて▲▲
-
css ,videotタグ。ホームページ...
-
日本語が下記のように文字化け...
-
このタグのどこに<center>を入...
-
WEBページがIEだけ文字化けして...
-
body内にmetaタグを記述は問題...
-
borderでa:hover下線表示させる...
-
短縮URL作成
-
CGIでのtxtファイルの表示
-
iframeで、右側に余分な空白が...
-
横スクロールについて教えてく...
-
またまたメールのリンクタグ
-
html で 変数を定義できますか?
-
表示すると文字化けします
-
<html>タグ
-
HTMLソースにない文字がブラウ...
-
HPをgooの検索エンジンに...
-
メタタグに順番はありますか?
-
Duolingo のソースコードの名前...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
css ,videotタグ。ホームページ...
-
body内にmetaタグを記述は問題...
-
HTMLファイルのインクルードで...
-
POSTしたデータの文字コードがu...
-
iframe内の表示を常に最新にしたい
-
自分で<head>内をかけない場合...
-
HTMLソースにない文字がブラウ...
-
objectタグを使って背景を透明...
-
WEBページがIEだけ文字化けして...
-
borderでa:hover下線表示させる...
-
HTMLのネスト
-
FFFTPでの文字化け
-
refreshタグ 自動的にジャンプ...
-
スライドショ-のタグを教えて...
-
表示時に1回だけリロードさせ...
-
TEXTAREAのスクロールバーを消...
-
メタタグ編集して文字化けしま...
-
先日ウェブデザイン技能検定三...
-
Content-Typeの大文字
-
緊急!!広告バナーとキャッシ...
おすすめ情報