LEARN BY EXAMPLE
3.2.4 一貫した識別性 レベル AA
同じ機能は、前のページで覚えた名前や記号で見つけられるようにする。
概要
同じウェブページ一式で、同じ機能を持つ部品を一貫して識別できるようにします。繰り返し使う検索ボタンや共通リンクなどは、名前やアイコンから、前に使った機能だと分かるようにします。
同じ講座検索を、同じ名前で見つける
PCやスマートフォンで講座サイトを使う場面です。二つのページに繰り返し置かれる、同じ講座検索のボタンを比べます。
利用者が困る例 同じ共通検索の名前が変わる
前に使った検索と同じか確かめ直す。
「検索」と「探す」は同じ講座を検索しますが、共通のボタンの名前が変わっています。
改善した例 表示も読み上げる名前も「検索」
両方に「写真」と入力して「検索」を選ぶと、同じ講座が表示されます。「文章」や、講座名にない語でも試せます。
ページA:講座一覧
講座サイトの共通検索
講座の一覧:2件
- 写真入門
- 文章の書き方
ページB:申込方法
講座サイトの共通検索
講座の一覧:2件
- 写真入門
- 文章の書き方
覚えた「検索」という名前で、同じ機能を使える。
画面の文字と、支援技術が読み上げるボタンの名前をそろえています。
達成できないと起こる問題の例
認知や学習に障害のある人が、PCやスマートフォンで講座サイトを使い、受けたい講座を検索しています。「講座一覧」の共通検索には「検索」ボタンがありましたが、「申込方法」へ移ると、同じ場所のボタンが「探す」に変わります。
どちらも講座名を入力し、同じ講座一覧から検索する機能です。利用者は、別の種類の検索なのか、前に使ったボタンと同じなのかを確かめ直さなければなりません。スクリーンリーダーが読み上げる名前だけが変わる場合も、利用者は同じ機能かどうか迷います。
達成するための改善例
同じサイトで繰り返す講座検索のボタンを、どのページでも「検索」と表示します。支援技術が読み上げる名前も「検索」にし、見た目の文字と読み上げる名前の両方で、同じ操作だと分かるようにします。
利用者は、前のページで覚えた名前を頼りに、次のページでも講座を検索できます。アイコンで識別する部品がある場合は、アイコンやその代替テキストの一貫性も確かめます。
図の改善側では、二つのページの共通検索を試せます。同じ語を入力して「検索」を選び、どちらも同じ講座を検索することを確認できます。
確認のポイント
- 複数のページで繰り返し使う部品について、使うと同じ結果が得られるものを確認しましたか。
- その部品のラベル、読み上げる名前、アイコン、代替テキストから、同じ機能だと分かりますか。
- 画面に表示する名前が同じでも、支援技術が読み上げる名前だけが変わっていませんか。
- ページ名や対象に応じて名前が変わる場合も、機能の関係を一貫して理解できますか。
- 異なる結果を生む操作まで、同じ名前にまとめていませんか。
条件と補足
同じページ一式で繰り返す機能
対象は、共通の目的を持ち、同じ制作者・グループ・組織が作った「ウェブページ一式」です。異なるウェブサイトすべてで、部品の名前を統一するという要件ではありません。
「同じ機能」は、使うと同じ結果が得られることです。共通の検索やアカウント操作など、繰り返し使う部品を確かめます。同じ組織への連絡であっても、フッターの共通リンクと本文中の説明に沿ったリンクを、すべて同じ文字にそろえる必要はありません。繰り返し現れる同じ部品として認識するものかも確認します。
一貫した識別は、一字一句の一致とは限らない
例えば、同じ4ページ目へのリンクを「ページ4」と表示し、5ページ目では「前のページ」と表示する場合です。行き先は同じでも、文脈に合った名前で機能を理解できます。画面の広い表示では「検索」という文字、狭い表示では虫眼鏡のアイコンと「検索」という読み上げる名前を使う方法もあります。
「受講票を印刷」と「領収書を印刷」のように、操作の結果が異なるものまで、同じ名前にまとめる必要はありません。文脈や対象に合う違いと、同じ共通部品の名前が理由なく変わることを区別します。
順序や名前の伝え方に関する基準との違い
共通メニューの順序は3.2.3「一貫したナビゲーション」で確認します。見えるラベルを読み上げる名前に含めることは2.5.3「ラベルを含む名前 (name)」でも確認します。部品の名前をプログラムで取得できるようにすることと、その名前に一貫性を持たせることは、両方を確かめます。
参照資料
- WCAG 2.2 本体:3.2.4 Consistent Identification(要件)
- WAIC:3.2.4 一貫した識別性の解説
- W3C:Understanding Consistent Identification(英語公開版)
- W3C:G197 同じ機能のラベル・名前・代替テキストに一貫性を持たせる方法
- W3C:F31 同じ機能を異なるラベルで示す失敗例
テクニックは達成する方法の例です。出典の最終確認: 2026-11-09。講座サイトは、この教材のために作った架空の例です。