Yutteee

アクセシビリティ検証結果

2024年8月5日時点での、本サイトのアクセシビリティの検証結果を示しています。検証に当たってWCAG2.1を参考にしました。

間違いもあるかと思いますので、気付いた方はお知らせいただけると幸いです。

1. 知覚可能

1.1 テキストによる代替

No. 達成基準 適合レベル 結果 注記
1.1.1 非テキストコンテンツ A 適合

1.2 時間依存メディア

該当コンテンツがないため省略します。

1.3 適応可能

No. 達成基準 適合レベル 結果 注記
1.3.1 情報および関係性 A 適合
1.3.2 意味のあるシーケンス A 適合
1.3.3 感覚的な特徴 A 適合
1.3.4 表示の向き AA 適合
1.3.5 入力目的の特定 AA 適合 該当コンテンツなし
1.3.6 目的の特定 AAA 適合

1.4 判別可能

テキストのサイズ変更に適合できる様にするのが大変でした。文字サイズを200%拡大してもレイアウトが崩れない様にするのは結構な確認作業が必要なので、デザインの段階から気を付けるべきだなと思いました。

No. 達成基準 適合レベル 結果 注記
1.4.1 色の使用 A 適合
1.4.2 音声の制御 A 適合 該当コンテンツなし
1.4.3 コントラスト(最低限) AA 適合
1.4.4 テキストのサイズ変更 AA 適合
1.4.5 文字画像 AA 適合 該当コンテンツなし
1.4.6 コントラスト(高度) AAA 適合
1.4.7 小さな背景音、または背景音なし AAA 適合 該当コンテンツなし
1.4.8 視覚的提示 AAA 適合
1.4.9 文字画像(例外なし) AAA 適合
1.4.10 リフロー AA 適合
1.4.11 非テキストのコントラスト AA 適合
1.4.12 テキストの間隔 AA 適合
1.4.13 ホバー又はフォーカスによって表示されるコンテンツ AA 適合 該当コンテンツなし

2. 操作可能

2.1 キーボード操作可能

ヘッダー部分でフォーカストラップの実装をしましたが、Astroだと素のJavaScriptを書かないといけないのが大変でした。

No. 達成基準 適合レベル 結果 注記
2.1.1 キーボード A 適合
2.1.2 キーボードトラップなし A 適合
2.1.3 キーボード(例外なし) AAA 適合
2.1.4 文字キーのショートカット A 適合

2.2 十分な時間

No. 達成基準 適合レベル 結果 注記
2.2.1 タイミング調整可能 A 適合 該当コンテンツなし
2.2.2 一時停止、停止、非表示 A 適合
2.2.3 タイミング非依存 AAA 適合 該当コンテンツなし
2.2.4 割り込み AAA 適合 該当コンテンツなし
2.2.5 再認証 AAA 適合 該当コンテンツなし
2.2.6 タイムアウト AAA 適合 該当コンテンツなし

2.3 発作と身体的反応

No. 達成基準 適合レベル 結果 注記
2.3.1 3回の閃光、又は閾値以下 AAA 適合 該当コンテンツなし
2.3.2 3回の閃光 AAA 適合 該当コンテンツなし
2.3.2 インタラクションによるアニメーション AAA 非適合 スクロールによるアニメーションを無効にできない

2.4 ナビゲーション可能

複数の手段の項目で、ユーザーがページを見つけれる様にサイトマップを作りました。しかし、サイトマップはどのくらいの人が使うのか気になりました。他の達成方法も使われるのかどうかわからなかったのでとりあえずサイトマップを作りましたが、本質的な配慮になっているかと言われると微妙な気がします…。

No. 達成基準 適合レベル 結果 注記
2.4.1 ブロックスキップ A 適合
2.4.2 ページタイトル A 適合
2.4.3 フォーカス順序 A 適合
2.4.4 リンクの目的(コンテキスト内) A 適合
2.4.5 複数の手段 AA 適合
2.4.6 見出しおよびラベル AA 適合
2.4.7 フォーカスの可視化 AA 適合
2.4.8 現在位置 AAA 適合
2.4.9 リンクの目的(リンクのみ) AAA 適合
2.4.10 セクション見出し AAA 適合

2.5 入力モダリティ

ポインタ入力のターゲットのサイズで、44×44ピクセル以上と聞くと大きい気がしましたが、実装してみるとちょうど操作しやすいサイズだなと思いました。

No. 達成基準 適合レベル 結果 注記
2.5.1 ポインタのジェスチャ A 適合 該当コンテンツなし
2.5.2 ポインタのキャンセル A 適合 該当コンテンツなし
2.5.3 ラベルを含む名前 A 適合
2.5.4 動きによる起動 A 適合 該当コンテンツなし
2.5.5 ターゲットのサイズ AAA 適合
2.5.6 入力メカニズムの共存 AAA 適合

3. 理解可能

3.1 読み取り可能

AAAの項目の達成が難しいなと思いました。今後達成できる様にしていきたいです。

No. 達成基準 適合レベル 結果 注記
3.1.1 ページの言語 A 適合
3.1.2 一部分の言語 AA 適合
3.1.3 一般的ではない用語 AAA 非適合 ブログなどに一般的ではない用語が含まれるが定義を特定するメカニズムはない
3.1.4 略語 AAA 非適合 ブログなどに略語が含まれるが意味を特定するメカニズムはない
3.1.5 読解レベル AAA 非適合 補足コンテンツなどが存在しない
3.1.6 発音 AAA 非適合 単語の明確な発音を特定するメカニズムが存在しない

3.2 予測可能

No. 達成基準 適合レベル 結果 注記
3.2.1 フォーカス時 A 適合
3.2.2 入力時 A 適合 該当コンテンツなし
3.2.3 一貫したナビゲーション AA 適合
3.2.4 一貫した識別性 AA 適合
3.2.5 要求による変化 AAA 適合 該当コンテンツなし

3.3 入力支援

該当コンテンツがないため省略します。

4. 堅牢

4.1 互換性

No. 達成基準 適合レベル 結果 注記
4.1.1 構文解析 A 適合
4.1.2 名前 (name)・役割 (role)・値 (value) A 適合
4.1.3 ステータスメッセージ AA 適合 該当コンテンツなし

まとめ

検証の結果、本サイトのアクセシビリティはWCAG2.1においてAA準拠といえます。

とはいえ、私についてのページでは拡大鏡を使っているユーザーが画像がテキストと連動してスクロールしていることに気づけないなど、すべての問題を解決できていないと思います。準拠しているかどうかにとらわれず、本質的なアクセシビリティを追求していきたいです。

コメント