この記事は、ヌーラボブログリレー2024 for Techの4日目の記事です。
ヌーラボのウェブサイト課がこの一年間で取り組んできたアクセシビリティ向上活動についてふり返ります。
なお、当記事は「アクセシビリティカンファレンス福岡 前夜祭」にて発表した「ヌーラボ・ウェブサイト課の一年間の取り組みをふり返る」というLTを再構成してまとめたものです。
当日のスライド資料
アクセシブルな状態でスライドが公開ができていないことをご了承ください。ただし、スライドに記載している情報は当記事内で全て紹介しております。
目次
自己紹介
はじめまして。楠 欣士(Kusunoki Yoshito)と申します。ヌーラボのウェブサイト課という部署でマークアップエンジニア、フロントエンドエンジニアとして働いています。最近、京都から滋賀に引っ越しました。
ヌーラボについて
ヌーラボについて簡単に紹介します。ヌーラボはチームで利用する業務コラボレーションツールを開発、提供している会社です。現在、Backlog、Cacoo、Nulab Passという3つのサービスを提供しています。ブランドメッセージとして「“このチームで一緒に仕事できてよかった”を世界中に生み出していく。」を掲げています。
発表の背景
今回のテーマを「ヌーラボ・ウェブサイト課の一年間の取り組みをふり返る」とした背景を説明します。
昨年のアクセシビリティカンファレンス福岡2023にて、ウェブサイト課の松永がスポンサーセッションを行いました。テーマは「ヌーラボのウェブサイト課におけるアクセシビリティ関連の取り組み」です。当時のウェブサイト課が、どのようにアクセシビリティに取り組んでいるのかを説明する内容でした。
この発表から約一年が経ちました。そこで「この一年間ウェブサイト課は実際に何をしてきたのか？」をふり返ってみたいと思います。「これからもっとアクセシビリティに取り組みたい」という思いを持つ方の参考になれば幸いです。
余談
これは余談ですが、私がヌーラボに入社した大きなきっかけがこの昨年の発表でした。そんな私の実体験から「アクセシビリティは採用に効く」ということを一言アピールしておきます。（N=1なのであくまで参考程度にしてください）
ウェブサイト課って？
ウェブサイト課はウェブサイトの開発・保守・運用を担当している部署です。現在約20サイトを管理しています。
ミッションステートメントの1つ目に「すべての人に等しい情報を」を掲げてアクセシビリティに注力しています。昨年の発表当時からメンバーが3名増えて、現在は計6名です。その6名全員が「アクセシビリティやっていき」の状態です。これは結構すごいことなんじゃないかと思います。
一年間の取り組みを見ていきましょう！
前置きが長くなりましたが、早速一年間の取り組みを見ていきましょう。
①ウェブサイトの改善
ウェブサイトの改善を着々と続けています。具体的な改善内容を挙げていきます。
動き続けるロゴスライダーを廃止
右から左に流れ続ける企業ロゴのスライダーを廃止しました。
改善前のページ
改善後のページ
フォームの必須を表す「＊」を「必須」に変更
フォームの必須項目を表す「＊」を「必須」というテキストに変更しました。
改善前のフォーム
改善後のフォーム
リンク文言を「こちら」から具体的な内容に変更
リンクテキストが「こちら」になっていた箇所をそれぞれ「〇〇のページ」のように具体的な内容を示すテキストに変更しました。
「まずは起票する」を心がけて計60件以上の改善
その他にも
- pxでのサイズ指定をremに変更
- フォーカスインジケータの可視化
- モーダルの実装をdialog要素にアップデート
- axe DevToolsやHTMLバリデータの警告をひたすら解消
などなど、一年間で60件以上の改善を行いました。
すぐに着手できなくても、気がついたらとりあえずBacklogで課題を起票することを心がけています。
②アクセシビリティレポート
先ほど挙げたようなウェブサイトの改善内容を3ヶ月に一度、ブログにまとめて公開しています。これまでに4回リリースしました。ぜひご覧ください。
アクセシビリティレポートは昨年のカンファレンスでの学びがきっかけで始まりました。freeeの伊原さんとShibajukuの柴田さんのセッション（ウェブアクセシビリティ社内教育のすゝめ 〜品質か、営業か〜）の中で、「小さい単位でも改善に取り組んで発信してみよう」という話がありました。これを聞いたメンバーがチームへ共有したことから、アクセシビリティレポートの執筆が始まりました。
レポートを書くにあたっては「ささいなことでも勇気をもって発信し続ける」という姿勢を大事にしています。
③WCAGの読み合わせ会
昨年からウェブサイト課を中心に、各社のアクセシビリティガイドラインの読み合わせ会を続けてきました。そして、今年8月に無事に読み合わせを完走しました。
今年9月からはいよいよWCAG2.1の読み合わせが始まっています。
ここでは
- Aの基準のみに絞って読む
- 「まずは一周」を目標とする
というルールを設定しました。
さらに「WCAGは読みにくい」「とっつきづらい」という声もあったのでWCAGの「読み方」を勉強する会も事前に開催しました。
WCAGの「読み方」勉強会で使用したスライド資料
WCAGの「読み方」勉強会で使用したスライド資料
このように、多くの人が参加・継続しやすいよう、とにかくハードルを下げることを意識しています。その結果、サービスの開発エンジニアやUXライティングチームからも新たな参加者が加わり、輪が広がっています。
④資格勉強
ウェブサイト課ではアクセシビリティに関する資格取得に向けて、毎週もくもく会を開催しています。
すでにDAA（Digital Accessibility Advisor） Basic級の合格者が2名誕生しました。また、色彩検定UC級を最近受験して、現在結果を待っているメンバーも2名います。色彩検定UC級はすでに保持者が1名いるため、無事に合格すれば計3名の資格保持者が誕生することになります。
アクセシビリティについて体系的に勉強する機会は意外と少ないと思います。資格勉強はその良いきっかけになっています。ともに学ぶ仲間が集まることでモチベーションアップにも繋がっています。
⑤外部への発信
イベントに登壇したり、会社ブログで記事を執筆するなど、外部への発信も続けてきました。
LT「悪い実装例から学ぶ ウェブアクセシビリティ改善のヒント」Design Dontaku vol.4
Design Dontaku vol.4での登壇
会社ブログに投稿した記事
外部発信によって社外だけでなく、社内に向けても「アクセシビリティやってるぞ」というアピールができます。また、発信について外部からフィードバックをいただくことで、理解をより深めることができています。
⑥社内での推進活動
社内に向けても推進活動を行っています。
月に一度「Accessibility Sharing Meeting」という会をウェブサイト課が主催しています。これはアクセシビリティについてカジュアルに話せる場で、職種や部署を超えて誰でも参加できます。ウェブに限らず、テレビゲームや日常生活で見つけたアクセシビリティの話題など幅広く自由に話し合えるのが魅力です。
さらに、先ほど挙げたWCAG読み合わせ会を開催したり、ライティングチームとともに代替テキストについてのディスカッションも行っています。
ライティングチームとのディスカッションでは、検討の結果、最終的にライティングガイドラインに代替テキストの指針が取り入れられました。
このように少しずつではありますが、着実に仲間を増やすことを目指しています。
ふり返り
この一年間をふり返ると、これまでの取り組みを継続しつつ、新たな取り組みも増やせているなと感じました。そして仲間が少しずつ増えてきている実感もあります。
つぎはどうする
昨年・今年と、こうしてウェブサイト課の取り組みを紹介することができました。なので、まずは来年も報告できるような成果を上げることが第一目標です。
そして何より、アクセシビリティカンファレンス福岡2024での学びを糧に、チームで次の打ち手を考えていきたいと思います。
具体的には次の点について検討しています。
- もっと社内に広めていきたい
- WCAG試験を実施したい
- アクセシビリティ方針を公開したい
最後に（アクセシビリティカンファレンス福岡2024のごく個人的な感想）
発表（前夜祭）の翌日、アクセシビリティカンファレンス福岡2024に参加しました。今回のテーマは「つぎはどうする」。
登壇者のセッションも、参加者の方々と実際に顔を合わせて話をする機会も、私にとってこの上なく貴重な機会でした。受け取った熱、刺激、情報はとても大きくまだまだ反芻しきれていません。ただ少なくとも自分たちの現在地を深く見つめ直すきっかけとなりました。心から参加してよかったと感じています。
後日セッションのアーカイブ動画が公開されるとのことなので、当日参加していない方もご覧になることを強くおすすめします。
現時点での私の「つぎはどうする」は「アクセシビリティを必要としている人の声を聞く」です。“Nothing about us without us”という言葉を胸に刻みながら、これからも考え続けようと思います。
