色のコントラストを測る2つの方式、WCAG 2 のコントラスト比と APCA（Lc 値）の違いを解説する記事。WCAG 2 の計算の手順、達成基準ごとに必要な比率、WCAG 2 の限界と APCA の位置づけを扱う。法律や規格で使われているのは WCAG 2 のコントラスト比だと書いている。
シェアックリップ
シェアされたアックリップです。
そのほかの #カラーコントラスト ピックアップ
（引用）アクセシビリティを、デザインの基本に。 本書は、年齢や障害の有無、利用環境にかかわらず、あらゆるユーザーが必要な情報や体験を得られるよう、「アクセシビリティ」をデザインの初期段階から組み込むための考え方と実践を学べるハンドブックです。 日本でもデジタル庁がウェブアクセシビリティの導入を推進し、「誰一人取り残されない、人に優しいデジタル化」が目指されています。アクセシビリティは、一部の人のための特別…
研修資料の文字と背景の色の組み合わせを、WebAIM Contrast Checkerで一組ずつ測る方法を解説する。入力の手順と、コントラスト比をWCAG AAの通常文字の基準に照らして読む方法を、架空の文例で示す。
デジタル庁のデザインシステム（DADS）を参考に、小さい文字やコントラスト比をウェブサイトで点検するAIエージェント向けスキルを紹介する記事。Pythonで候補を拾い、ブラウザで確かめ、人が判断する二段階の点検を解説する。
テキストと背景のコントラスト比が基準を下回ったときに、色相と彩度を保ったまま明度だけを二分探索で調整して補正候補色を求める方法を、WCAG 2.2の計算式とJavaScriptの実装で解説する。
専門家のいないチームが取り組めるよう、WCAG 2.2の87項目から実害の多い7項目を絞った記事。キーボード操作、ラベル、代替テキスト、コントラスト、見出し、色以外の手がかり、フォーカスの表示を扱う。
ダークモードでもWCAG 2.1のコントラスト基準（1.4.3・1.4.11）はテーマごとに適用されると説明し、純黒の背景や鮮やかな色が基準を外しやすいことや、prefers-color-schemeのテストが漏れやすいことを扱う記事。
そのほかの #WCAG ピックアップ
（引用）アクセシビリティを、デザインの基本に。 本書は、年齢や障害の有無、利用環境にかかわらず、あらゆるユーザーが必要な情報や体験を得られるよう、「アクセシビリティ」をデザインの初期段階から組み込むための考え方と実践を学べるハンドブックです。 日本でもデジタル庁がウェブアクセシビリティの導入を推進し、「誰一人取り残されない、人に優しいデジタル化」が目指されています。アクセシビリティは、一部の人のための特別…
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
イベント 開催予定
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
研修資料の文字と背景の色の組み合わせを、WebAIM Contrast Checkerで一組ずつ測る方法を解説する。入力の手順と、コントラスト比をWCAG AAの通常文字の基準に照らして読む方法を、架空の文例で示す。
Storyblok の編集画面（Visual Editor）に、自動のアクセシビリティ検査機能が追加されたことを伝える記事。axe-core を使って WCAG 2.0〜2.2 の A・AA を検査し、違反箇所は編集画面から直接修正できる。自動検査で見つかるのは一部だけなので、手動の検証と併用すべきだと書いている。
Playwright と @axe-core/playwright で、WCAG の A・AA の違反を自動テストで見つける方法を解説する記事。メニューを開いた状態のような操作後の画面を検査する書き方や、既知の問題を除いて新たな違反だけを検出する方法を扱う。自動テストで検出できるのは一部であることも書いている。
WCAG 2.2 AAの55項目を、デザインだけで決まる項目・実装だけの項目・両方が関わる項目に分類した記事。デザインだけは10項目、実装だけは19項目、両方は25項目だったと報告している。