HTML

トップ > チップス > HTML

隠し要素

ある要素を非表示にしたい場合、例えば以下のようにCSSで設定する方法があります。

<span style='display: none'>Hello!</span>


これとは別に、（HTML5から？)aria-hiddenという属性が定義されています。

<span aria-hidden='true'>Hello!</span>


参照先の説明によれば、CSSで消した場合との違いはスクリーンリーダなどでの解釈だそうです。CSSはあくまでブラウザの画面にレンダリングされる際の指定で、aria-hiddenの指定はどのような場合にも知覚されないように、という広い意図があるようです。

そうか、完全に隠したい場合はaria-hiddenを使うのか、と最初は思ったのですが、ちょっと違うようです。具体的には上記のaria-hidden付きのspanをHTML中に書いても、何のことはなく、そのまま普通に表示されます（以下がその例です）。

<span aria-hidden='true'>Hello!</span>


スクリーンリーダ用の設定、と思っておけば良い、のかな。。

参考URL

• タグ別一覧: [html]
• チップス一覧