A graphic can be an image, a small set of meaningful vector objects, or a frequently redrawn bitmap. The choice changes hit testing, text alternatives, memory, and export behavior. This track follows an inspection map on which a reviewer marks damaged regions and exports an annotated copy. It covers SVG versus Canvas ownership, device-pixel scaling, pointer mapping, cross-origin image restrictions, and accessible controls. The scene data remains separate from pixels so it can be saved, tested, and described.
Topics in this track
- SVG, Canvas, Scene Model, and Hit Testing — Choose DOM-backed shapes or a redrawn bitmap from interaction density and semantic needs.
- Canvas Pixel Ratio and Pointer Coordinates — Separate CSS size, backing pixels, and scene space so drawing and hit testing agree.
- Canvas Origin-Clean Export and Private Assets — Prove an image can be read or exported before promising annotated downloads.
- Accessible Graphic Controls and Text Equivalents — Expose graphic relationships and actions through labeled controls and a synchronized text representation.
Prerequisite paths
Accessible Content and Media; Browser Execution and Resource Lifecycle.
Neighbor track
Rich Document Editing and Safe Content.
Practice path
Build Project: accessible inspection map and export and check decisions in Web Development: graphics and editor decisions quiz.