image-alt-text

Generate WCAG 2.2-compliant alt text for images and SVG content.

39|2|Updated Mar 28, 2026
One-click install
npx skills add https://github.com/mgifford/accessibility-skills --skill image-alt-text
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: image-alt-text
Source: https://github.com/mgifford/accessibility-skills/tree/main/skills/image-alt-text
Command: npx skills add https://github.com/mgifford/accessibility-skills --skill image-alt-text

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides guidance to ensure non-text content on web pages and apps has accurate and meaningful text alternatives, meeting WCAG 2.2 1.1.1 Non-text Content requirements.

Core Features & Use Cases

  • Templates and decision trees to classify informative, decorative, and functional images.
  • Guidance on writing concise alt text and long descriptions for complex graphics like charts.
  • Application to content creation, review workflows, and audits to improve accessibility across pages and documents.

Quick Start

Scan your page for non-text content, then generate context-appropriate alt text and long descriptions according to WCAG guidelines.

Frequently Asked Questions about image-alt-text

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write alt text for images to meet WCAG 2.2 1.1.1 non-text content requirements?

To meet WCAG 2.2 1.1.1 non-text content requirements, write concise alt text for simple images and informative long descriptions for complex graphics. Avoid using file names, placeholders, or phrases like "image of" or "photo of".

When should I use empty alt attributes for decorative images?

Empty alt attributes should be used for decorative images to ensure screen readers ignore them. This approach correctly handles non-essential visual elements without cluttering the audio experience, adhering to accessibility guidelines.

What is the best way to label functional images on a web page?

The best way to label functional images is by providing text that describes the action or purpose the image performs, rather than its visual appearance. This ensures users relying on assistive technology understand the image's function.

How do I generate long descriptions for complex charts and maps?

To generate long descriptions for complex charts and maps, use templates and decision trees to classify the graphics. This process guides you in producing detailed, informative text alternatives that convey the data effectively.

Does this approach work for documents and digital content workflows?

Yes, this approach works for documents and digital content workflows. It applies to websites, documents, and content creation review processes to improve accessibility by ensuring all non-text content has appropriate text alternatives.

Why should I avoid using file names as alt text?

You should avoid using file names as alt text because they do not provide meaningful information about the image. Accurate and descriptive text alternatives are required to meet WCAG 2.2 1.1.1 accessibility standards.