ウェブアクセシビリティ簡易チェックリスト

ウェブアクセシビリティを確保・向上させるための簡易チェックリストです。このリストに記載されている項目を満たすと、おおよそSmartHRのウェブアクセシビリティ方針に掲げた品質を達成できます。 チェックする内容によっては例外があることがあります。参考に記載したリンクも参照してください。

代替テキスト

  • 画像に代替テキストが付与されている
  • 装飾目的の画像が無視できるようになっている

参考

動画・音声

  • 動画の音声に字幕が付与されている
  • 動画の内容を解説した音声、またはコンテンツがあるか
  • 音声や動画が自動で再生される場合、一時停止できるか
  • 画面内に1秒に3回以上の点滅や閃光を起こすものがない

参考

マークアップ

  • 表が<table>でマークアップされている
  • 見出しが <h1> ~ <h6>でマークアップされている
  • リストが <ul><ol><dl>でマークアップされている
  • 見た目の順番とHTMLの順番があっている
  • 空白文字を用いてレイアウトをしていない
  • 同じ id を持つ要素がページ内に複数存在しない

参考

見やすさ、聞きやすさ、区別しやすさ

  • 画面を200%拡大、または文字サイズを2倍に変更しても情報が取得できる
  • 背景色と文字色のコントラスト比が 4.5:1 (大きな文字:18px以上は 3:1)以上ある
  • 色や、形、音、レイアウト情報のみでコンテンツを説明していない

参考

操作しやすさ

  • キーボードで操作可能
    • キーボードで選択可能(タブ移動できること)
    • キーボードで実行可能(Enter や Space などで実行できること)
    • キーボードで操作していることがわかる(フォーカス状態が見えること)
  • キーボード操作の順序が見た目の順序とあっている
  • コンテンツに制限時間がかけられていない(必須の場合は除く)

参考

ナビゲーション

  • ページの言語が <html> に記載されている
  • ページのタイトルがページの内容を表している
  • ページの主要コンテンツに見出しが付与されている
  • リンクのテキストからリンク先が判別できる

参考

フォーム

  • 入力する内容や、操作がラベルとして表示されている
  • フォームパーツにアクセシブルネームがある
  • エラーの発生とエラーの内容が特定できる
  • 入力欄や選択肢を選択、または入力したときに大きな変化を起こさない

参考