1分で読了コンプライアンス

QRコードのアクセシビリティ:WCAG、コントラスト比、代替手段

QRコードはテキスト代替のない画像であり、誰もTabキーでフォーカスできないターゲットです。アクセシビリティ規則が何を求めているか、そしてその大半を解消する印刷フォールバックを解説します。

Sasha Ehrlich
Compliance · EU residency
ポスターのQRコードとその下に印刷された短縮URL。スキャンできない人のためのアクセシブルな代替手段として示されている

QRコードはリンクの画像です。それを使うには、そこにあることを知り、空間の中でそれを見つけ、カメラを向け、静止させる必要があります。この4つのいずれかができない人は、情報への経路が一切ないことになります。だからこそ、まともなアクセシビリティのガイドラインはすべて、コードを唯一の入り口ではなく、入り口の一つとして扱います。

義務はきれいに分かれます。画面上ではコードは画像であり、Web Content Accessibility Guidelinesが直接適用されます。印刷物では、どのガイドラインも紙面には及ばず、責任はコードの横に何を置くかへと移ります。どちらの場合も、法的リスクの大半は実のところ遷移先のページにあります。スキャンが成功した後に何が収集されるかについては、QRコードとGDPRが同じ正方形のデータ面を扱っています。

三つの障壁、一つではない

チームは目に見える障壁だけを解消し、残りの二つを放置しがちです。

見つけること。 印刷されたコードは視覚的にしか自らの存在を示しません。目が見えない人は、テキストにそう書かれていない限り、ポスターにコードが付いていること、テーブルテントにあること、手紙に含まれていることを知る術がありません。だからこそ、記号の下に小さな文字で「コードをスキャンしてください」と印刷しても、それだけでは何も解決しません。

スキャンすること。 コードをフレームに収めるには、使える中心視野とある程度安定した手が必要です。弱視、震え、握力の制限、そして立位の高さに設置されたコードに向き合う車椅子利用者は、それぞれ別の失敗要因でありながら結果は同じです。ガラス越しやカウンターの上にあるコードは距離を加え、それをサイズの計算が考慮しなければなりません。

開いた先を使うこと。 コードの背後にあるページは他と変わらないウェブページであり、強制力のある義務が集中する場所です。テキストレイヤーのないPDFメニューにつながるスキャン可能なコードは、障壁を移動させただけで、取り除いてはいません。

WCAGが求めていること

四つの規定が繰り返し登場しますが、いずれも過大な負担ではありません。

画像として表示されるコードには、非テキストコンテンツの規則の下で、遷移先を説明するテキスト代替が必要です。「QRコード」は無駄になったalt属性であり、「予約フォームにリンクするQRコード」こそが情報です。同じページにURLがテキストとしても印刷されている場合は、コードを装飾用として扱うことも合理的です。

デザイナーが最もよく破るのはコントラスト比です。非テキストコントラストの要件は、図形を理解するために必要な部分についてコントラスト比3:1の下限を設けており、QRコードの場合それはモジュールとその背景を意味します。写真の背景、コントラストの低いブランドの配色、反転させたパターンは、いずれもガイドラインに反し、多くの場合スキャナーにも読み取れません。ブランド化されたQRコードのデザインでは、パターンがデコードできなくなる手前までどこまでスタイリングを押せるかを扱っています。

リンクの目的も重要です。コードがリンクの横にある場合、見える文字はそれがどこに行くかを示すべきであり、それを求めているのが文脈におけるリンクの目的という規定です。「ここをクリック」は、ラベルのないコードと同じ理由で失格になります。

そしてクワイエットゾーン、つまりパターン周囲の余白は、印刷上の問題であると同時にアクセシビリティ上の問題でもあります。レイアウトに合わせてそれを切り詰めると、コードは誰にとっても認識しづらくなり、一部の人にとっては不可能になります。

QRコードが生む四つのアクセシビリティ上の障壁、それぞれが影響する対象、そしてそれを取り除く対策

欧州アクセシビリティ法が適用される範囲

指令(EU)2019/882は2025年6月28日から適用されており、これまでアクセシビリティを公共部門の関心事として扱ってきた民間部門の組織にとって計算を変えるものです。

それが自社に及ぶかどうかを決めるのは三つの点です。まず、eコマース、消費者向け銀行業務、旅客輸送、電子書籍など、指定された製品と消費者向けサービスを対象とします。次に、サービスに帰属するため、印刷された正方形自体は対象外でも、コードが開くページは適用範囲に入ります。そして各国法に置き換えられるため、執行機関、罰則、サービスに関する小規模事業者の適用除外の詳細は、販売先の加盟国によって異なります。

マーケティングチームにとっての実務的な読み方はこうです。スキャンがEU域内の消費者との購入、予約、銀行取引につながるのであれば、遷移先を規制対象の面として扱い、それに応じてテストしてください。公共機関はすでに以前のウェブアクセシビリティ規則とEN 301 549規格の対象となっており、その詳細は政府機関向けURLショートナーで扱っています。

私としては、コードの見た目に1週間かけるくらいなら、遷移先のページを直してURLを印刷してほしいと思います。執行機関が尋ねるのは、その最初の二つだからです。

印刷された短縮URLこそがアクセシビリティ機能である

これはリストの中で最も価値の高い変更であり、コストはわずか一行の活字だけです。

コードの下に印刷された短縮URLは、印刷物が他の方法では持ち得ないテキスト代替です。それは画面拡大を使っていて活字は読めてもカメラをフレームに収められない人の役に立ちます。カメラアプリが動作しない携帯電話を使っている人、借り物の端末を使っている人、後でノートパソコンでページを開きたい人の役にも立ちます。さらに、照明やツヤのせいでコードがスキャンできないという特定の状況では、目が見える大多数の人の役にも立ちます。

