このサイトのアクセシビリティ

このページでは、いまお読みのサイトであるsurea11y.devのアクセシビリティについて、目指している水準、テストの方法、既知の不足点、問題の報告先をご紹介します。ご自身のサイトをスキャンして返ってくるアクセシビリティの検出結果は対象外で、そちらは適合性で扱っています。

適合目標

このサイトはWCAG 2.2のレベルAAへの適合を目指しています。SureA11yのすべてのプロダクトに適用されるのと同じブランドルールに従っています。色だけを手がかりにすることはありません（状態やアクティブ状態の表示には、必ず色と別の手がかり、つまり下線、記号、言葉のいずれかを組み合わせます）。すべてのインタラクティブなコントロールには目に見えるフォーカスのアウトラインと最小44pxのターゲットがあり、純粋な装飾ではないアイコンにはすべてテキストの代替があります。

このサイトのテスト方法

このサイトは@surea11y/coreを開発しているのと同じチームが作っています。そのサイトで自分たちのエンジンによるテストを省いては筋が通りません。変更のたびに@surea11y/core自体で、実際のブラウザー（@surea11y/playwrightを介したChromium）を使い、幅375pxと1280pxでWCAG 2.2 AAに対してスキャンし、そのスキャンがfailを報告している間はデプロイしません。実際の問題はすべて、言い訳で済ませずに修正しています。ただし、このスキャンにもそれ自体の制限があります（既知の制限事項を参照）。見えるのは各ページの1つの状態だけで、幅もその2つだけです。また、判断できないものは、人が確認するようcantTellとして報告します。

自動スキャンはあくまで最低ラインであり、上限ではありません。そのため、このサイトのチェックは自動スキャンだけではありません。変更は手動のアクセシビリティテストの対象にもなります。キーボードだけでの操作、スクリーンリーダーでの確認、そして自動ツールではまったく判断できない事柄の確認（見出しが続く内容を実際に説明しているか、フォーカス順序が見た目の順序と一致しているか、操作の後にだけ現れるコンテンツにも到達できるか）です。「自動ツールですべてがわかるわけではない」という、このプロジェクト全体の前提と同じ立場です。

既知の不足点

• 「このページの内容」の目次は、現在のスクロール位置をハイライトしません。それにはクライアントサイドのJavaScriptが必要ですが、このサイトは設計上JavaScriptを一切配信していません。リンク自体はキーボードでもスクリーンリーダーでも通常どおり機能します。欠けているのは、スクロール中の「現在地」のハイライトだけです。
• サイトのほかの部分は明るい背景ですが、コードサンプルは意図的に暗い背景で表示しています。このサイトのデザインシステムに記載している「ターミナルはターミナル」という例外です。この配色のコントラストが読みにくい場合でも、コードサンプルのテキストはすべてプレーンテキストとして選択・コピーできます。

問題の報告

このサイトで、キーボード、スクリーンリーダー、その他の支援技術で使いにくい箇所があれば、GitHubでissueを作成してください。ページのURL、しようとしていたこと、実際に起きたことを書き添えてください。エンジン自体のバグを報告してもらうときに欲しいのと同じ程度の詳しさです。