開発者が対応できるバグレポートを書く
手順、基準、期待する修正内容を記録します。
「開発者が対応できるバグレポートを書く」はCoddyKit上の無料Web Accessibility Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはWeb Accessibility Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Web Accessibility Academyコースには全4レッスンが含まれています。
適切に書かれるまで指摘は役に立たない
開発者が対応できなければ、優れた監査も役に立ちません。明確なバグレポートがあれば、曖昧な不満を、今日リリースできる修正へと変えられます。📝
正確な場所を示す
まず、問題が存在する場所、つまりページURLと正確なセレクターまたは要素を示します。曖昧なレポートでは、開発者が存在しないものを探すことになります。
Page: /checkout
Element: button.add-to-cart (third product card)再現手順を明確に列挙する
正確な再現手順を1行ずつ詳しく書きます。開発者がバグを再現できなければ、修正を確認できません。
1. Open /checkout
2. Press Tab until focus reaches the icon button
3. Listen with VoiceOver期待結果と実際の結果を示す
本来どうなるべきかと、実際にどうなるかを対比します。期待結果と実際の結果を示すと、開発者が埋めるべき差がすぐにわかります。
Expected: announces "Add to cart, button"
Actual: announces "button" with no nameWCAGの達成基準を記載する
4.1.2 名前、役割、値のように、正確なWCAGの達成基準へのリンクを記載します。これにより、バグを個人的な意見ではなく標準に基づく問題として扱えます。
人への影響を説明する
誰がどのような影響を受けるのかを説明します。スクリーンリーダーユーザーがボタンを識別できないと書けば、テスターにも影響の大きさが伝わります。
テスト環境を記録する
使用したブラウザ、スクリーンリーダー、OSを記録します。同じページでも環境によって動作が異なる場合があるため、状況を記録しておくと何時間も節約できます。
Env: Chrome 125 + NVDA 2024.1 on Windows 11証拠を添付する
スクリーンショット、短い動画、または関連するマークアップを追加します。確かな証拠があれば疑いをなくし、修正のレビューを早められます。
クイックチェック
アクセシビリティのバグレポートを本当に対応可能にする要素を1つ選んでください。
可能なら修正案を提案する
修正方法がわかるなら提案してください。アイコンボタンにaria-labelを追加する、といったヒントがあれば、レポートをほぼそのまま適用できるパッチに変えられます。
<button aria-label="Add to cart"><svg>...</svg></button>1つのレポートに1つのバグ
各チケットは1つの問題に絞ります。複数のバグを1つのレポートにまとめると、トリアージ、担当割り当て、追跡が複雑になります。
重大度がわかるタイトルを書く
Blocker: checkoutでcart buttonにaccessible nameがない、のように、具体的で読み取りやすく、重大度が伝わるタイトルから始めます。
振り返り：修正につながるレポート
優れたバグレポートには、場所、手順、期待結果と実際の結果、WCAGの達成基準、影響、環境、証拠が含まれます。🛠️
AI チューターと学ぶ HTML — 無料
ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。
- コース
- 30
- レッスン
- 120
よくある質問
「開発者が対応できるバグレポートを書く」レッスンは無料ですか？
はい。「開発者が対応できるバグレポートを書く」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Web Accessibility Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Web Accessibility Academyコースには全4レッスンが含まれています。
「開発者が対応できるバグレポートを書く」で何を学びますか？
手順、基準、期待する修正内容を記録します。 ブラウザで直接実行するハンズオンコードでWeb Accessibility Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Web Accessibility Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのWeb Accessibility Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「開発者が対応できるバグレポートを書く」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このWeb Accessibility Academyレッスンでコードを書いて実行できますか？
はい。すべてのWeb Accessibility Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- 手動監査のワークフローを作る
- 重大度と影響度でトリアージする
- 開発者が対応できるバグレポートを書く
- リグレッションのない修正