チェックツール

axe-core の Rules がテストされるまでをざっくり書く

この記事は、アクセシビリティテストツールである Axe と、そのコアとなる OSS である axe-core について説明している。本文では、axe-core の基本設計や、ルール・チェック・リザルトについて詳しく解説している。また、ルールやチェックは JSON 形式で書かれ、スペックに基づいてテスト対象の要素を絞り込み、関数によって評価が行われる。リザルトは、ルールやチェックの評価結果や重大度などを含むオブジェクトとして返される。

Adobe MAX「Adobe Colorで始めるUIのカラーユニバーサルデザイン」

色の感じ方は人それぞれであり、UI デザインにおいてこの問題に対処することは一般的な課題である。Adobe Color のアクセシビリティツールは、多くのタイプの人が知覚できる色の組み合わせを提供し、その助けとなる。カラーユニバーサルデザインのプロが、Adobe Color でこのツールを試し、その効果を評価し、自分の UI デザインでこのツールをどのように活用できるかを紹介する。

アクセシビリティツリーを読んでアクセシブルな実装に役立てよう

アクセシビリティツリーについて説明している。アクセシビリティツリーは、DOM ツリーに基づいて生成され、支援技術に提供される情報であり、role、name、description、state などの情報を持つ。これらの情報を確認することで、アクセシビリティ対応に役立つ。また、アクセシビリティツリーを読み取ることで、アクセシビリティ上の欠陥に気づける。Chrome では、検証モードの Accessibility のタブ Enable full-page accessibility tree にチェックを入れることで、アクセシビリティツリーを確認できる。

stylelint-a11yについて調べてわかったこと

stylelint-a11y（おそらく v1.2.1 時点）の各ルールがどのような項目なのかがまとめられている。

品質と開発速度を両立させるために捨てたものと守ったもの @wadackel @masuP9

株式会社サイバーエージェントのウェブアプリケーション『WinTicket』の開発に関するスライド。p69 からアクセシビリティについてのセクションで、開発速度を上げるためアクセシビリティ対応に Must と Usual を設定し、レビュー基準とした話が紹介されている。適切な要素選択を目指しつつも徹底はしない話、十字キーのフォーカス移動をやめ全てタブキーでできるようにした話が印象的。