image-alt-textlisted

# Image Alt Text Accessibility Skill > **Canonical source**: `examples/IMAGE_ALT_TEXT_ACCESSIBILITY_BEST_PRACTICES.md` in `mgifford/ACCESSIBILITY.md` > This skill is derived from that file. When in doubt, the example is authoritative. Apply these rules when creating, reviewing, or auditing any page containing images. **Only load this skill if the project contains `<img>` elements, inline SVG images used as content, or CSS background images that may convey meaning.** --- ## Core Mandate WCAG 2.2 Success Criterion 1.1.1 — Non-text Content (Level A): every non-text element must have a text alternative conveying the same meaning and purpose. There are no exceptions for decorative images — those require an explicit empty `alt` attribute. Automated tools can flag missing alt text, but only human judgment can determine whether alt text is _meaningful_ and _appropriate_ for the context. --- ## Severity Scale (this skill) | Level | Meaning | | --- | --- | | **Critical** | Image conveying essential meaning has no `alt` attribute, or `alt` is entirely absent | | **Serious** | Functional image (button/link) has no text alternative, preventing keyboard/screen reader use | | **Moderate** | Alt text is present but inaccurate, redundant ("image of…"), or missing meaningful context | | **Minor** | Alt text is slightly verbose or could be improved but does not prevent understanding | --- ## The Alt Text Decision Tree Use this flowchart (based on the [W3C WAI Images Tutorial](https: