略語のマークアップにはabbr
HTMLで略語をマークアップする時には<abbr>
を使います。
<abbr>
は「abbreviation」から取っていて、省略、短縮、略語、略字などの意味があります。
HTML4.01までは、頭字語(たとえば、WWW[Wordld Wide Web]みたいに頭文字を取った略語)には、acronymというタグを使うことになっていましたが、HTML5からは廃止され、<abbr>
に統一されました。
古いWebページや参考書には、acronymを紹介しているかもしれないので、注意しましょう。
abbrの使い方
使い方は基本的には、略語の部分を<abbr>
と</abbr>
で囲むだけもOKですが、title属性で略語の元の語句を明示することを推奨されています。
なので、ページの最初に出てくる語句には<abbr title="WordPress">WP</abbr>
のように、マークアップする方が良いでしょう。
CSSでツールチップの設定をしておけば、下記のようにマウスオーバーで正式名称を表示させることもできます。
WPは世界中のウェブサイトのなかで約3割のシェアを誇っている。
語句の定義の記述にはdfn
上記のabbrと共に使われるケースもあるので、ついでにこのページで説明しておきますが、dfn
を使うときは、<dfn>JavaScript</dfn>
のように用語をdfn
タグで挟みますが、その際にdfn
タグの親要素の段落<p></p>
やセクション<section></section>
にはその用語の定義を定義する内容を記述する必要があります。
たとえば、JavaScriptをdfn
で記述するとこんな感じになります。
HTMLでは以下のようにマークアップされています。
上記の例ではJavaScriptという用語は略語ではありませんでしたが、これが略語だった場合は、abbrで略語の正式名称をマークアップしつつ、用語を定義することもできます。
<p><dfn><abbr title="Cascading Style Sheets">CSS</abbr></dfn>とは、HTMLやXMLの要素をブラウザなどでみたときに、どのように表示するかを指示する国際的な基準のことを指す。</p>