書き写せるものにしてください。

  1. パスを数文字に抑え、読んでから入力するまでの間、記憶に保持できるようにする。
  2. 全体を小文字にし、印刷すると紛らわしくなる文字の組み合わせを避ける。
  3. ランダムな文字列より単語を選ぶ。単語として読めるカスタムバックハーフは質の悪いコピーにも耐えますが、ランダムなものは耐えません。
  4. レイアウトが許す最小の文字サイズではなく、コードをスキャンする距離から読める大きさで組む。
  5. 自社のドメインを前に置く。見覚えのあるドメインは誰にとっても信頼のシグナルであり、それが画面上より印刷物でなぜより重要になるかはブランド化されたリンクとは何かで扱っています。

それぞれに読みやすい印刷フォールバックを添えてコードを生成したいなら、ElidoのQRコード機能がコードと短縮リンクを同時に作成するため、入力する代替は常にその横にあるコードと一致します。

印刷代替、コントラスト比、ラベル付け、遷移先のテストをカバーする、アクセシブルなQR配置のための四段階チェックリスト

自分以外の誰かとしてテストする

五つのチェックがあり、最初の三つは10分で終わります。

遷移先のページをスクリーンリーダーにかけてください。チェックリストツールではなく、実際のスクリーンリーダーで、主要なアクションに到達でき、ラベルが付いているかどうかを耳で確かめます。米国Section 508によるQR実装のガイダンスは、何を聞き取るべきかについての簡潔な参考資料です。

ファイルではなく、印刷された校正刷りのコントラストを測定してください。コート加工されていない用紙の上のインクは、画面のプレビューが実際より良く見せているコントラストを失います。

実際の人がいる位置からコードをスキャンしてください。座った状態で、実際の設置高さで、会場の実際の照明の下で。1.6メートルの高さにあるコードは、それを設置したデザイナーにとってと車椅子利用者にとってでは、まったく別の対象です。

コードを見ずに、印刷されたURLを携帯電話のキーボードで手入力してみてください。3回試行してもうまくいかないなら、スラッグの設計が間違っています。

そして、その背後にあるページを、自社の主要サイトと同じ基準に照らして確認してください。義務が存在するのはそこであり、最もよく飛ばされるチェックでもあります。

コーナーストーンシリーズを読む

この投稿はコンプライアンスクラスターに属しています。URLショートナーのGDPRは同じ領域のデータ保護に関する半分のコーナーストーンであり、QRコードとGDPRはスキャンが実際に何を収集するかを扱っています。

ブログ関連記事

よくある質問

QRコードはアクセシブルですか?

単独では違います。スキャンするには、それを見つけるための視力、フレームに収めるための安定した狙い、そしてカメラ機能を備えた端末が必要です。そのいずれも当然のものとは見なせないため、アクセシビリティのガイダンスはQRコードを唯一の経路ではなく、情報への追加的な経路として扱います。その横に短縮URLを印刷するだけで、障壁の大部分は解消されます。

QRコードには代替テキストが必要ですか?

ウェブページや文書内で画像として表示される場合は必要です。それが何であるかではなく、どこにつながるかを説明してください。スクリーンリーダーの利用者は、QRコードがあると告げられても何も得られませんが、予約ページが開くと告げられればすべてが分かります。印刷物には代替テキストが存在しないため、テキスト代替は読みやすい書体で組まれたURLそのものになります。

QRコードにはどのくらいのコントラスト比が必要ですか?

WCAGの非テキストコントラストの規則の下では、暗いモジュールと明るい背景の間のコントラスト比は少なくとも3:1が必要であり、実務上はそれ以上が求められます。コンプライアンス上の下限では、スキャナーが必要とする余白までは保証されないためです。明るい背景に暗いパターンを保ち、写真の背景は避け、デザイン上の効果のためにパターンを反転させることは絶対にしないでください。

欧州アクセシビリティ法はQRコードに適用されますか?

適用されるのはコードの背後にあるサービスです。指令(EU)2019/882は、eコマース、銀行、交通、電子書籍などの消費者向けサービスを対象としており、2025年6月28日から適用されています。コードがメニュー、チケット、またはチェックアウトを開くものであれば、アクセシビリティの義務はその印刷された正方形ではなく、そのページに帰属します。

印刷フォールバックはどのようにすべきですか?

短く、小文字で、声に出して読んだり手で書き写したりしても曖昧にならないものにしてください。印刷で混同しやすい文字は避け、パスは数文字に抑え、拡大鏡を使う人でも書き写せる大きさで組んでください。ブランド化された短縮ドメインはここで役立ちます。読み手がこれから訪れる相手を一目で判断できるからです。

NFCはQRコードの良い代替手段ですか?

代替手段というより、有用な補完手段です。タップは狙いを定める問題を完全に回避できるため、弱視の人や細かい運動制御が難しい人に役立ちますが、対応する端末と物理的なタグが必要です。印刷物における最も包摂的な組み合わせは、コードと、予算が許せばタグ、そしてその両方の下に記載されたURLです。

Elidoを試す

URLを貼り付けて短縮リンクを取得

登録不要。リンクは30日間有効。永久に保存するには登録してください。

Free、登録不要 · 1日あたり2件

Elidoを試す

EUホスティングのURL短縮サービス。カスタムドメイン、詳細な分析、オープンAPI付き。無料プラン - クレジットカード不要。

タグ
qr code accessibility
wcag
european accessibility act
alt text
non-text contrast
short url fallback

続きを読む