こんにちは！
Co-Co Life調査部を運営するNPO施無畏・代表理事の遠藤です。
この記事はCo-Co Life調査部が「ウェブアクセシビリティ診断」サービスを開始するまでの過程をまとめたものです。
正直、開始までの過程は「分からないこと」や「判断難しい」ことの連続。
60歳を前にして、そんなにドタバタすることもなくなったのですが、久しぶりに自分の経験値が乏しいサービスを立ち上げるということで苦労しました。
「血風録」というタイトルでサービス開始までの過程を記事にします。まさに新選組のような怒涛の何カ月かだったもんで。
この血風録が、新たにウェブアクセシビリティに取り組む方のヒントになれば幸いです。
ウェブアクセシビリティって何だ？
きっかけは、昨年（2023年）8月の1本のメール。
わたしがコンサルティングをしているT社からも相談。
「得意先からこのメールのような問い合わせがきたのですが、これって遠藤さんところで対応可能でしょうか」
来年４月に「障害者差別解消法」の改正法が施行され支援が必要な方への配慮が義務化されます。
それに伴い、弊社のウェブサイトもWCAG2.0 AAへの改修を促進していきますが、
まずは社内デジタル関係者に勉強会実施を予定しています。
御社内で、ご指導いただける方がいらっしゃいましたら、
下記のような内容でご解説いただけるかご確認お願いします。
・来年、施行による状況説明：ウェブの環境整備、ウェブアクセスシビリティに求められるもの
・WCAG 2.0のAAの対応範囲の説明
・ウェブ改修～検証までの実行プロセス
・限られた予算内での改修項目の優先順位や目安、最低限どこを達成すればよしとするか
・改修内容事例
・弊社サイトをご確認いただき、サンプルとして改修例
ご検討宜しくお願いします。
目が点になった。「ウェブアクセシビリティって？」「WCAG2.0 AAって何だ」状態。
障がい者のことで知見ある団体として、問い合わせいただいたのが、この時点ではまったく意味が分からなかった。
が、すぐにギブアップするのも何なので、「ウェブアクセシビリティ」や「WCAG2.0 AA」で検索して調べてみた。もしかすると、急こしらえの知識でも何ともなるかもと甘い期待をいだきながら。
しかーし、付け焼き刃で対応できる内容ではなかった！対応できません返事。。
障がい者にコミットしている団体として当然やらなければ
残念な結果で返事した2か月後の10月。同様なウェブアクセシビリティがらみの問い合わせを別企業からいただく。
再びウェブアクセシビリティに対して、様々な角度から検索。情報集めする中で、来年（2024年4月）の障害者差別解消法改正に伴う「合理的配慮の民間企業への義務化」の流れのなかで、今は民間企業でウェブアクセシビリティ対応しているサイトは少数だが対応する流れはくるんじゃないかと。
昔、個人情報保護法が施行されたとき、こんな儲からなくてコストばかりかかること民間企業がやるのかと懐疑的に思っていたが、規模に関わらず、どの企業も対応した。あの流れがウェブアクセシビリティにもくるのではと。法令遵守という観点では同じだから。
ここで決心。障がい者にコミットしている団体としては、当然やらなければならないと。
何をやるかというと、
１）ウェブアクセシビリティに対する知識のアップ
２）自団体で運営している２サイト（Co-Co Life女子部とCo-Co Life調査部）のアクセシビリティ対応
３）ウェブアクセシビリティ関連サービス開始
以上３点。実は３）に関しては目論見があった。ウェブアクセシビリティ診断においては、リアルユーザーテストが強みになるのではと。我々の団体は約2,500名の様々な障がいの方とつながっている。この2,500名が診断サービスで活躍できるのではと。 同じように障がい当事者社員を多数かかえ、新しい事業を模索しているT社を巻き込んで、ウェブアクセシビリティへの本格参入を開始する。
意外と分かりやすかったデジタル庁の導入ガイドブック
まずはやることの中で、当然「１)ウェブアクセシビリティに対する知識のアップ」に着手。参考にしたのはデジタル庁が発行している「ウェブアクセシビリティ導入ガイドブック」。
驚きだったのは、このガイドブックが「見やすい」「分かりやすい」。官庁が発行するガイドはだいたいが言葉が難解で分かりずらいが定番。そのなかにあって、ガイドブックのデザインも読みやすく、表現も官庁語でなく平易だ。
これにはからくりがあって、ウェブアクセシビリティの所轄官庁は総務省。総務省の方針を受けたデジタル庁が民間に分かりやすくまとめたというのが真相だった。デジタル庁は民間から入庁した職員で占められているで、このような分かりやすいものができあがった訳である。
３人のプロジェクトでウェブアクセシビリティ対応開始
デジタル庁のウェブアクセシビリティ導入ガイドブックを、わたしと弊団体理事の扇強太。それに、Co-Co Lifeのサイト制作を依頼した過去があるエンジニアのY氏。この３人で徹底的にウェブアクセシビリティ導入ガイドブックを読み込んだ。
我々には早急にウェブアクセシビリティの知識を吸収する必要があった。というのも、コンサルをしているT社にウェブアクセシビリティサービスを共同で行うことを提案していて、T社役員の了解がとれていた。先行して知識を身につけて、T社社員向けの勉強会を実施することにしていたのだ。
ここは大変苦労した。デジタル庁の導入ガイドブックは分かりやすいのだが、ではウェブアクセシビリティ診断サービスにまでブレイクダウンしようとすると、エンジニアのY氏でも理解できない専門用語の壁にぶちあった。 そもそもこのウェブアクセシビリティは基本的に自主判断で、これで大丈夫というお墨付きを与える機関が存在しない。総務省はJIS基準の診断表までは公開しているが、その具体的な診断プロセスなどには関与しないという方針だ。こんな状況なので、具体的に不明なことにぶちあったら、それに対して質問する先がない。基本的にはすべて自前で具体的な部分はクリアしないといけない。
JIS X 8341-3:2016 達成基準 早見表読み解きには大苦労
特に我々がクリアできず苦労した点が２点。
１）ウェブアクセシビリティ基盤委員会（WAIC）が提供しているJIS X 8341-3:2016 達成基準 早見表の中に、具体的に何をチェックすればいいか分からないものがある
→例えば、
・4.1.1 構文解析の達成基準 「HTMLの文法に沿ったマークアップを行う」
・4.1.2 名前(name)，役割(role)及び値(value)の達成基準 「HTMLで表現できるUIは独自に作らない。カルーセルやタブなどHTMLにないUIを作るときはWAI-ARIAを使って作る」
２）チェッカーで引っかかったもので、どこの不具合が理解できないものがある
→例えば以下のような指摘、
・「ページのすべてのコンテンツがlandmarkに含まれていなければなりません」
・「<dt>および<dd>要素が<dl>に含まれていなければなりません」
３人でオンラインミーティングをして、お互いが吸収した知識をシェアしあったりしたが、解決しない問題もある。無理承知でデジタル庁や総務省に電話問い合わせや、メール問い合わせをしたが、やはり具体的な部分はノータッチ方針だ。
8年前の基準でいいのか？
JIS X 8341-3:2016 達成基準理解をすすめているうちにどうしても気になるのが、８年前に制定された基準であること。
そもそも、JIS X 8341-3:2016は国際基準のWCAG2.0をベースにしているが、WCAGのほうはその後、2.1→2.2とアップデートされている。JISのほうはアップデートされないままなのだが、リアルユーザーに近い我々として「これでいいのか」と思うことがあり。。JIS X 8341-3:2016では、スマホを接触デバイスとして、ターゲットにしていない。あくまで、PCによる接触想定なのだ。が、現実的に我々の近くにいる視覚障がい者はスマホでアクセスしているわけで。。
JIS X 8341-3:2016を達成したからと言って、本当の意味でのウェブアクセシビリティを確保したと言えるのか。
ただ、この状況は逆に我々に有利とも言える。リアルユーザーテストを売りにする予定の、我々のウェブアクセシビリティ診断サービスは一歩先をゆくサービスとなることができる。
いよいよCo-Co Life調査部のサイトをウェブアクセシビリティ対応に改修
ウェブアクセシビリティの勉強と並行して、自団体サイトの改修に着手するフェーズに。とこでCo-Co Lifeでは、「Co-Co Life☆女子部公式サイト」と「Co-Co Life調査部」という２つのサイトを運営している。
まず、着手したのが調査部のほうのサイト。理由は調査部サイトのほうが圧倒的にコンテンツ数が少ないからだ。勉強をすすめる中で、サイト掲出画像の「代替テキスト（＝オルトタグ）」がウェブアクセシビリティでは重要と分かった。
代替テキストとは画像の内容説明テキスト。視覚障がい者が読み上げアプリを使ってサイトにアクセスした場合、この代替テキストを読み上げて、ユーザーは画像の内容を理解する。
恥ずかしながら、我々には今までその意識がなく、サイトに掲出している画像について、基本的に代替テキストを入れていない。
Co-Co Life☆女子部公式サイトには、13年分で約600本の記事を収納している。仮に１記事平均画像を５点使用しているとすると、3,000点近い画像の代替テキストを入れることになる。これは時間がかかる。まずは記事数が少ない調査部サイトから改修となった。
WordPress用アクセシビリティプラグイン「UserWay」導入
記事数の少ない調査部サイトとはいえ、まったくウェブアクセシビリティを考慮せず構築してきたので、改修箇所は多岐にわたった。あまりにも多い。。
そこで、エンジニアのY氏が見つけてきたのが、Wordpress用のアクセシビリティプラグイン「UserWay」。こちらをインストールすると、
・テキスト拡大
・画面の白黒反転
・アニメーション停止
など、12種類ほどのアクセシビリティメニューを、使うときだけ追加実装できる。
スクラッチでなく、WordpressのようなメジャーなCMSでサイト構築していると、こんなとき便利だと再実感した。追加でほしい機能を誰かがプラグインで開発している。スクラッチで修正するとしたら、どれだけ工数がかかるか。
サイトマップ新設にリストタグを使いページ作り直し
「UserWay」だけでは解決できないアクセシビリティに関しては、エンジニアのY氏中心に手動による調整を行った。
１）サイトマップ新設（サイトの構造が分かりやすくなる）
２）リストタグを使いページ作り直し
→・＜中黒＞や、スペースを使って何となく体裁を整えていた
３）タイトルタグの再設定
→h1-h2-h3-h4と規則正しくタイトルが設定されておらず、h1からいきなりh3などタグ抜けが散見された
４）サイトの配色変更（＝コントラストアップ）
５）リンク先表現の具体化
→「詳しくはくちら」などのテキストリンクは止め、「○○についての実例はこちらをご覧ください」などの表現にするとともにコントラストの強いリンクボタンを設置
どうしても改修できないタブによる遷移とフォーカス
プラグイン「UserWay」導入と、手動による調整で、かなりウェブアクセシビリティ的にさまになってきたが、そうしても実現できないのが、タブによる遷移とフォーカス。
これはPCにおいてマウスを使用しないで、サイトアクセスの操作ができることを意味する（障がいによってマウスを使えない人がいるため）
Co-Co Life調査部のサイトではタブキーを使っても、どのようにメニューが遷移しているか分からず、今どのメニューをフォーカスしているかも分からない状態だった。
エンジニアのY氏がかなり調べて対応を検討したが、有効な解決策は見いだせなかった。
WordPressテーマの入れ替えへ
結局、タブキーの動きはWordpressのテーマに依存していて、どうも今使っているテーマでは無理っぽいことが分かってきた。
そうして選択したのが、Wordpressテーマの入れ替え。タブキーに対応したテーマに変更して、コンテンツを移植する方法。
なるべく現在のサイトとデザイン的に似ているテーマをY氏に探してもらい、新テーマのインストールとコンテンツ移植をお願いした。 結果このテーマ入れ替えで、Co-Co Life調査部最大のウエブアクセシビリティ課題「キーボード操作だけでアクセス」をクリアした。
2024年4月合理的配慮の民間義務化
やってきました2024年4月1日の「障害者差別解消法改正」に伴う合理的配慮の民間義務化。
我々もこのタイミングに向けて以下の3点を目標にすすめてきた。
１）ウェブアクセシビリティに対する知識のアップ
２）自団体で運営している２サイト（Co-Co Life女子部とCo-Co Life調査部）のアクセシビリティ対応
３）ウェブアクセシビリティ関連サービス開始
Co-Co Life調査部のウェブアクセシビリティ対応することで、相当の知見を得ることができ、３）のウェブアクセシビリティ関連サービスのカットオーバーまで実現した。
https://research.co-co.ne.jp/webaccessibility-diagnosis/ ただし、２）のCo-Co Life女子部公式サイトのほうは一部着手にとどまっている。
障がい当事者とのつながり再認識
本記事タイトルに「血風録」というタイトルをつけるくらい苦労した、ウェブアクセシビリティ診断サービスをカットオーバーして３カ月。やはり、４月１日の障害者差別解消法改正の影響かアクセシビリティがらみの問い合わせをたくさんいただいている。
そんななか再認識したのが、障がい当事者とのつながりが我々の強みであること。ウェブアクセシビリティ診断では視覚障がいの方を中心に検証をお願いした。検証を通じて、障がい当事者の方には検証料としてギャラを提供でき、我々は検証を通じてアクセシビリティ知見を得させていただいている。正にウインウインの関係ができていると実感している。
アクセシビリティ検証は障がい当事者の意見を商品やサービスに反映させ、商品・サービスがユニバーサル化することで、ダイバーシティ＆インクルージョン社会につながっていくと信じている。更に障がい当事者とのつながりを深め、意見発露の場面を増やしていきたい！
▶Co-Co Life調査部のウェブアクセシビリティ診断サービス
https://research.co-co.ne.jp/webaccessibility-diagnosis/
▶ウェブアクセシビリティ検証員になるには
https://co-co.ne.jp/?page_id=19473
デジタル庁ウェブアクセシビリティ導入ガイドブック
https://www.digital.go.jp/resources/introduction-to-web-accessibility-guidebook
ウェブアクセシビリティ基盤委員会 JIS X 8341-3:2016 達成基準 早見表（レベルA & AA）
https://waic.jp/resource/jis-x-8341-3-2016/