アメブロでは誰もがいつでも、迷わず「書く」「読む」「応える」ができる状態を目指すためのひとつとしてアクセシビリティの取り組みをおこなってきました。
そんなアメブロでの2021年を振り返ってみたいと思います。

ウェブアクセシビリティ試験結果の公表

2020年の振り返りでもふれていますが、「JIS X8341-3:2016」に基づく、ウェブアクセシビリティ試験を実施した結果を公開することができました。

また、適合できていない箇所もまだまだあり継続して改善していかないといけない気持ちが一層高まりました。

ウェブアクセシビリティ試験結果公表時に使用したキービジュアル
アクセシビリティについて

継続的な改善

試験結果で判明した課題に対しては改善され、すでにリリースされているものもあります。2021年だけで40件以上のアクセシビリティの改善をすることができました。

  • アイコンつきのサムネイルに対して適切な代替テキストを付与
  • 記事詳細画面の件数が読み上げ可能に
  • 「いいね」「コメント」「リブログ」数のリンク先の目的が分かるよう変更
  • モーダル機能のキーボード操作ができるよう変更
  • コメントリンクのキーボード操作ができるよう変更
  • コメントするボタンのフォーカスが表示されるよう変更
  • 各種コントラスト比の向上

など上記における改善はほんの一部ですが、普段の業務と並行して取り組むことができました。

デザインシステム

今年公開されたデザインシステム「Spindle」はデザイン原則の一つにアクセシビリティの考えを採用し、開発の上流工程からアクセシビリティを明文化しています。

コントラスト比の改善は達成基準1.4.3に基づいた設計がされており、生産性高く安定して改善を進める事が可能となりました。
今後はSpindleを活用してアメブロをよりアクセシブルにしていけると思います。

Spindleのスタイルやコンポーネントはアクセシビリティへの配慮がされており、Amebaのデザインシステム「Spindle」の全貌公開でもふれられていますので気になる方はチェックしてみるといいかもしれません。

Ameba Accessibility Guidelines

今年も

など継続的な運用ができたことに加え、アメブロの開発においてAmeba Accessibility Guidelinesがより定着してきたように思います。

また、新たな機能を開発する際はAmeba Accessibility Guidelines を元にアクセシビリティの方針を定めており、アメブロの新機能「応援」では可能な限りガイドラインの達成基準Aを満たすようにしており誰でも応援を送る設計がされています。

応援機能におけるアクセシビリティ方針策定のスクリーンショット。

定着させるための土台作り

普段アメブロの現場でおこなっている地道な取り組み「Amebaブログにアクセシビリティを定着させる土台作り」を弊社主催の勉強会Muddy Webでは久々に社外の方々に向けてお話しできた気がします。

Ameba Accessibility Team

2021年のAmeba Accessibility Teamは復職や異動、新卒の加入などもあり、ウェブチームは5名の新たな体制でスタートをしました。さらには、Amebaアプリの中長期的な技術戦略のひとつとしてもアクセシビリティが掲げられ、アプリチームも主体的にアクセシビリティの改善や勉強会をスタートさせました。
詳しくは「Amebaアプリのアクセシビリティに関する取り組み」で取り上げています。

新たな体制になり、改めて組織にアクセシビリティを定着させる動きができたのではないかと思います。チームみんなのおかげで様々な改善ができましたしアクセシビリティの相談もたくさんさせてもらいました。

継続的な改善の結果、スタッフブログなどではアクセシビリティについてのコメントをいただく機会も増えており、まだまだ道半ばではあるものの、手応えを感じております。
感謝しかありません。

また、今年チームに加わってくれたメンバーの「新卒配属後31件のアクセシビリティ改善をした話」もCyberAgent Advent Calendar 2021として公開されております。

来年以降もアメブロではアクセシビリティへの取り組みをおこなっていくと思います。アクセシビリティが当たり前になりそれを意識する人たちがじわじわと増殖してくれることでしょう。

今年も1年おつかれさまでした!

2016年に中途でサイバーエージェントに入社。フロントエンド開発を担当する傍らアクセシビリティの向上を目指し日々精進しています。野球が大好きです。