文脈を保ってページの操作部品を一覧化する方法。
操作部品の一覧には文脈とともにラベルと役割を記録します。アイコンだけのボタンは見た目の意味が明らかでもアクセシブルな名前が必要な場合があります。
作業手順をタスクに合わせましょう。
指定した領域の操作可能な部品を挙げ、分かる範囲で表示ラベル、アクセシブルな名前、役割、状態を記録します。同じラベルは所属するまとまりと結び付けてください。識別のためだけに部品を操作せず、不明な動作は後で確認する事項にします。
- 用意するもの
- 表示されたページの操作部品。
- 得られるもの
- ボタンのラベル、種類、表示上の操作文脈。
入力と結果を確認しましょう。
説明用の入力と出力 · 実際の WebAct 実行ではない学習用サンプル
入力項目サンプル個
Supplied DOM: <button>Save draft</button> and <button><svg aria-hidden="true"></svg></button>. Second control visually uses a trash icon; no other naming attributes.
完成例
Control 1: native button, visible and accessible name "Save draft". Control 2: native button, no accessible name in the supplied markup; decorative SVG does not provide one. Review: confirm the second action, then provide an accurate name such as Delete item if that is its actual function.
この入力をプロンプトに読み込み、WebAct にコピーして試してください。結果は掲載例と異なる場合があります。
判断のポイントとトラブル対処。
ボタン風のリンクも一覧に入れますか？
画面を確認するなら含めますが、移動と操作を区別できるようリンクとしての役割と移動先を保ってください。
一覧の複数の「削除」ボタンを見分けにくいのはなぜですか？
周囲の記録や節の文脈が欠けています。それを加え、アクセシブルな名前でも区別できるか調べてください。
自分の資料で試しましょう。
タスクのプロンプト内の例を自分の資料に置き換えてください。必要な要件を残し、タスクを WebAct にコピーします。
タスクを調整してコピー ↑