見せたくない情報をCSSで制御

CSSに対応していません

最終更新
更新はありません

勘違い

お使いのブラウザはCSSに対応していません。
対応していますけど。

これはdisplay:none、あるいはvisibility:hiddenのよろしくない使い方で、制作者が用意したスタイルシートをブラウザが処理しない場合にのみ現われるメッセージを、HTML文書に記述しているわけです。ユーザースタイルシートを使っていると、こういう奇妙なメッセージにしばしば遭遇します。

勘違いを引き起こす根本的原因

ブラウザにどのように表示されるかを考えながら、HTML文書を作成しているのが原因です。CSSは、このような態度に基づいたHTML文書とは親和性がありません。

代替案

  • 「当サイトの制作方針(殺風景だと感じられた方は是非ご覧下さい)」

このような文を、詳細へのリンクとしておきます。もはや「隠す」必要はありませんね。「隠す」としたら、丸括弧の部分だけでしょう。

はじめにテキストありき

最終更新
更新はありません

あくまでも、最初に伝えたい内容を完成させ、その上で非表示にした方がベターである場合にのみ、display:noneなり、visibility:hiddenなりを指定するようにするのが、スマートな方法だと思います。

面倒臭い話などではありません。本文を完成させ、その中にHTML要素として明示できるものを、HTMLタグで明示する、という自然な手順で作成していれば、起こりえない問題です。

ですから、「CSSに対応していません」というメッセージそれ自体がタブーであるわけではなく、そうした態度でHTML文書を作成する危険について、示唆したわけであります。

類似例

  • この、赤い文字の部分に注目してください。

これはアクセシビリティ的に有名なタブーです。色盲の方には伝わりませんし、当然、音声ブラウザを使っている方にも伝わりません。ユーザースタイルシート使いにも伝わらない可能性があります。

しかし、一々タブーの事例などを考えずとも、「見栄えを意識しない文書作成」を心がけていれば、これらの深刻な問題は起こらないのです。

典拠

最終更新
更新はありません

Conforming HTML user agents may ignore the 'display' property.

Visual formatting model より

displayプロパティを無視しても適合User Agentとして認められます。

これは、慣習的な「ブロック要素」「インライン要素」の整形方法を、無闇に変更することを推奨しないことを意味しています。W3Cは、はじめにテキストありき、あるいは、意味と見栄えの結びつきを重視していると言えるでしょう。