abbr要素（abbreviation）は長い単語や語句の略語（省略）を示すインライン要素です。略語とは、もとの語形の一部分を省略して簡略にした語、または HTML のように頭文字だけをとったものをいいます。
abbr要素は title属性と組み合わせて使います。title属性の値には、その略語が省略される前の言葉をフルスペルで記述します。たとえば、HTML であれば、title属性は title="HyperText Markup Language" と記述します。
その略語が本文で最初に出てくるところで正式名称(省略していない状態の言葉)を示すために使い、同じ略語が以降に何度も登場する場合、音声出力環境での観覧者にとっては同じ内容の読み上げが続くと諄くなってしまうため2度目以降には指定する必要はないでしょう。
似たような要素に略語の中でも一つの単語として発音される略語である頭字語を示す場合に用いる acronym要素があります。abbr要素と acronym要素の違いは、一応、音声環境での読み上げ（表現）時に異なる発音で読み上げることが期待されますが、実際にはユーザーが利用している音声出力環境にその語が収録されているかのボキャブラリー（語彙）に依ります。
また、仕様においても両要素は明確な使い分けがなされていません。しかし、現在草案段階である次世代規格の XHTML2.0 では abbr要素が acronyms（頭字語）の役割も含むと定義されており、acronym要素は廃止される予定であるため、略語のマーク付けについては、すべて abbr要素に統一されることになります。つまり、現段階においても abbr要素と acronym要素を特別使い分ける必要はないため、略語のマーク付けは abbr要素に統一すると良いでしょう。
Netscape, Firefox, Opera, Safari では abbr要素の内容に点線の下線が表示され、ポインティングデバイス（マウスやノートパソコン付属のトラックパッドなど）のカーソルをその部分にあわせることで title属性に指定した略語のもととなる単語や語句をツールチップで表示します。Windows版Internet Explorer 7, Macintosh版Internet Explorer 5 はデフォルトでは点線の下線を表示する設定にはなっていませんが、カーソルをあわせた時に title属性の値をツールチップで表示します。なお、Windows版Internet Explorer 6 は abbr要素に全く対応しておらず、title属性の指定された値の表示や CSS による装飾の指定も反映されません。点線の下線については CSS の borderプロパティで非表示にしたり、実線にしたりなどの表示を調節できます。デフォルトで下線の表示指定が行われていない UA についても "abbr { border-bottom : 1px dotted ; }" のように記述することで視覚環境における表示を統一することができます。
var abbrElements,abbrPart,m;
abbrElements = document.getElementsByTagName("abbr");
while(m = abbrElements.length){
abbrPart = abbrElements.item(m-1).parentNode;
abbrPart.innerHTML = abbrPart.innerHTML.replace(/(<\/?)abbr/ig,'$1acronym');
}
これは JavaScript の innerHTMLプロパティを用いて、abbr要素の要素型名を acronym要素に書き換えてしまう方法です。このソースコードを文書の最後（body要素の終了タグ直前）に記述します。Windows版Internet Explorer 6 は abbr要素には対応していませんが、acronym要素には対応していることを利用して、文書の内容を動的に変更できる DHTML で abbr要素の要素型名を acronym要素へと書き換えてしまいます。これで略語を abbr要素で統一してマーク付けを行っても、JavaScript の設定が有効であれば Windows版Internet Explorer 6 でも title属性で指定された略語のもととなる単語や語句をツールチップで表示することも CSS で "abbr,acronym { border-bottom : 1px dotted ; }" と記述すれば表示を統一することもできます。
<p>Web標準化団体の<abbr title="World Wide Web Consoritum">W3C</abbr>…</p> <p>検索エンジン対策の<abbr title="Search Engine Optimization">SEO</abbr>…</p>
http://w3g.jp/xhtml/dic/abbr実績：大阪学院 入試サイト New! / 三田市民病院 / 神戸女学院大学 入試サイト / 釣りサンデー