[日記]Raindrops テーマとアクセシビリティ

前回WordPress アクセシビリティ という記事でも触れていましたが、



アクセシビリティは、「高齢者・障害者等配慮設計指針-情報通信における機器,ソフトウェア及びサービス」JIS X8341-3:2010 れっきとしたJIS規格ですが、



この規格に準拠するWEBサイトは非常に少ないというのが現状です




Raindropsのアクセシビリティは、アクセシビリティに考慮したサイトを制作しようとする人が、たくさんのカスタマイズを行わないでも制作可能にすることを意図しています。



WordPressに限ったことではありませんが、CMSといったサーバサイドのプログラムが作り出すHTMLは、一般的にアクセシビリティを妨げる問題を持っています。



一つは、CMSは、ナビゲーションリンクを自動的に構築します。この事は、たいていの場合、複数のリンク先への同一のテキストラベルを生成したり、(例えば、続きを読む みたいなリンク)同一リンク先への異なるラベル(例えば、imageをラップしたリンクと、テキストリンク)などが、プログラムの理解を阻んでしまうといった問題です。



Raindropsのアクセシビリティ配慮

  • HTMLで最も特徴的なハイパーリンクリンク要素(a)のラベルができるだけユニークであるようにサポートする事。

(完全なものではありません、同じウィジェットを複数配置などサイトの実装によっては、直ぐに破たんしますが、アクセシビリティ対応を考えている人に、デフォルトの状態が実装の邪魔にならないといった対応範囲です)

  • WordPressが標準で採用している、例えばタグクラウドで、フォントサイズがpt指定されているものを、%指定に変更する
  • テーマは、基本的に%とemをベースとして構成する
  • ベースフォントサイズを、サーバサイドで変更可能とし、フォントサイズが変更されてもレイアウトに影響を与えない

(フォームやサイドバーのウィジェットタイトルで、固定フォントサイズが使用されます。技術的にはページ幅等も相対サイズにすることは可能ですが、全体としてエラスティックレイアウトになるため、ページ幅等の指定にも固定サイズを使っています。)

タブの移動で、スキップリンクが表示でき、フォーカスが当たった部分が明示的であること

  • ベースカラーの設定と自動配色機能によって、前景色と背景色が適切なコントラストを持つこと

  • スキップリンクは、一般的なコンテンツへのスキップリンクだけでなく、ウィジェットへのスキップリンクを自動的に作成し、スクロールすることなしに、サイドバーウィジェットへのアクセスが可能(たぶんこれが、私が初めて、実用的なアクセシビリティ機能を盛り込めたものだと思う、特定の人が便利になるだけでなく、だれにでも便利な機能の実装)


上記の機能を持った、最新版Raindropsは、Github Raindrops 1.233から、ダウンロードできます。





今回、約1か月をかけて、Accessibilityレビューを受けてきましたが、レビューに想像以上の時間を要したこと、一部でアクセシビリティ設定に疑問が投げかけられ、

全体として、否定されたわけではありませんでしたが、レビュアーを困惑させてしまったようなので、

レビューを辞退しましたので、次回のバージョンは、Accessibility Readyタグでは、検索できませんので、あらかじめお知らせします。







疑問が投げかけられた要点



ユニークリンクを補助するために、Raindropsは以下のような非表示要素をリンクラベルに追加していました。

<span class="raindrops_unique_identifier">[Link to %1$s]</span>

この事自体は、アクセシビリティレビューを専門に行うレビュアーから、適正との判定を受けていましたが、

レビュー内アップデートで



<span class="raindrops_unique_identifier" area-hidden="true">[Link to %1$s]</span>


と処理した部分が、CSS非表示かつ、NVDAなどの読み上げツールでも無視される設定は、「誰を補助するための設定なのか?」という指摘を受け、レビュアーも当惑を隠しませんでした。



このため、同意を得るには、更に相当な時間をかける必要を感じ、また、レビュアーを混乱させたため、Accessibility Readyタグを削除して、レビューを辞退することにしました。



この意図については、読み上げツールで繰り返し[link to post id]が読み上げられることは、post idを読み上げても読み上げた内容を人間が直接何かに利用することもできないしむしろ不快になるのではないかという考え方をしたためですが、改めて、少し時間をかけて考えてみたいと思っています。

(レビュアーには、一応、マシーンリーダブルにするための実装で、なんでも読み上げる必要はないんじゃないかと考えている旨は書き残したんですが、、、)



Accessibility Readyタグを有効にできることは、ユーザーが検知可能にするため重要な問題だと考えています。



また、アクセシビリティ配慮に未熟な部分もあるので、改良し、アクセシビリティレビューが承認されるように努力したいと思います。



もちろん、アクセシビリティ レビュアが刺激的なレビューをガンガン行ってくれることも必要なのですが、、、



あれ、反省文になってる。



しかし、外の世界に目を向ければ、jQuery Mobileだって、WAI ARIAだらけだし、Twitterだって、Youtubeだって取り組みは現実のものになっている。


昔のアクセシビリティ引きづりながら、ちんたらやってる場合じゃない。


良いアイディアは、特定の誰かだけではなく、すべての人に「これ、いいね」と思わせるはず


一歩でも前に進もう

TOP