会社にいた頃から、気になっていたのだけれど、
リストタグでマークアップされたグローバルナビを、CSSで背景画像置換して（hover画像もまとめて用意して）
テキストをtext-indent:-9999px（など）で画面外に追いやるやり方って、今でも主流なのかと思って調べてみた。

 

つまり、今の主流はリストにテキストを入れず、imgタグで画像を入れて、それをJavaScriptでon（hover）、off（通常）で切り替える、昔のやり方に戻りつつあるんじゃないかと。

結論からすると、そうでもなかった。

各業界の大きな所を見てみる。（2009年6月13日時点のデータ）

トヨタ
http://toyota.jp/
imgタグ。
 

JR
http://www.jreast.co.jp/
CSS画像置換
 

野村証券
http://www.nomura.co.jp/
imgタグ。
 

電通
http://www.dentsu.co.jp/
CSS画像置換
 

資生堂
http://www.shiseido.co.jp/
CSS画像置換
 

フジテレビ
http://www.fujitv.co.jp/
Flash
 

大日本印刷
http://www.dnp.co.jp/
imgタグ。
 

慶應義塾大学
http://www.keio.ac.jp/index-jp.html
imgタグ。
 

吉野家
http://www.yoshinoya.com/
Flash
 

ユニクロ
http://www.uniqlo.com/jp/
CSS画像置換
 

ドンキホーテ
http://www.donki.com/index.php
imgタグ

 

ここからはネット関連企業
 

IMJ
http://www.imjp.co.jp/
imgタグ。
 

フルスピード（SEO会社）
http://www.fullspeed.co.jp/
imgタグ。
 

サイバーエージェント
http://www.cyberagent.co.jp/
CSS画像置換
 

paperboy
http://www.paperboy.co.jp/
CSS画像置換

six apart
http://www.sixapart.jp/
CSS画像置換

 

 

なんかネット関連系でもまちまちですね。

グローバルナビで使う分にはGoogleはスパムとはみなしていない感じですが‥。
まあこればっかりはわかりませんね。

 

同じ疑問をお持ちの方が記事を書かれていました。
 

「画像置換に対する考え方」
http://blog.webcreativepark.net/2007/02/18-151202.html

「画像置換はもう古い？」
http://www.welinadesign.com/2009/03/13/textindent/

「画像置換乱用してませんか？」
http://h2ham.seesaa.net/article/115925272.html

 

 

FireFoxだとスタイルシート切っても、インデントで画面から消してるテキストも見られているのでいい別にいいんじゃないか？と思っていましたが、

どうやらIE7で見ると、見事に消えてしまっていますね。(知らなかった！）

あと、画像を無効化している環境でも全く見えなくなってしまいます。

 

やっぱりimgタグをJavascriptで切り替える方に徹底していこうかなという気分です。

jQueryを使ったプルダウン式グローバルナビをやってみたら結構よかったです。

 

以上