惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

V
Visual Studio Blog
I
InfoQ
H
Help Net Security
GbyAI
GbyAI
博客园 - 叶小钗
Recent Announcements
Recent Announcements
Engineering at Meta
Engineering at Meta
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
爱范儿
爱范儿
Y
Y Combinator Blog
L
LangChain Blog
腾讯CDC
酷 壳 – CoolShell
酷 壳 – CoolShell
WordPress大学
WordPress大学
Stack Overflow Blog
Stack Overflow Blog
F
Fortinet All Blogs
G
Google Developers Blog
Apple Machine Learning Research
Apple Machine Learning Research
The GitHub Blog
The GitHub Blog
T
The Blog of Author Tim Ferriss
博客园 - Franky
D
Docker
Jina AI
Jina AI
罗磊的独立博客

DEV Community

Authentication Security Deep Dive: From Brute Force to Salted Hashing (With Java Examples) Why AI Systems Don’t Fail — They Drift Spilling beans for how i learn for exam😁"Reinforcement Learning Cheat Sheet" I Replaced Chrome with Safari for AI Browser Automation. Here's What Broke (and What Finally Worked) How Python Borrows Other People's Work The $40 Architecture: Processing 1 Billion API Requests with 99.99% Uptime Vibe Coding: A Workflow Guide (From Zero to SaaS) Most webhook security guides protect the wrong side. The scary part is delivery. Headless CMS for TanStack Start: Build a Blog with Cosmic EU Age Verification App "Hacked in 2 Minutes" — What Actually Happened Comfy Cloud’s delete function does not actually remove files Running AI Models on GPU Cloud Servers: A Beginner Guide Event-driven media intelligence with AWS Step Functions and Bedrock I scored 500 AI prompts across 8 quality dimensions — here's what broke How to Call Google Gemini API from Next.js (Free Tier, No Backend Needed) The Portal Protocol: Reclaiming Human Connection in the Age of AI How to Fix Your Team's Scattered Knowledge Problem With a Self-Hosted Forum Intro to tc Cloud Functors: A Graph-First Mental Model for the Modern Cloud Designing Multi-Tenant Backends With Both Ownership and Team Access I Built a Neumorphic CSS Library with 77+ Components — Here's What I Learned PostgreSQL Performance Optimization: Why Connection Pooling Is Critical at Scale Cómo construí un SaaS multi-rubro para gestionar expensas en Argentina con FastAPI + Vue 3 🚀 I Built an Ethical Hacking Scanner Tool – Open Source Project I Replaced /usage and /context in Claude Code With a Single Statusline A Pythonic Way to Handle Emails (IMAP/SMTP) with Auto-Discovery and AI-Ready Design I Collected 8.9 Million Polymarket Price Points — Here's What I Found About How Markets Really Move EcoTrack AI — Carbon Footprint Tracker & Dashboard Everyone's Using AI. No One Agrees How. 5 self-hosted ebook managers worth trying in 2026 Building Your First AI Agent with LangChain: From Chatbot to Autonomous Assistant
Image Alt Text: WCAG Rules and Best Practices
Romain · 2026-05-22 · via DEV Community

Romain

Alt text (the alt attribute on images) is how screen readers describe pictures to people who cannot see them. It satisfies WCAG 1.1.1 Non-text Content (Level A) — the most fundamental accessibility rule. Getting it right is mostly about context, not description.

WCAG 1.1.1 in one sentence

Every non-text element that conveys information needs a text alternative that serves the equivalent purpose. Decorative elements need an empty alternative so assistive tech skips them.

The four kinds of images

Informative

Conveys meaning. Alt text describes the information, not the picture. For a chart showing rising sales, use alt="Sales up 24% from Q1 to Q2", not alt="bar chart".

Decorative

Adds no information (background textures, dividers, eye-candy). Use alt="" — empty, not missing — so screen readers skip it.

Functional

Inside a link or button. Alt text describes the action, not the icon. A magnifying-glass search button is alt="Search".

Complex

Charts, infographics, maps. Use a short alt for the gist plus a longer description nearby — a caption, adjacent text, or a linked data table.

Rules that catch most failures

  • Never start with "image of" or "picture of" — the screen reader already announces "image".
  • Do not keyword-stuff. Alt text is for users, not bots (good alt text helps SEO honestly anyway).
  • Logos: the alt text is the company name, e.g. alt="AccessProof".
  • If the same information is in adjacent text, the image is decorative — use an empty alt.
  • Text in images: the alt must contain the exact text (and avoid text-in-images where you can).

Quick examples

ImageBad altGood alt

Team photo on About page"team""The AccessProof team at the 2026 a11y summit"
PDF download icon link"icon""Download the WCAG checklist (PDF)"
Decorative section divider"divider line"empty alt

Enter fullscreen mode Exit fullscreen mode




How AccessProof helps

AccessProof flags every image missing an alt attribute and every empty alt where the image appears informative — mapped to WCAG 1.1.1, with the exact selector. No tool can judge whether your alt text reads well, but AccessProof guarantees none are missing. Run a free scan to see your image findings.


Originally published on access-proof.com.