landmark-unique

同じロールのランドマークは名前が一意である必要があります

manual確度:medium重大度:minoroperable

2つ以上のランドマークが同じロールを持つ場合に、それぞれが異なるアクセシブルな名前を持つことを確認します。

適用範囲:ページ上の2つ以上のランドマーク領域が同じランドマークロール(banner、contentinfo、main、navigation、complementary、region、form、search)を持つ場合に適用されます。ElementInternalsによってランドマークロールを与えられたカスタム要素(this.attachInternals().role)は、別のロールを示すrole属性がなければ、そのロールを持つネイティブ要素と同じくランドマークです。

期待される結果:同じロールを持つランドマークは、それぞれ異なるアクセシブルな名前を持ちます(aria-label/aria-labelledbyによるもの。ランドマークの名前はコンテンツからは算出されません)。同じロールで名前も同じランドマーク(どちらも名前がない場合を含む)は、ランドマークでナビゲーションする支援技術のユーザーには区別がつきません。名前の共有はCANTTELLとして報告され、FAILになることはありません。ARIA Authoring Practicesは、表の上下に繰り返されるページ送りのように、ランドマークの内容と目的が同じ場合には名前の共有を認めており、それを確認できるのは人だけだからです。名前のない2つのランドマークにはいずれにしても名前が必要で、その名前にも同じ例外が当てはまります。

検出結果が報告する内容:

  • role:衝突しているランドマークが共有しているランドマークロールです(例:navigation)。
  • name:それらが共有している名前で、小文字にし、空白をまとめたものです。すべて名前がない場合は空です。
  • groupSize:そのロールで、その名前を共有しているランドマークの数です。

これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。

例

pass
<nav aria-label="Primary">Primary nav</nav>
<nav aria-label="Footer">Footer nav</nav>

各navigationランドマークが異なるアクセシブルな名前を持っています。

can't tell
<nav aria-label="Site">First</nav>
<nav aria-label="Site">Second</nav>

2つのnavigationランドマークがまったく同じアクセシブルな名前を持っているため、スクリーンリーダーのユーザーはランドマーク一覧で両者を区別できません。両者の内容が同一かどうかを人が確認します。ARIA Authoring Practicesが名前の共有を認めるのは、その場合だけです。

n/a
<nav aria-label="Primary">Primary nav</nav>
<main>Content</main>

同じランドマークロールが2回以上使われていません。

確認方法

このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。

LANDMARK_NOT_UNIQUE

  1. レポートに示されたランドマークを見つけてください。navigationなどの同じロールと、同じ名前を持つか名前がありません。
  2. ページ上でそれぞれを確認し、含まれている内容と目的を比べてください。
  3. 目的が異なる(たとえばメインメニューとフッターのリンク)場合は、それぞれを区別するaria-labelまたはaria-labelledbyがあるか確認してください。
  4. ブラウザーの開発者ツールでアクセシビリティペインを開き、各ランドマークが公開している名前を確認してください。

満たす場合:ランドマークは同じ目的で同じコンテンツを含んでいる(リストの上下で繰り返されるページ送りなど)か、それぞれが何であるかを示す異なる名前が付いています。

満たさない場合:内容の異なるランドマークが名前を共有しているか名前がないため、ランドマークで移動するときに区別できません(ベストプラクティス、ARIA13)。

ソースコードを見る