dfn要素：HTML Living Standard各要素別メモ

概要

カテゴリー

• Flow content
• Phrasing content
• Palpable content

配置できる場所

• 上記カテゴリーの要素が置ける場所。
• 下記の内容モデルの結果として、dfn要素を祖先に持ってはならない。

内容モデル

• Phrasing content。ただし、dfn要素を子孫に含んではならない。

属性

• グローバル属性
• title属性がある場合は、その属性値は定義語を表す。

HTML構文におけるタグの省略

• 省略不可。

WAI-ARIA

• デフォルトroleは、term。デフォルトroleをrole属性値に指定することは、推奨されない。
• デフォルトrole以外では、すべてのroleが指定可能。

視覚系ブラウザのデフォルトとして期待されるCSS

  dfn {font-style: italic;}
  

意味・用法

定義語を表す。

dfn要素の直近の祖先のdl要素、p要素、section要素などは、dfn要素で指定された定義語の定義を含んでいなければならない。

dfn要素へリンクしているa要素は、その定義語の実体を表す。

何が定義語かは、以下による。

1. 当該要素にtitle属性があるならば、そのtitle属性値。
2. 上記に当てはまらない場合で、当該要素の子がtitle属性値を持つabbr要素1個だけであるならば、当該title属性値。
3. 上記に当てはまらないならば、当該要素の内容テキスト。

アクセシビリティ関連

• 専門用語等が想定読者等にとって全く馴染みのないものでその正確な意味を理解してもらわないと困る場合は、定義語としてその定義を説明すべきである（Techniques for WCAG 2.1 : G101, G112, H54）。
• 定義を説明された単語が同一ウェブページ内・同一ウェブサイト内に出てくるときは、その単語に説明文へのリンクを設定して（当該単語を定義語とするdfn要素にid属性値を指定して、それをリンク先にすれば手っ取り早いだろう）、ユーザーが単語の説明に容易にアクセスできるようにすべきである（Techniques for WCAG 2.1 : G55）。

私見・補足

• dl要素による定義づけでは、dt要素の内容にdfn要素を含ませる（「定義づけ例１」を参照）。

  
          <dl>
          <dt><dfn>定義語</dfn></dt>
          <dd>説明文</dd>
          </dl>
          

• p要素による定義づけでは、その内容テキストの主語にdfn要素を配置するのが通例だろうか（「定義づけ例２」を参照）。

  
          <p><dfn>定義語</dfn>とは、文中において何らかの形でその定義が説明される用語である。</p>
          

• section要素による定義づけでは、その見出したるh1-h6要素の内容にdfn要素を含ませることになるだろう（「定義づけ例３」を参照）。

  
          <section>
            <h1><dfn>定義語</dfn></h1>
            <p>説明文</p>
          </section>
          

表示確認

ソース

  <dfn>定義語</dfn>あるいは<dfn>definition word</dfn>とは、文中において何らかの形でその定義が説明される用語である。
  

表示結果

定義語あるいはdefinition wordとは、文中において何らかの形でその定義が説明される用語である。