<dt> そして <dd> 要素は <dl>aによって含まれる必要があります。

ルールID: dlitem
ルールセット: axe-core 4.10
ユーザーへの影響:
ガイドライン: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), EN 301 549

Need accessibility training?

Deque University offers an extensive curriculum of self-guided online courses for every skillset and experience level.

Compliance Data & Impact

User Impact


▼
Minor
Critical

Disabilities Affected

  • 盲目
  • 盲ろう者
  • 運動・器用さ

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • WCAG 2.2 (A)
  • EN 301 549

WCAG 達成基準 [WCAG 2.1 (A)]

  • 1.3.1: Info and Relationships

WCAG 達成基準 [WCAG 2.0 (A)]

  • 1.3.1: Info and Relationships

WCAG 達成基準 [WCAG 2.2 (A)]

  • 1.3.1: Info and Relationships

    修正方法

    リストが適切な階層に従うようにするには、リスト項目を dl 親要素で囲みます。さらに、 dt および dd 要素が適切な順序になっていることを確認してください。

    このルールは、定義リスト要素の有効な階層的使用をチェックし、スクリーン リーダーのユーザーが、何を聞いているのか、また、親項目と子項目の組織関係に関して定義リストを聞くときに何を期待できるのかを把握できるようにします。

    たとえば、次のコードでエラーが発生するとします。

    <dt>Coffee</dt>
  <dd>Black hot drink</dd>
<dt>Milk</dt>
  <dd>White cold drink</dd>

    それを <dl> 要素でラップ:

    <dl>
  <dt>Coffee</dt>
    <dd>Black hot drink</dd>
  <dt>Milk</dt>
    <dd>White cold drink</dd>
</dl>

    なぜ重要なのか

    定義リスト項目は親 dl 要素で囲む必要があります、そうでない場合は無効になります。

    定義リストは特定の階層に従う必要があります。リストは dl 要素を使用して定義されます。以下は、 dt 要素から始まる dd 要素と dt 要素の交互のセットです。 dt 要素は用語を定義し、 dd 要素は用語の説明を示します。各 dt 要素セットには、対応する dd 要素セットが必要です。定義リストでは、 dt および dd 要素のみが許可されます。この階層に従わない場合、リストは無効になります。

    ルールの説明

    定義リスト項目 (dt および/または dd) は、有効にするには親 dl 要素で囲む必要があります。これにより、スクリーン リーダーのユーザーはリスト内の情報の適切な階層を理解できるようになります。

    仕組みについて (簡単に言うと)

    すべての子 dd 要素と dt 要素が親として dl aを持つようにします。

    リソース

    Deque University コースのページ (要登録)

    GitHub で axe-core に貢献する

    その他のリソース

    その他リソースもあわせてご参照ください。

    axe 4.10 ルールの一覧 を参照する

    この情報は役に立ちましたか?

    すでにフィードバックをいただきました、ありがとうございます。.

    あなたの回答は次のとおりです。

    この情報は役に立ちましたか?
    フィードバックが提出された日付/時刻: