Lighthouse スコア低下の原因となる 6 つの問題と改善方法。画像最適化、フォント読み込み最適化、サードパーティスクリプトの遅延読み込み等を解説。
シェアックリップ
シェアされたアックリップです。
そのほかの #Lighthouse ピックアップ
アクセシビリティをチェック・テストするためのツール・拡張機能・スクリーンリーダーの一覧。自動チェック、コントラスト測定、スクリーンリーダー利用など、成果物検証の手段を紹介している
セマンティックHTMLの重要性とスクリーンリーダーへの影響を解説。著者のポートフォリオサイト監査で発見した3つの問題——画像のalt属性欠落、フォームラベルの接続不良、見出し階層のスキップ——と修正方法を紹介する。
Lighthouse がアクセシビリティ 100 点でも見落とす項目を、手動チェックで検出。装飾的なアイコンの aria-hidden 設定、ランドマークの配置と aria-labelledby による命名、HTML の妥当性など、実装例を交えて解説。
Lighthouse と axe で頻出するアクセシビリティエラー（代替テキスト・色コントラスト・ボタン名前・フォームラベル）の意味と修正方法を解説する。
Lighthouseで最も頻出するアクセシビリティ失敗4つ（色コントラスト・代替テキスト・リンク名・フォームラベル）の原因と最小限の修正方法をWCAG 2.2に対応させて解説している。
Lighthouse の accessibility score が実際に何を測り、何を測らないか。100点でも manual testing が必要。自動テストの限界と manual checks が必要な10項目の解説。
そのほかの #代替テキスト・alt ピックアップ
Unicode スクリプト文字の技術的仕組みと、検索・スクリーンリーダー対応・文字列長への影響を解説。装飾的な文字とアクセシビリティの衝突を示す。
画像のALT文（代替テキスト）と本文での説明の書き方。視覚障害のあるユーザーが取り込む情報を想定し、画像が無いと読者が何を見落とすかを考えながら記述する方法を提示する。
動画の音声をAIで文字起こしした場合、映像にしかない操作手順や指示を記事に補足する編集手順。視覚情報なしで内容を追えるようにするW3C基準のブログ編集方法。
ローカルAI（Gemma 3 4B）を用いてWeb要素のアクセシブル名を自動提案し、キーボード操作を補完するChrome拡張機能。スクリーンリーダー対応で、ブラウザ側のみで動作。
アラスカ州アーツカウンシルにおける alt text 自動生成ツール ATC の事例から、助成制度・文化政策のアクセシビリティを考察。視覚障害のある審査員が作品情報にアクセスできる基盤づくりと、米国の ADA や文化行政の枠組みを解説している
そのほかの #テスト・検証 ピックアップ
Googleが発表した「Guided Vision」は、Gemini Liveの視覚支援機能で、視覚障害・弱視者との協働開発。カメラの向きや距離が不適切な場合に音で構図を補助し、AIが読める画像を撮影時点で確保する。実務への応用として、建設業で品番読み込みの精度向上を例に検証方法を提案。
音声ゲームブックの開発で直面した、音声認識と音声入力の技術的課題と、入力のタイミング表示・VoiceOver対応などの設計の工夫について
【名古屋開催】第12回 ウェブアクセシビリティ勉強会
イベント 開催終了
ウェブアクセシビリティの基礎から実務的なテーマまで、参加者と一緒にワークショップ形式で学ぶ勉強会。WCAG 2.2やスクリーンリーダーの実機検証など、手を動かしながら知見を共有する。初心者歓迎。
首都圏の大学230校を対象にしたWebアクセシビリティ対応状況の調査。方針公表率や試験実施率、axe DevTools による問題検出など、教育機関のアクセシビリティ対応の課題を数値で明らかにするレポート。
動画の音声をAIで文字起こしした場合、映像にしかない操作手順や指示を記事に補足する編集手順。視覚情報なしで内容を追えるようにするW3C基準のブログ編集方法。
ローカルAI（Gemma 3 4B）を用いてWeb要素のアクセシブル名を自動提案し、キーボード操作を補完するChrome拡張機能。スクリーンリーダー対応で、ブラウザ側のみで動作。