alt属性ポップアップ表示に関するIEの仕様とその違い
- imgタグのalt属性はIEではポップアップ表示に反映されますが、同じalt属性でも表示されるサイトと表示されないサイトがあります。
- 両方のサイトのソースを比べると、DOCTYPE宣言やHTMLの言語設定は共通ですが、CSSの設定が関与している可能性があります。
- ポップアップがされない場合でも、通常はalt属性が表示されることがなく、SEO上も問題ありません。
- ベストアンサー
IEでのalt属性ポップアップ表示について
img属性でカーソルをのっけた時にポップアップで表示される文字がありますよね？ 普通はtitle属性の文字がそこに反映されるわけですが、IEの仕様ではalt属性でも表示されます。 ただ、同じalt属性だけでも IE上でポップアップ表示されるサイトとされないサイトがあります。 宣言の違いかと思い両方のソースを見ました。 共通で <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> になっています。 なぜか片方のサイトはalt属性だけで表示 片方はaltでは表示されない。 この違いは何なんでしょう CSSで設定でもしてるのでしょうか？ また、ポップアップされてなくても 通常は出ないのが普通、というかソースには書いてあるので SEO上は問題ないですよね？ よろしくお願いします。
- peco33
- お礼率79% (123/154)
- HTML
- 回答数5
- ありがとう数5
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
MSDN によると、alt属性値はtitle属性が存在しない場合にツールチップとして表示する仕様です。 http://msdn.microsoft.com/en-us/library/ms533073.aspx 実際は #4 で指摘されているように、DOCTYPEスイッチによってIEの動作が切り替わるようですが、MSDN では触れられていません。 http://jsbin.com/ixebof/2/edit#preview (IE8 quicks mode でツールチップ表示) http://jsbin.com/ixebof/4/edit#preview (IE8 standards mode でツールチップ非表示) event.returnValue によるデフォルトアクション抑止でもツールチップ表示を抑止することは出来ないようです。 http://jsbin.com/ixebof/5/edit#preview CSS,JavaScriptでツールチップ表示を実現している可能性は考えられますが、実際に見てみないことには確実な答えは出来ないと思います。 この状態で「どこに原因があるのでしょうか？」と質問されても「あれもこれもありますね」としか答えようがないわけで…。 SEOを気にされるのでしたら Lynx などのテキストブラウザを使用してサイトを確認してください。 SEOで IE の仕様を気にしなければならない事態はまずないと思います。 http://support.google.com/webmasters/bin/answer.py?hl=ja&answer=35769
その他の回答 (4)
- naokita
- ベストアンサー率57% (1008/1745)
同じIE環境で回覧しているのでしょうか？ IE8とかIE9での動作の話でしょうか？ 確か、IE7以下がポップアップしますが、 DTDの違いで表示が変わるはずです。 つまり、標準モードか過去互換モードかの判断です。 その違いが無ければ、 １、DTDの上、一行目のXML宣言や空行の有無 ２、IE8-9で互換モードで表示した場合 ３、その他、CSSツールチップやJSなどでの表示 この辺の違いがあるはずです。 （ソースが同じなのに動作が変わる事は物理的にありえません） HTMLでは、画像にはaltを設置する方が正しいですが、 altをポップアップさせないのがデフォルトなので、 旧IEが余計なポップアップをしているだけ。 SEO？ 検索エンジンはHTMLソースを読むので、altが書いてあれば認識します。
お礼
ありがとうございます。 同じ環境で閲覧してます。 SEO上は関係ないですよね。 ちなみに titleとaltとどちらがSEO効果があるのでしょうか？
- ORUKA1951
- ベストアンサー率45% (5062/11036)
すみません。一度に書きゃ良いものを・・ たぶん古いIEだと思いますが、本来画像が表示されていればaltの内容は表示しないのが仕様上は正しい動作です。(私のIE8は、画像が表示されていたらaltはtitleの有無に関わらず表示されません) altやtitleの使い分けは、 ★img要素でalt属性の内容がポップアップしない - Web標準普及プロジェクト ( http://www.mozilla.gr.jp/standards/webtips0024.html ) に詳しい説明があります。
お礼
ありがとうございます。 両方とも同じブラウザで見て確認しております。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
単純にtitle属性の有無です。 多くのブラウザでは、title属性があれば、それを優先しますから、空のtitle属性を記述すれば、altの内容は表示されないはずです。しかし、画像を読み込まない設定にしていてもaltは表示されますから、ユーザビリティ上で問題にならないでしょう。 色々と組み合わせて、ためすと良いでしょう。
お礼
ありがとうございます。 title属性の性質も知っています。 ソース上、両方ともtitle属性の記述はありません。
- tracer
- ベストアンサー率41% (255/621)
そのサイトを提示いただければ、わかりやすいのですが、禁止にひっかかってしまいますかね。 ドキュメントスイッチやバージョン、CSSやHTMLのトリックでもそういう差が出る可能性がありますが、JavaScriptで表現することもできます。JavaScriptを用いれば、HTMLソース上にはalt属性値があるのだけれど、HTML読み込み後にalt属性値を削除するということができます。
お礼
ありがとうございます。 CSSやjavaScriptで設定しているということですか？
関連するQ&A
- GoogleChromeでxml宣言が消える？
GoogleChromeでソース表示を行うと1行目に表示されるはずのxml宣言が表示されません。 例えばIE7で神奈川県のサイト（http://www.pref.kanagawa.jp/）をソース表示すると <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> となりますが、同じサイトをGoogleChromeでソース表示すると <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> と1行目にあるはずのxml宣言が消えて2行目の空行から始まっています。 だからなんだと言われると困るのですが・・・IE6対策でphpの条件分岐でIE6以外の場合のみ表示としているはずが、あれ？と言う状況です。 ソースや表示そのものがおかしくなるわけではないと思いますが、最初は条件分岐が間違っているのかと悩みました。 これはきちんと表示させる方法があるのか、もしくはそういう仕様なのか、実は他のソースもちゃっかり修正されちゃってたりしないのか、どんなもんでしょう。
- ベストアンサー
- HTML
- xmlnsに変換されてしまう。。。？
サイトの上部に <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> と書かれたサイトをFIreFoxで閲覧したときに、 『選択したソースを表示』でソースを見てみると、 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> と表示されています。 つまりこれはソースが前者であったとしても、ブラウザ表示時に後者に変換されてしまうということでしょうか？ というのも、前者後者のタグによって、 内部のCSSやレイヤーのデザインが崩れてしまうので。
- ベストアンサー
- HTML
- 作成したホームページがＩＥでは表示されない
xhtmlとcssでページを作成しました。 FireFoxではローカルでもネットにアップした状態でも見ることが出来るのですが、 ＩＥを使用すると、ローカルでは見れるのですが、ネットに上げたものは指定した背景の色しか表示されません。 何が原因なんでしょうか。 よろしくお願いします。 <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS" /> <title></title> <link rel="stylesheet" href="style.css" type="text/css"> </head>
- 締切済み
- HTML
- phpでreadfile(include)した結果に？が出力される
phpで以下のようなA,Bの2つのファイル構成にした際に ブラウザでAをアクセスし、ソースを表示するとreadfileした結果の前に「?」が出力されます。 「？」と出力されるのが何か問題だと思うのですが、分かりません。 ご指南をお願いいたします。 ?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> Aファイル <?php readfile('inc/xhtml.inc'); include('inc/dbcon.php'); include('inc/cm468_2.inc'); ?> ----------- Bファイル <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> -------------------------------- 出力結果 ?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
- ベストアンサー
- PHP
- XHTMLのIEでの表示
PHPを使ってXHTMLを出力しています。 下記のようなソースを使った場合、IE系ブラウザでXMLツリーが表示されてしまいます。IE8beta2、IE7、IE5で確認しています。 Google Chrome、Opera、FireFox 3ではこのような問題は起きていません。 どのようにすれば解決できるでしょうか。XML宣言を除けば一応表示はされたのですが。後方互換モードのことなどもIE7で改善されたとのことなので、混乱しています。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <body> </body> </html>
- 締切済み
- HTML
- alt属性だけでツールチップが表示されるのはなぜ
alt属性とtitle属性の違いは理解しておりますが、IE9やChormeでソースを見たときに、タイトル属性が書かれていなくても、ツールチップが表示されることがありますが、ブラウザやサイトによってムラがあるのは何故ですか。 宣言のdtd関連ですか？その辺りを詳しくご紹介頂けたらと思います。
- ベストアンサー
- HTML
- ie6で画像のpaddingを表示させたい
seesaaブログユーザーです。 seesaaはxhtmlで記述しているようでソースの先頭は 1:<?xml version="1.0" encoding="Shift_JIS"?> 2:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> (1:は一行目, 2:は二行目であることを表しています) のようになっています。 これを 1:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> もしくは 1:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2:<?xml version="1.0" encoding="Shift_JIS"?> としても問題ないのでしょうか？ と、質問させていただいた理由は 画像に枠をつけたいと思って、cssでimgにpaddingを指定したのですが ie6では表示されないのでこれを何とかしたいからです。 http://www.koikikukan.com/archives/2006/03/11-015552.php の記事を参照してわかったのですが、 この状態ですと画像のpaddingがie6では適用できないのですね。 そこで、記事にあるようにdoctype宣言を先頭に持っていくと ie6でも表示されるようになりました。 ということで、 「<?xml version="1.0" encoding="Shift_JIS"?>」 の扱いについて質問させていただきます。
- ベストアンサー
- XML
- ie8でaltを表示させる方法
先日IEを7から8へ変えたのですが、alt属性が使えないことが判明しました。 title以外に、altと同等のポップアップを表示させるには、どんな方法があるのでしょうか？
- ベストアンサー
- HTML
- 画像をループさせて表示させたい。
すみません、jquery初心者です。 下記サイトのようにコンテンツをループで表示させたいのですが、 http://yurubu.org/jquery-autoload/513 HTMLの <!DOCTYPE html> <html lang="ja"> を <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio … <html xmlns="http://www.w3.org/1999/xhtml"> に変更すると動きません。。 どう変更すれば動くのでしょうか？ ご教授頂けると大変助かります。 よろしくお願いします。
- ベストアンサー
- JavaScript
- Dreamweaverでバリデートをかけてソースをチェックしたところ、
Dreamweaverでバリデートをかけてソースをチェックしたところ、 タグ"html"には、現在アクティブなバージョンでは属性"xmlns:spry"がありません。 [XHTML 1.0 Transitional] タグ"div"には、現在アクティブなバージョンでは属性"spry:region"がありません。 [XHTML 1.0 Transitional] タグ"div"には、現在アクティブなバージョンでは属性"spry:repeat"がありません。 [XHTML 1.0 Transitional] というエラーがでてしまいました。 現在のDOCTYPE宣言は、 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> です。 html要素は、 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" xmlns:spry="http://ns.adobe.com/spry"> です。 DOCTYPEに問題があると思い、XHTML1.0のStrict DVDやFrameset DVDなどに変更してみましたが、エラーは[XHTML 1.0 Transitional]の部分がそれぞれのDTDに変わるだけで、エラーは減りませんでした。 ちなみにHTML 4.01に変更したらエラーがとても増えました。 ※一番上のエラーですが、 htm要素中のxmlns:spry="http://ns.adobe.com/spry"を削除したら、エラーがなくなりました。 残りは2つです。 助けてください。
- ベストアンサー
- HTML
お礼
ありがとうございます。 そこらへんを調べてみたいと思います。