僕自身はこの画像置換法というやつは使ったことがありません。なぜかというと・・・

インチキくさいからです。なんていうと怒られそうですが・・・。最初にこの方法を知った時、text-indent:-9999pxって直感的にインチキだって思ったんです。

画像置換法は、上記のようにtext-indentを使って、例えばヘッダ<h1>のテキストを強制的に欄外に表示するようにして、代わりの背景画像を指定することで、テキスト情報と視覚情報を両立させる方法です。

ところが、背景はブラウザの初期設定では印刷されないようになっています。印刷してみたら何にも出てこない、みたいなことになりかねません。

もとより、一般的なユーザーがWEBページを印刷することに何を期待するかと言うと、画面に表示されているそのままが出力されることだと思います。

そういう意味では、印刷用にレイアウトの異なるCSSを設定することすら(したことないですがorz)ユーザーにとっては混乱のもとなのかも知れません。印刷用のページを別途、画面で表示させるべきなのでしょう。

そんなことを考えていて、ロールオーバーにしても、いまだに<img>+でやったりしています。が"使用しない"になっててもとりあえず画像は表示されるので・・・

ということを最近考えているんですが、近いことをLucky bag::blogさんが既に書かれていました。なんと、強制的に背景画像を印刷してしまえるみたいです。でも、display: list-itemに置換とか恐くてできないよーーー。

Lucky bag::blog: 印刷用 CSS で背景画像を印刷させる方法