- ベストアンサー
CSS検証サービスで警告が出ます
CSS検証サービスhttp://jigsaw.w3.org/css-validator/は validで通ったんですが、フッターの背景色とコンテンツの 文字色が黒で重複があると警告が出ています。 コンテンツの背景はパステル調なので問題はありません。 このような警告は無視してもいいかなと思って、 2ヶ月ぐらい放置してるんですが、何か落ち着きません。 私一人で悩んでいても仕方がないかなと思ったので どういう風に対応したら良いのか考え方を教えて下さい。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
>現状は色無しでも理解が可能です。 いえ、画像なしです。 >>画像が読み込めない(画像の読み込みを停止している)状態だと文字が見えない可能性がある。 検索エンジンのアルゴリズムは想像しかできませんが、 隠しテキストと隠しリンク - ウェブマスター ツール ヘルプ ( http://support.google.com/webmasters/bin/answer.py?hl=ja&answer=66353 ) できれば、きちんと修正したほうが良いとおもいます。 .footer { background-color : black }/* 詳細度0010--継承するプロパティ */ 内に、 p.sample1/* 詳細度 0011 */, td/* 詳細度 0001 */{color:black} だと、明らかに隠し文字・・
その他の回答 (2)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
きちんと見てみましょう。 body { background : url("sakura.jpg") repeat } /* 詳細度 0,0,0,1 */ .footer { background-color : black }/* 詳細度 0,0,1,0 */ p.sample1とかtdとかで{color:black}/* 詳細度 0,0,1,1 */ となます。 確かに、これを見ると問題があります。背景画像にしている画像のファイル名を消すなどして画像が読み込めない(画像の読み込みを停止している)状態だと文字が見えない可能性がある。 body{color:block;background:url("sakura.jpg") rgb(255,220,220,220);}/* 画像がなくても良いように */ body>div.footer{background-color:black;color:white;} とか。 カスケーディングの仕組みをきちんと理解しておくこと。 ★6.4 カスケード処理(The cascade) ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cascade.html#cascade ) ※詳細度の計算は、現行のCSS2.1では少し変わっていますが、それが問題になることは少ないでしょう。 →6.4.3 Calculating a selector's specificity ( http://www.w3.org/TR/CSS2/cascade.html#specificity ) 【引用】____________ここから 注。 色は文書に大量の補助情報を与え、文書を読み易くしてくれる。 ただし、色の組み合わせによっては、色盲のユーザが問題を抱える場合もあることを考慮せよ。 背景画像や背景色を指定する場合は、それに合わせて前景色を調節すること。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[CSS2の構文と基本データ型( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/syndata.html#color-units )]より ★A.5. 色なしで見たときにテキストやグラフィックスが受領可能、理解可能であることを確かめましょう ( http://www.doraneko.org/wai/contents10/19980918/Overview.html#A5 )
お礼
先生、どうもご回答有り難うございます。 このお答えを何回読み直しても・・・?なのです。 現状は色無しでも理解が可能です。 結局メインコンテンツでフッターの背景色と 重なるのはNGなんでしょうか。 私が心配してるのはサーチエンジンに 不正の判定をされるかどうかです。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
CSSのどの部分で、そう判定されたかわからないので回答はできませんが、可能性としては、 ・検証にかけたCSS以外でパステル調に指定してある。 ・背景が画像であり、画像が読み込めないときにに など・・ たとえば、 body div.footer{background:rgb(220,220,255) url();} と詳細度を上げてみる。
お礼
ご回答有り難うございます。説明のため端折ります。 body { background : url("sakura.jpg") repeat } .footer { background-color : black } 対してメインコンテンツの中で p.sample1とかtdとかで{color:black}とかすると 重複していますとエラーが出ます。
お礼
どうもご回答有り難うございます。 やっぱり不正判定を受ける可能性があったのですか・・・ 詳細度ってこういうので地味に重要なのですね。 もう一度配色を見直すのも面倒だし、 フッターの色を変えることにします。