Skip to content

Instantly share code, notes, and snippets.

@joedevon

joedevon/alt-text-resources.md

Last active April 3, 2026 01:29
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save joedevon/caeabef3107218743df8a630fbe74163 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save joedevon/caeabef3107218743df8a630fbe74163 to your computer and use it in GitHub Desktop.
Download ZIP
Alt Text Resources — links for feeding into AI to improve alt text generation
Raw
alt-text-resources.md

Alt Text Resources

Resources for feeding into AI to improve alt text generation

Tools

  1. VisionScribe — @joedevon's Custom GPT for alt text creation: https://chatgpt.com/g/g-6wnzEP0SO-visionscribe
  2. VisionScribe for Claude — Claude Code skill version (install in Claude Desktop, claude.ai, or Claude Code): https://github.com/joedevon/visionscribe

WCAG and W3C Official Guidance

  1. WCAG 2.2 Success Criteria for Non-Text Content: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html
  2. W3C Images Tutorial: https://www.w3.org/WAI/tutorials/images/
  3. W3C Alt Decision Tree: https://www.w3.org/WAI/tutorials/images/decision-tree/
  4. W3C Complex Image Handling: https://www.w3.org/WAI/tutorials/images/complex/
  5. W3C Decorative Images: https://www.w3.org/WAI/tutorials/images/decorative/

WebAIM

  1. Alt Text Guide: https://webaim.org/techniques/alttext/
  2. Alt Text and Linked Images: https://webaim.org/blog/alt-text-and-linked-images/

Scribely

Note: Scribely has a handy link to pass their articles directly into AI chat windows.

  1. Alt Text Masterclass Part 1 — What Is Alt Text?: https://www.scribely.com/post/alt-text-masterclass-part-1
  2. Alt Text Masterclass Part 2 — How to Write Alt Text: https://www.scribely.com/post/alt-text-masterclass-part-2
  3. Next-Level Alt Text for Smart SVGs (CSUN 2023): https://www.scribely.com/post/next-level-alt-text-for-smart-svgs-a-humanistic-approach-to-visual-description-csunatc-2023

Microsoft Office

  1. Add Alt Text to Shapes, Pictures, Charts and Other Objects: https://support.microsoft.com/en-au/office/add-alternative-text-to-a-shape-picture-chart-smartart-graphic-or-other-object-44989b2a-903c-4d9a-b742-6a75b451c669
  2. Everything You Need to Know to Write Effective Alt Text: https://support.microsoft.com/en-gb/office/everything-you-need-to-know-to-write-effective-alt-text-df98f884-ca3d-456c-807b-1a1fa82f5dc2
  3. Outlook — Missing Alternative Text: https://support.microsoft.com/en-us/office/outlook-missing-alternative-text-920333c1-47f7-4db0-be54-a4e6358b464c

MDN Developer Reference

  1. The img Element: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/img
  2. HTMLImageElement.alt Property: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment