1. 基本方針
時間計算は、開始時刻・終了時刻・休憩時間から経過時間を求める時間差計算ツールを、できるだけ多くの方が利用できるようにすることを目指しています。視覚、聴覚、身体、認知などの特性にかかわらず、必要な情報に到達しやすく、操作しやすい設計を継続的に改善します。
本サイトは、JIS X 8341-3:2016 および WCAG 2.1 の考え方を参考にしながら、アクセシビリティへの配慮を設計・実装・運用に反映します。また、対応状況、課題、改善計画をできるだけ明確に公開し、利用者に対して透明性のある情報提供を行います。
2. 適用範囲
本方針は、https://jikandentaku.com/ 配下で公開しているページおよび、時間差計算を中心とした各種時間計算機能に適用します。特に、ホームページ上の主要ツールである開始時刻・終了時刻・休憩時間を用いた経過時間の計算機能を対象としています。
ただし、第三者が提供する外部コンテンツや埋め込み要素(例:広告、外部配信ウィジェット、iframe 内コンテンツ等)は、当サイトで制御できる範囲に限り対応し、提供元の仕様に依存する部分は適用外となる場合があります。
- 版:v2
- 最終更新:
3. 適合目標
- 目標:JIS X 8341-3:2016 に基づく達成等級 AA への準拠を目指します。
- 参照基準:WCAG 2.1 の考え方を参考に、主要な利用フローの改善を継続します。
- 見直し:主要機能の変更や画面改修の際に、内容を定期的に更新します。
すべてのページ・すべての環境で完全な同一体験を保証するものではありませんが、少なくとも主要な情報取得と計算操作において、支援技術やキーボード操作でも利用しやすい状態を目標としています。
4. 設計ポリシー
- 文書構造:見出し階層(h1→h2→h3)と、
<header>、<main>、<nav>、<footer>などのランドマークを用いて構造を明確にします。 - フォームの関連付け:入力欄には視覚的ラベルだけでなく、適切な
<label>や補足説明を関連付け、スクリーンリーダー利用時にも意味が伝わるようにします。 - エラーの明確化:入力不備や不正な値がある場合は、原因が分かる文言で案内し、必要に応じて
aria-describedbyやrole="alert"を活用します。 - コントラスト:本文やUI部品が背景と十分に区別できるよう配色を調整し、視認性の確保に努めます。
- フォーカス可視化:キーボード操作時に現在位置が分かるよう、フォーカス表示を維持します。
- キーボード操作:主要機能はマウスを使わずに操作できることを重視し、Tab移動の順序も理解しやすい構成にします。
- 拡大表示・レスポンシブ対応:テキスト拡大やズーム時にも、情報の欠落や過度な横スクロールが起きにくいレイアウトを目指します。
- 動きの抑制:不要な点滅や強いアニメーションを避け、利用者の負担を減らします。
- 結果通知:計算結果の更新は、必要に応じて
aria-live="polite"を利用し、画面を見ていない場合でも変化が伝わるようにします。 - 言語情報:ページ全体の主要言語を
lang="ja"で示し、日本語ページとして正しく解釈されるようにします。
5. 電卓機能のアクセシビリティ
ホームページの主要ツールは、開始時刻、終了時刻、必要に応じて休憩時間を入力し、経過時間を求める時間差計算機能です。この利用フローに合わせ、以下の点に配慮しています。
- ラベル付き入力欄:開始時刻、終了時刻、休憩時間はそれぞれ意味が分かる名称で区別し、支援技術でも目的を理解しやすくします。
- 翌日またぎへの対応:終了時刻が開始時刻より早い場合は、翌日にまたがる計算として扱う仕様を明示し、利用者が結果の意味を理解しやすいようにします。
- 休憩時間の任意入力:休憩時間は必要な場合のみ入力できるようにし、未入力時の扱いが分かる説明を添えます。
- 結果の表示切替:経過時間は用途に応じて、H:MM:SS、時間、分、秒などの形式へ切り替えられるよう配慮し、切替操作の意味が伝わるようにします。
- aria-live による通知:計算結果が更新された際、スクリーンリーダー利用者にも変化が伝わるよう、ライブリージョンを用いた通知を行います。
- 明確なエラーメッセージ:未入力、無効な時刻、範囲外の値などがある場合は、何を修正すべきかを分かりやすく案内します。
- 視覚的な状態変化:エラー、入力完了、結果表示などの状態は、色だけに頼らず、文言や配置でも伝わるようにします。
- 連続操作への配慮:入力から結果確認までの流れを単純化し、キーボードのみでも繰り返し使いやすい構成を目指します。
6. キーボード操作
| 操作 | キー | 説明 |
|---|---|---|
| 入力欄間の移動 | Tab / Shift + Tab | 開始時刻、終了時刻、休憩時間、表示切替、関連リンクの順に移動できます。 |
| 計算の実行 | Enter | フォームの構成によっては、入力後に計算を実行または結果を更新します。 |
| 表示形式の切替 | Tab → Enter または Space | フォーカスした表示切替ボタンを操作し、H:MM:SS、時間、分、秒などの表示を変更できます。 |
| 選択部品の操作 | 矢印キー | ラジオボタンやタブ形式のUIがある場合、選択肢の移動に利用できるよう配慮します。 |
| ページ先頭のスキップリンク | Tab | ページ冒頭で「本文へスキップ」に移動し、主要コンテンツへ直接進めます。 |
実際のキー操作は、利用中のブラウザ、OS、支援技術の組み合わせにより一部異なる場合があります。サイト独自の複雑なショートカットに依存せず、標準的なフォーム操作とキーボード移動で利用できることを重視しています。
7. 試験方法
アクセシビリティ対応の確認は、自動検査と手動検査を組み合わせて実施します。主に、時間差計算の主要フローである「入力」「エラー確認」「結果取得」「表示切替」が無理なく行えるかを確認します。
- 自動検査:HTML構造、フォーム属性、見出し順序、aria属性、基本的なコントラストなどを確認します。
- キーボード検査:マウスを使わずに入力、計算、表示切替、ページ移動ができるかを確認します。
- スクリーンリーダー検査:入力欄の名称、説明、エラー内容、結果更新の通知が適切に伝わるかを確認します。
- 代表環境:Windows、macOS、iOS、Android の主要ブラウザ環境を中心に確認します。
- 実施タイミング:主要なUI変更、計算ロジック変更、または大きなコンテンツ改修の際に見直します。
試験は継続的改善を前提としており、一度の確認で完了するものではありません。利用者からの報告も改善の重要な情報源として活用します。
8. 既知の課題
- 外部コンテンツ:第三者配信の要素では、フォーカス順や読み上げ挙動を完全には制御できない場合があります。
- 環境差による読み上げの違い:同じ入力欄や結果通知でも、ブラウザやスクリーンリーダーの組み合わせにより読み上げ方が異なることがあります。
- 表示切替UIの解釈差:ボタン群や切替UIは、支援技術によって案内内容が多少異なる場合があります。
今後も、主要な利用フローで支障が出にくいよう改善を進め、必要に応じて実装や説明文を見直します。
9. お問い合わせ
アクセシビリティに関するご意見、ご要望、不具合のご報告、代替手段のご相談などがありましたら、以下よりご連絡ください。
- お問い合わせフォーム:/contact
- メール:support@jikandentaku.com
内容を確認のうえ、可能な範囲で改善や代替案の検討を行います。