こんにちは、freeeのアクセシビリティー・ガイドラインおじさんの中根です。 確定申告の時期になりました。freeeで働きながら個人事業も細々とやっているので、毎年この時期は気が重いです。
さて、今回もfreeeアクセシビリティー・ガイドラインの更新情報をお届けします。
「マークアップ全般」カテゴリーの見直し
今回の内容的な変更は、これまで「マークアップ全般」という名前だったカテゴリーの全般的な見直しです。
まず、そもそも今やモバイル・アプリについても対象にしようという方向で情報を増やしている中で、「マークアップ全般」というのはどうなのか、というのがあって、「マークアップと実装」に改名しました。
というのは大した話ではなくて、以下見直した内容について簡単に紹介します。
スタティックなコンテンツに関するガイドライン
まず、
[MUST]文書構造を適切にマークアップする
文書構造などのセマンティクスを表す適切なマークアップをする。
というガイドラインについて、以下のように変更しました：
静的なテキスト・コンテンツは、文書構造などのセマンティクスを適切に表現するHTMLの要素やコンポーネントで実装する。
この変更の意図は、
- このガイドラインの対象が主にスタティックなコンテンツであることを明確にする
- 「適切なマークアップ」について、多少具体的な表現にする
という点にあります。
「適切なマークアップ」について、「HTMLの要素やコンポーネント」とやや分かりづらい表現になっているのは、HTMLを直接記述する場合に加えて、デザイン・システムやその他のフレームワークを使って開発しているような場合、さらにはモバイル・アプリについてカバーしたかったためです。
インタラクティブなUIコンポーネントに関するガイドライン
今回の変更で、新たに以下のガイドラインを追加しました：
[MUST]対話的なUIコンポーネントの実装
リンクやボタン、フォーム・コントロールなど、ユーザーの操作を受け付けるUIコンポーネントは、なるべくHTMLの適切な要素、または使用している開発フレームワークの標準的なコンポーネントを用いて実装する。
これは、インタラクティブなUIコンポーネントなどがdiv要素やspan要素だけで実装され、スクリーン・リーダーなどで適切に扱えないという問題について、ガイドラインに反していることが明確ではないという指摘があったことをきっかけに追加したものです。
今回の変更前にも、UIコンポーネントのアクセシビリティー確保を意図して以下のガイドラインを設けていました：
[MUST]コンポーネントをアクセシブルにする
標準的なHTMLとは違う挙動をするコンポーネントを使用する場合、以下を満たす。
- 支援技術を含むユーザー・エージェントが取得できる形で、適切にAccessibleNameとroleを定義する。
- 支援技術を含むユーザー・エージェントが、コンポーネントの状態、プロパティー、ユーザーが設定可能な値を設定でき、これらの変更を認知できるようにする。
このガイドラインでインタラクティブなUIコンポーネントについてはカバーできていると考えていました。 しかし、以下のような比較的シンプルな問題を防ぐために、より明確なガイドラインが必要だろうと考えました：
- リンクがa要素で実装されていない
- リンクがhref属性がないa要素で実装されている
- ボタンがbutton要素で実装されていない
- 各種フォーム・コントロールが、input要素などによる標準的な実装になっていない
また、この「コンポーネントをアクセシブルにする」を以下のように変更しました：
ユーザーの操作を受け付けるUIコンポーネントは、以下を満たす実装をする。 [後略]
基本的にインタラクティブなUIコンポーネントを対象としたものであることを明確にする意図の変更です。
YAMLファイルのスキーマ定義の追加
ガイドラインとチェック内容を記述しているYAMLファイルのスキーマを、JSON Schemaで記述して追加しました。 もしガイドラインやチェック内容の変更を提案していただけるような場合には便利かもしれません。
例えばVisual Studio Codeで編集する場合、以下のような設定をワークスペースの設定に追加することで、入力時の自動補完やYAMLのバリデーションが可能になります：
"yaml.schemas": {
"data/json/schema/guideline.json": "data/yaml/gl/**/*.yaml",
"data/json/schema/check.json": "data/yaml/checks/**/*.yaml"
}
ちょっとお知らせ
以前の投稿でアクセシビリティー研修の資料の公開について紹介しましたが、このうち全職種向けに実施している「アクセシビリティー研修 for All freeers」の動画を公開しました。
今後この他の研修の動画もfreeeのアクセシビリティーに関連する動画を配信するYouTubeチャンネルで公開する予定です。ご期待ください。
引き続きご意見などお待ちしています
今回の変更についても、それ以外の部分についても、ご意見やお気付きの点など、GitHubリポジトリーのIssuesやPull Requestsでお知らせください。
