ウェブサイトの情報や機能の利用しやすさを意味するウェブアクセシビリティですが、様々な定められたものがある中今回はJIS規格として制定されている四つの原則を紹介します。
さまざまな利用者が、さまざまなデバイスを使い、さまざまな状況でウェブを使うようになった今、あらゆるウェブコンテンツにとって、ウェブアクセシビリティは必要不可欠な品質と言えます。
JIS (JIS X 8341-3) とは
JIS X 8341-3は、日本工業規格（JIS）の一部であり、ウェブコンテンツのアクセシビリティに関するガイドラインを提供しています。この規格は、高齢者や障害を持つ人々を含むすべての人々がウェブコンテンツを利用しやすくするための基準を示しています。
ウェブアクセシビリティの四つの原則
ウェブコンテンツJIS (JIS X 8341-3) は、ウェブアクセシビリティの基準を定めています。
この基準に従って、ウェブコンテンツは以下の四つの原則に基づいて評価されます。
知覚可能 (Perceivable)
説明: 情報やユーザーインターフェースコンポーネントが、ユーザーによって知覚されなければなりません。
具体例: 画像に対する代替テキストの提供、音声のキャプション提供。
実装例
<img src="image.jpg" alt="代替テキスト">
<video controls>
<source src="movie.mp4" type="video/mp4">
<track src="captions.vtt" kind="captions" srclang="ja" label="日本語キャプション">
</video>代替テキスト:
- 画像に対して
alt属性を使用することで、視覚障害者がスクリーンリーダーを使用して画像の内容を理解できるようになります。 <img>タグにalt属性を追加することが重要です。
キャプション:
- 動画にキャプションを提供することで、聴覚障害者が音声情報を理解できるようになります。
<track>タグを使用してキャプションファイルを提供します。実際には、キャプションが正しく表示されるか確認する必要があります。
操作可能 (Operable)
説明: ユーザーインターフェースコンポーネントとナビゲーションが操作可能でなければなりません。
具体例: キーボード操作のサポート、十分な時間制限の提供。
実装例
<button>クリック</button>
<p>セッションタイムアウトまで残り<span id="timer">10</span>分です。</p>キーボード操作:
- 全ての操作がキーボードで行えるようにすることが重要です。
- 例えば、
<button>要素を使用することで、キーボードユーザーも操作できます。
時間制限:
- ユーザーがセッションの時間制限に気づくように表示することが重要です。これは、特に認知障害を持つユーザーにとって有益です。
- タイマーが正しく動作しているか確認する必要があります。
理解可能 (Understandable)
説明: 情報及びユーザーインターフェースの操作が理解可能でなければなりません。
具体例: 明確で一貫性のあるナビゲーション、予測可能な動作。
実装例
<nav>
<ul>
<li><a href="#home">ホーム</a></li>
<li><a href="#about">概要</a></li>
<li><a href="#contact">お問い合わせ</a></li>
</ul>
</nav>
<button onclick="submitForm()">送信</button>一貫性のあるナビゲーション:
- ウェブサイト内のすべてのページで同じナビゲーション構造を使用することで、ユーザーがサイトを容易に移動できます。
- メニューがすべてのページで同じ場所にあるか確認します。
予測可能な動作:
- ボタンやリンクの動作が予測可能であることが重要です。
- 例えば、
送信ボタンを押すとフォームが送信されると期待されます。動作が予測どおりに機能するか確認します。
堅ろう (Robust)
説明: コンテンツは、将来の技術を含む様々なユーザーエージェントに対して十分に堅ろうでなければなりません。
具体例: 標準に準拠したコードの使用、支援技術の互換性。
実装例
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>アクセシビリティ対応サイト</title>
</head>
<body>
<h1>ウェブアクセシビリティ</h1>
</body>
</html>標準に準拠したコード:
- HTML5の標準に従ったコーディングを行うことで、将来のブラウザや支援技術に対応することができます。
<!DOCTYPE html>宣言を使用してHTML5文書であることを示します。
支援技術の互換性:
- スクリーンリーダーや他の支援技術が正しくコンテンツを解釈できるように、適切なタグと属性を使用します。
- 実際には、支援技術でコンテンツが正しく読み上げられるか確認します。
まとめ
ウェブコンテンツJIS (JIS X 8341-3) におけるウェブアクセシビリティの四つの原則は、知覚可能、操作可能、理解可能、及び堅ろうです。これらの原則に従ってウェブコンテンツを設計・実装することで、より多くのユーザーにとってアクセスしやすいウェブサイトを提供することができます。
また、ウェブデザイン技能検定を受けるにあたっては特に、高齢者や障害を持つ人々を含むすべての人々がウェブコンテンツを利用しやすくするために制定されたウェブアクセシビリティということを覚えておくと良さそうです。
