画面上には表示されない指定について。

[新着] Webテンプレートを仮オープンしました



0   名前: さー : 2005/12/19 23:38
ttp://www.nttdocomo.co.jp/(NTTDOCOMO)ついて、質問させていただきます。
このサイト、ソースをみていただけるとわかると思うのですが、

<div class="rmv">
<ul>
<li>・・・・・や、

<h2 class="rmv"><a name="p01" id="p01">PRエリア</a></h2>

など、"rmv"という名前のclass指定されたものがいくつかあります。
ですが、このclass指定されたものは実際、通常のブラウザ上では表示されていません。

気になったのでCSSファイルをのぞいてみると、

/* 2. "hide" 要素 (remove)
----------------------------------------------- */
.rmv{
display:block;
position:absolute;
top:-9999px;
left:-9999px;
}

と、上記のように指定されていました。
これでブラウザ上で見る事ができないという理屈はわかるのですが、
なぜ、わざわざ見る事ができないようにするのでしょうか?

最初はSEO対策かもしれないと思いましたが、Firefox(WEB Developer)をいじっていたら
【Handheld】を選択すれば表示される事がわかりました。
小さい画面用の対策なのでしょうか?それとも他に何か理由が?

浅い知識のため、わかりやすい文章にならなくて申し訳ありません。
もしご存知の方がいらっしゃいましたら、なぜこれが有効なのかご伝授お願いいたします。

1   名前: Pid : 2005/12/19 23:38
> 小さい画面用の対策なのでしょうか?

おそらく,その通りでしょう。

・HTML ソースに書いたメニューを,CSS 対応環境では(より詳しいナビゲーションを機械的に生成するので)隠しておく。このメニューは CSS 非対応環境でのみ使用できる。

・HTML ソースに広告を書いておき,CSS 対応環境では消しておく。CSS 非対応環境でのみ広告が表示される。

など,CSS に対応しているかしていないかで,表示されるものを調節する,というのはよく用いられるテクニックです(もっとも,class="rmv" というクラス名の付け方は,あまり良くないですが)。

* * *

ちなみに,私はよく,

<hr>
<h2>見出し</h2>

のように,大きな見出しの前に hr 要素を入れておき,

hr { visibility: hidden; }

しておきます。そうすれば,CSS に対応していないテキストブラウザや携帯端末では横線が表示され,比較的読みやすくなる…んじゃないかな (^^;)…と思います。

2   名前: さー : 2005/12/19 23:38
お返事が遅くなりまして申し訳有りません。
とてもわかりやすくご説明いただきありがとうございました。

なるほど!やはり大きな規模になると、そのような環境を配慮した構築をするんですね。
勉強不足を改めて感じます。

ちなみに、これはSEO的にはスパム扱いにはならないんでしょうか?
もしも見ていただけていれば、お答えいただけると幸いです。

本当にありがとうございました。

3   名前: PUREST : 2005/12/19 23:38
position:absoluteやvisibility:hiddenを指定するとスパム扱いされる可能性はあります。
visibility:hiddenは隠しテキストも可能になってきますし、position:absoluteは実際に画面上では下の方にあるテキストを上の方に記述することが可能になりますので。
使うのであれば、念のため外部ファイルにした方がいいですし、少なくともstyle属性での記述はやめた方がいいでしょう。
もし、CSSの入れ方によって検索のされ方が変化したような場合は、再考慮した方がいいかもしれません。

http://www.gac.jp/article/index.php?stats=question&category=21&id=11982&command=msg

4   名前: Pid : 2005/12/19 23:38
検索エンジンの中の人ではないので確実なことは言えませんが,個人的には >>0 が spam 扱いされる理由はないと思います。

真っ当なページと spam なページの違いは,

・真っ当なページは,素の HTML だけ(あるいはスタイル無効環境)でも真っ当に(過不足なく)表示される。
・spam なページは,素の HTML だけ(あるいはスタイル無効環境)で見ると死ぬほどうんざりする (^^;)。

つまり,HTML 文書に「無関係な情報」が「不適切なマークアップ」で詰め込まれているかどうかが重要であって,「無関係な情報」が非表示であるかどうかは,必ずしも本質的な問題ではありません。

もっとも,「無関係な情報」を非表示にする輩が多いため,検索エンジン側も「非表示のスタイル指定があるかどうか」を「無関係な情報かどうか」の判断材料の一つにしているのは確かでしょう。ですから,>>3 の PUREST さんが仰るように,避けられる危険は避けておく,という選択肢は賢明だと思います。

ただ,検索エンジンの目的はあくまで「無関係な情報を排除する」ことですから,他にも文脈判定などさまざまな判断材料を組み合わせていると思います。ですから「非表示にすると spam と見なされる」と短絡的に結論付けることはできませんし,「非表示でなければ spam と見なされない」というわけでもないでしょう。

(※たとえば,del 要素で削除した情報をスタイル指定で非表示にするのは,全く正当な方法です。逆に,ページの内容と無関係な広告は,場合によっては spam と見なされるかもしれません。)

正直なところ,検索エンジンがどう判定しているのか,よく分かりません (^^;)。ですから,あまり恟恟とせず,ご自分が胸を張れるページ作りをすれば,それで良いと思います……と他人事のように言ってみる。

5   名前: さー : 2005/12/19 23:38
PUREST様、PID様、ご丁寧な説明本当にありがとうございました。m(_ _)m
SEOというのは本当に奥が深いですね…
そして何を最優先にさせるかというのが企業のサイトだと難しいところだと思っています(^^;

まぁ、よほど変な事をしなければSEOとユーザビリティーを平均的に良くできるとは思いますが、私個人の意見をいわせてもらうと、
どんなにSEOで検索順位があがっても、ユーザーに親切じゃないサイト(意味のない文章ばかりだとか)じゃ意味がないと思うんですよね。
結局サイトを見てもらえるだけじゃなくて、その先を考えないと企業サイトとしては成り立たないと思います。

って、話がまとまってない&話がそれてしまいましたが、お二人のおかげで本当に助かりました。
と同時に、実はこれから規模が大きいサイトを制作するので、もっと勉強しなきゃなと改めて実感いたしました。

ご丁寧な説明感謝いたします。ありがとうございました。m(_ _)m

一覧へ戻る