目次に戻る

abbr要素:HTML Living Standard各要素別メモ

概要

カテゴリー
配置できる場所
内容モデル
属性
  • グローバル属性
  • title属性値は、略語等の非省略表記でなければならない。
HTML構文におけるタグの省略
  • 省略不可。
WAI-ARIA
  • すべてのroleが指定可能。
視覚系ブラウザデフォルトとして期待されるCSS

  abbr[title] {text-decoration: dotted underline;}
  
意味・用法

略語や頭字語を表す。

任意で、非省略表記を属性値とするtitle属性を伴う。

略語等をことごとくすべて当該要素マークアップせねばならないわけではない。

同一HTML文書内にこの要素マークアップされた全く同じ綴りの略語等が複数あったとしても、title属性値でなくかつ完全に同一でない限り、それらは同一の略語等であるとは限らない。

当該要素は、下記の場合に有用であることが期待される。

  • 閲覧者に対して、何らかの形で略語等の非省略表記の情報を提示したい場合。
  • 閲覧者に馴染みのない初出の略語等を、その非省略表記の情報を含めて、マークアップしたい場合。
  • 閲覧者に対してそれが略語等であることを示唆するために、当該部分に特定のスタイルシートを適用したい場合。

アクセシビリティ関連

私見・補足

一般に馴染みの薄い初出の略語等で、多くの読者が何らかの形で非省略表記を知りたいだろうものに用いるのが有用。

一般的な視覚系ブラウザでは、マウスポインタをのせるとツールチップで非省略表記が出る場合が多い。

頭字語の読み方を示したい場合は、ruby要素を併用する(「併用例」を参照)。

併用例

    <ruby>
      <abbr title="North Atlantic Treaty Organization">NATO</abbr>
      <rp>(</rp>
      <rt>ナトー</rt>
      <rp>)</rp>
    </ruby>
    

表示確認

ソース

  <abbr title="World Health Organization">WHO</abbr>は、感染症対策に力を入れている。
  
表示結果
WHOは、感染症対策に力を入れている。

上記のデフォルトスタイルに従わない視覚系ブラウザも少なくないようである。

IE6表示のスクリーンショット
IE6表示:点線の下線が引かれてない

IE7からIE11も同様。