Liquitousが2026年10月に行ったアクセシビリティ向上の取り組みを報告する。フォーム部品をデザインシステムの部品に置き換えたこと、読み上げ用の文言の多言語対応、入稿画面にコンテンツのチェック機能を組み込んだことなどが書かれている。
シェアックリップ
シェアされたアックリップです。
そのほかの #企業事例 ピックアップ
A11y Osaka Meetupの第5弾。2026年11月24日に会場とオンラインで、洗髪デバイス「SUSUGU」を手がけた牛乳石鹸共進社が、開発から発信までのインクルーシブデザインの実践を振り返る。
印刷物を年齢や障害の有無、色の見え方にかかわらず伝わるようにするメディアユニバーサルデザイン（MUD）の取り組みと、企業向け防災ハンドブック「我が社のポケット防災」を、産業交流展2026への出展内容として紹介する。
SmartHRのアクセシビリティ本部による2026年10月の月報で、JIS X 8341-3:2016に基づく試験結果の公表、強制カラーモードでのロゴ表示の修正、新入社員向けアクセシビリティ研修の振り返りを伝える。
ロッテが開発したパッケージの溝、ココヨムを実際に触って試した記事。視覚に頼らず賞味期限やアレルギー情報にたどり着くための仕組みで、初めて触る人にとって分かりやすいかは個人差があると筆者は述べる。
企業がWCAG 2.2 AAの試験結果を公開し、直したことと直さなかったことを記録した経緯を書いた記事。キーボード操作や読み上げに関わる改修と、コントラストを改めなかった判断を紹介する。
フランスの映画アクセシビリティ推進団体「ルテゥール・ディマージュ」とのオンラインセミナー。音声描写（オーディオディスクリプション）の制作・品質保証と、映画産業における情報保障の社会的価値を問い直す。日仏の比較から、障害のあるクリエイターの仕事の可視化と上映環境の向上を考える。
そのほかの #フォーム ピックアップ
読み込み中の表示でレイアウトを動かさず、次に何をすべきか、失敗したときにどうするかを伝える方法を React で示す記事。aria-busy や role の使い分けも解説する。
フォームの入力エラーで、どの欄をどう直すかを案内する方法を、申込みフォームを例に解説している。エラー文から該当欄へ移れること、直す以外の入力を残すことを挙げ、WCAG 2.2のエラー特定と修正の提案に触れている。
JIS X 8341-3の改正でベースとなる規格がWCAG 2.2へ移る予定を受け、タップ領域やフォーム入力、フォーカス表示など追加される達成基準の要点を整理した記事。縦書きや改行、IME入力など日本語特有の配慮も扱う。
問い合わせフォームのアクセシビリティ監査で見つかった問題を、セマンティックHTMLの書き方で直した過程を記した記事である。label と input の結び付け、fieldset と legend によるグループ分け、画像の alt の付け方を扱っている。
スクリーンリーダーを使う視覚障害のある筆者が、支払い方法の登録フォームで遭う障壁をまとめた記事。有効期限の入力欄、請求先住所の選択、既定のカードの設定の3点で、読み上げが合わず操作できない例を挙げる。
Webサイトのアクセシビリティを検証する7つの観点を示した記事である。キーボード操作、セマンティックなHTML、コントラストとズーム、フォーム、代替テキスト、動的なコンポーネント、自動チェックと手動QAの併用を扱う。
そのほかの #デザインシステム ピックアップ
Shopify ストアの配色向けに、WCAG 2.x AA の基準を測った2種類のパレットを CSS 変数や Tailwind の設定として配布する無料キットを紹介する。コントラスト比の確かめ方も示す。
色の見え方に違いがあっても情報が伝わるよう、色以外の手掛かりを添える考え方を解説する記事。デジタル庁のボタン設計を例に、塗りつぶしと輪郭線の違いなどを紹介している。
shadcn/uiを標準の状態で使うと、WCAG 2.2 AAに適合しないコンポーネントがあることを指摘する記事。フォーカスリングや入力欄のプレースホルダの色の対比不足などの例と、コードの修正方法を示す。
WCAG 2.2の達成基準3.2.4「一貫した識別性」を、デザインとコーディングの両面から解説する記事である。同じ機能のボタンやアイコンには、どのページでも同じ名前と見た目を使うことを求める基準である。
AIだけではウェブサイトを完全にアクセシブルにできないと述べ、スキル・ガードレール・設計システム・人の検証と組み合わせることでAIが支援の力になると論じる記事。
Every contrast failure on our site is the same Tailwind feature, and measuring it needs a canvas
記事 海外
クイズアプリのコントラスト監査で全ての失敗が一つの Tailwind 機能に由来することを発見。oklab・oklch 色空間に対応した Canvas ベースの測定方法を紹介し、正確な色値取得の重要性を解説。