How to use the Webpage Button Inventory.
A control inventory should record labels and roles in context. An icon-only button may need an accessible name even when its visual meaning seems obvious.
Make the workflow fit your task.
List actionable controls within a defined page region, recording visible label, accessible name, role and state where available. Keep repeated labels connected to their container. Do not activate controls merely to identify them; note uncertain behavior for later review.
- What you provide
- Rendered page controls.
- What you get
- Button labels, types and visible interaction context.
See the input and the result.
Illustrative input and output · a teaching example, not a live WebAct run
Example input
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.
Completed example
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.
Load this input into the prompt, then copy it to WebAct to try the task. Your result may differ from the illustration.
Decisions and troubleshooting.
Should links styled as buttons be included in the inventory?
Include them when reviewing the interface, but preserve their link role and destination so navigation is distinguishable from an action.
Why are several Delete controls hard to distinguish in the output?
The surrounding record or section is missing. Add that context and inspect whether accessible names distinguish the controls too.
Try it with your own source.
Replace the example with your material in the task prompt. Keep the requirements you need, then copy the task into WebAct.
Customize and copy the task ↑