The Alt Text Crisis in Government
Picture this: A resident is blind. She uses a screen reader to navigate your city's website because she received a notice that her property falls inside a newly proposed rezoning boundary. She opens the page. She clicks on what the screen reader announces as a "link" — it is the zoning map. The screen reader speaks one word: "map."
She has no idea whether her street is in the blue commercial zone or the yellow residential zone. She cannot participate meaningfully in the public comment process. Her legal right to engage with her local government has been functionally denied — not by malice, but by a missing string of descriptive text that a sighted web editor forgot to write.
Now picture a deafblind user who relies on a refreshable braille display. She navigates to your town council's "About" page looking for contact information. Her braille display outputs the characters for the council photo alt text: image001.jpg. Not the council members' names. Not their roles. A file name that a camera assigned automatically when someone pressed the shutter button.
The WebAIM Million report — which audits the top one million websites for accessibility — has found that missing alternative text appears on more than 55% of home pages tested every single year. Government sites are not exempt. In fact, sites built by small municipalities with limited in-house web expertise consistently rank among the worst performers.
Alt text is not an "accessibility feature." It is the baseline, the floor, the minimum viable act of including people with visual disabilities in civic participation. This guide will give you everything you need to get it right — starting today.
What Alt Text Actually Does (And Doesn't Do)
The alt attribute on an <img> element is a programmatic text alternative — a string of text that can be processed and presented in place of the image when the image itself cannot be perceived. It serves four distinct technical purposes:
- Screen readers announce it aloud. Software like JAWS, NVDA, and VoiceOver reads the alt text to users who cannot see the image. The screen reader identifies the element as an image and then reads the alt value.
- Braille displays output it tactilely. Refreshable braille displays translate the alt text into braille cells, allowing deafblind users to read it with their fingertips.
- Search engines index it. Google, Bing, and other crawlers use alt text as a primary signal for understanding image content, directly affecting how your pages rank for relevant searches.
- Slow or failed connections show it. When images fail to load — due to poor connectivity, a broken URL, or a user who has disabled images — the alt text renders as visible text in the browser.
A caption is visible text below an image. It is read by everyone and provides supplementary context. Alt text is only presented when the image is not visible or accessible. When a page has both a caption and alt text that say the same thing, screen reader users hear the same information twice. If your image already has a caption that fully describes it, the alt text can often be empty (alt="").
Alt text is also not a tooltip (that is the title attribute), not metadata for your DAM system, and not a place to write SEO keywords. It has one job: to be a functional text equivalent of what the image communicates.
The 4 Image Types Every Government Web Editor Must Know
Not all images are created equal, and the correct alt text approach depends entirely on the role the image plays on the page. Get the type wrong and you either under-serve users with disabilities or annoy them with redundant noise. Here are the four types you will encounter on any government website:
Informational Images
Images that convey meaningful content — photos of officials, event coverage, infographics, diagrams. These are the most common and require a thoughtful written description.
- Photo of the new fire chief at her swearing-in ceremony
- Aerial photo showing flood damage along River Road
- Infographic showing the steps to apply for a building permit
Decorative Images
Images that are purely aesthetic — background textures, divider graphics, stock photos used for visual rhythm that add no information. These must use an empty alt attribute so screen readers skip them entirely.
- A decorative banner image behind a page heading (when the heading text already communicates everything)
- A leaf-and-branch SVG divider between sections
- A generic stock photo of a city skyline on the homepage hero (if no specific information is conveyed)
alt="" — empty string, not missing. An absent alt attribute is an accessibility failure; an empty one is a deliberate declaration that the image is decorative.Functional Images
Images that act as interactive controls — a logo that is also a homepage link, icon-only buttons, image-based navigation elements. The alt text must describe the function, not the appearance.
- City seal used as a link in the site header
- A "print this page" printer icon button
- A "submit" button that uses an image instead of text
Complex Images
Charts, graphs, maps, data visualizations, organizational charts, and infographics that cannot be meaningfully described in a short phrase. These require both a brief alt attribute and a long-form text description nearby.
- Annual budget pie chart
- GIS zoning or parcel map
- Organizational chart of department reporting structure
- Multi-year trend line graph for crime statistics
The Alt Text Writing Formula
Rather than memorizing rules, use this decision tree every time you publish an image. It takes less than 30 seconds and will produce the correct outcome for every image type.
"City of Millbrook — return to homepage"
Who, what, where — as relevant.
<figure>, or a linked data table.Imagine the image is replaced by your alt text in a newspaper article. Would a reader understand what they are missing? Would they get the key facts? If yes, your alt text is sufficient. If not, add more specificity — names, dates, locations, data values — whatever the image uniquely communicates.
One practical constraint: WCAG does not specify a character limit for alt text, but screen readers and assistive technology implementations commonly truncate at 125–150 characters. Write concisely. If you need more than two sentences, the image may be complex and require a long description strategy.
Government-Specific Examples: Bad vs Good
Theory is only useful when it connects to your actual work. Every example below comes from the kinds of images that appear on government websites every day. Read through all ten — you will almost certainly recognize images your own team has published.
alt="mayor.jpg"The file name tells a screen reader user nothing. It does not identify the person, their role, or the context of the photo.
alt="Mayor Susan Chen smiling at ribbon-cutting ceremony for the Oak Street Bridge renovation"Full name, title, expression (if relevant to context), and the specific event. A screen reader user gets the same meaningful information a sighted reader gets at a glance.
alt="org_chart_2026.png"Another file name. A complex image like an org chart requires a description of its actual structure and content.
alt="City organizational chart showing the City Manager reporting to City Council, with five departments below: Public Works, Finance, Planning, HR, and Police"Plus: include the full chart as a text list or table below the image for a complete long description (WCAG 1.1.1).
alt="map"A single generic word. Tells the user nothing about what district, what zones, or what decisions the map communicates.
alt="Zoning map of downtown district showing commercial zones in blue along Main Street and residential zones in yellow to the north and east"Geographic scope, zone categories, color coding, and orientation. Follow with a downloadable accessible data layer or text description of key parcel classifications.
alt="council_meeting"No specificity. Which meeting? Who is present? What is happening? This could be any government photo from any decade.
alt="City Council members seated at the dais during the March 12 regular session"Body, seating arrangement context, and specific date. If individual council members are identifiable and relevant, name them.
alt="award.png"What award? From whom? For what? None of the meaningful content is conveyed.
alt="Certificate designating Millbrook Township as a 2026 Tree City USA recipient"The certificate's key text content is conveyed: the recipient, the program, and the year. This is the functional equivalent of reading the certificate visually.
alt="" On an emergency alert banner, this is more than an accessibility failure — it is a safety failure. Screen reader users do not know an alert exists.
alt="Severe weather warning icon"Functional icon images on alert banners must always have descriptive alt text. Never leave them empty when they carry meaning.
alt="Public Works"If "Public Works" already appears as the page heading directly below the banner, this alt text causes a screen reader to announce "Public Works" twice in succession — redundant noise.
alt="" When a banner image is purely decorative and adjacent text already conveys its meaning, alt="" is the correct, intentional choice.
alt="budget_chart.png"A chart communicates specific data values. A file name conveys none of them.
alt="Pie chart of FY2026 General Fund expenditures by department. Full data in table below."Short alt identifies type, topic, and year — plus tells the user where the long description is. Then include an HTML data table with all values on the page.
alt="logo"Describes the visual form, not the function. A screen reader user hears "link, logo" — they do not know whose logo or where the link goes.
alt="City of Riverside — return to homepage"For functional images, describe what happens when you activate it. Municipality name + destination = all the information a keyboard or screen reader user needs.
alt="signature.png"Whose signature? On what official document? The file name reveals nothing about the legal or contextual meaning of the signature.
alt="Signature of City Clerk Jane Hoffman"Full name and official role. On a legally significant document, a screen reader user should understand whose signature this is and in what official capacity they signed.
What Counts as "Sufficient" vs "Perfect"
WCAG 2.1 Success Criterion 1.1.1 (Non-text Content, Level A) requires that all non-text content has a text alternative that "serves the equivalent purpose." It does not require literary perfection. It does not require you to describe every pixel. It requires functional equivalence.
The practical test: imagine you are describing the image over the phone to a colleague who cannot see it. You would not read out color hex codes. You would not describe the JPEG compression artifacts. You would say the things that matter — who is in the photo, what is happening, what information is being communicated.
Ask: if a sighted user reads this page with the image visible, and a screen reader user reads it with your alt text in place of the image, do they walk away with the same understanding of the page's content? If yes, you have met the standard. If a sighted user gets information that the screen reader user does not, you have a compliance gap.
Some practical guidance on scope: you do not need to describe image aesthetics unless they are meaningful (e.g., in a design article). You do not need to describe lighting, camera angle, or background unless they add context. For portraits of officials, you do not typically need to describe physical appearance — the name and title are what matter. However, if you are publishing a "Meet your Council" page and the photo is the primary way residents recognize their representative, a more complete description including brief physical identifiers may be appropriate.
When in doubt, err on the side of specificity. A slightly over-described alt text is far less harmful than an under-described one. Your users with visual disabilities would rather hear a complete sentence than be left guessing.
Workflow Integration: Who Writes Alt Text and When
The most common reason government websites have poor alt text is not ignorance — it is workflow. Alt text gets skipped because it is added as an afterthought, audited after publication, or nobody on the team was clearly responsible for it. The fix is structural, not just educational.
- Require alt text before publication in your CMS. Most modern CMS platforms (including WordPress) can be configured to display a warning or hard block when an image is inserted without alt text. Enable this. WPPersona's accessibility toolkit includes a publishing checklist that flags missing alt text in the pre-publish sidebar.
- Make the photographer or image requester responsible. The person who knows the context of a photo — the communications staffer who attended the event, the department director who commissioned the infographic — should write the alt text. They have the context. The web team often does not.
- Create a style guide entry for common image types. Your municipality's style guide should include a one-page reference for alt text by category: council photos, event coverage, maps, charts, award graphics, signatures. Give your editors a template to follow for each type.
- Train at onboarding, not during an audit. Accessibility training for content editors should happen during CMS onboarding — before they publish their first page. A 30-minute module on alt text, image types, and the decision tree is all it takes to build the habit from day one.
- Audit existing content annually. Use automated tools (see Section 9) to identify images with missing or suspicious alt text in your existing content. Prioritize high-traffic pages, service pages, and content referenced in community notices. Build remediation into your annual content review cycle.
The most effective accessibility programs do not treat alt text as a compliance checkbox. They treat it as a standard of care for every member of their community. Frame it that way to your team: "We write alt text because our residents with visual disabilities deserve the same access to public information as everyone else." That framing sticks far longer than a threat of an ADA complaint.
Common Mistakes Government Teams Make
Experience reviewing hundreds of government CMS implementations reveals the same mistakes appearing repeatedly. Avoid all of the following:
alt="city hall permit application building permit fees zoning variance Riverside CA" — this is keyword stuffing. Google penalizes it. Screen reader users are subjected to a nonsensical string. Alt text is for users first. Keyword-relevant alt text written naturally for users will also perform well for SEO.
If your photo has a caption that reads "Mayor Chen at the Oak Street Bridge ribbon cutting," and your alt text says the same thing, a screen reader user hears it twice. When a caption fully describes the image's meaning, use alt="" on the image.
Screen readers already announce the element as an image before reading the alt text. Writing "Image of Mayor Chen" means the user hears "image, image of Mayor Chen." Start with the description: "Mayor Susan Chen at..."
The opposite problem: over-describing decorative elements. When every background texture, every horizontal rule icon, and every decorative flourish has descriptive alt text, screen reader users wade through a noise flood to find meaningful content. Use alt="" deliberately and consistently for decorative images.
A photo captioned and described as "residents at the 2024 Parks & Recreation summer program" reused on a 2026 budget proposal page without updating its alt text becomes misleading. Alt text is content — it needs to be reviewed and updated when the image is reused in a new context, just like caption text.
Tools to Check and Improve Your Alt Text
A critical distinction before diving into tools: automated accessibility checkers can tell you when alt text is missing, but they cannot tell you when it is bad. A tool can flag alt="" on an informational image as a failure. It cannot tell you that alt="mayor.jpg" is useless. That requires human review.
WAVE Web Accessibility Evaluation Tool
FreeBrowser extension and web tool from WebAIM. Enter any URL and get a visual overlay of accessibility errors including missing alt text, flagged directly on the page. Excellent for content editor training — they can see exactly which image is missing alt text.
axe DevTools
Free / PaidBrowser extension (free) and enterprise platform from Deque. The free extension integrates with Chrome and Firefox DevTools and runs WCAG 2.1 and 2.2 checks. Best for developers doing implementation reviews. The enterprise version supports automated CI/CD testing.
Accessibility Insights for Web
FreeFree Microsoft tool available as a Chrome extension. Provides both automated checks and guided manual assessment workflows. The "FastPass" mode catches critical issues including alt text failures in under two minutes.
Browser DevTools Accessibility Tree
Built-inIn Chrome DevTools, the Accessibility panel shows the computed accessibility tree for any selected element — including what alt text a screen reader will actually announce, after any overrides from ARIA attributes. No extension needed.
Automated tools can reliably detect missing alt text, empty alt on linked images, and suspiciously short alt strings. They cannot evaluate whether your alt text is accurate, specific, or contextually appropriate. The only way to validate alt text quality is human review — ideally by someone who uses a screen reader, or at minimum, by a sighted reviewer who reads the alt text without looking at the image and evaluates whether it conveys the image's meaning.
Quick CMS audit workflow for government teams
- 1Run WAVE or axe on your 10 highest-traffic pages. Fix all flagged missing alt text.
- 2Search your media library for images with alt text matching the file name pattern (e.g., containing ".jpg", ".png", or starting with numbers). These are likely auto-filled by the CMS and need human review.
- 3Review all charts, maps, and infographics for long descriptions. Add an HTML table or descriptive paragraph below each one.
- 4Update your CMS configuration to require alt text entry before an image can be inserted into a page.
- 5Schedule a quarterly alt text review as part of your content audit cycle.
Quick Reference Checklist
Make alt text a standard part of every publish
WPPersona's accessibility toolkit includes a pre-publish alt text checker, an image type classifier, and editor training resources — built specifically for government CMS workflows. See how it integrates with your existing content team.