Writing Alt Text for STEM Images
Accessible Teaching Practices
Alternative text, also known as alt text, is descriptive text that conveys the meaning of an image in digital content. It is a short textual description, usually containing the essential information for visually impaired learners to acquire information via the description to help correlate it with the content.
Alt text is a requirement in the Section 508 guidelines. Writing alt text for an image, inserting your course material, and creating a Canvas course page are foundational aspects of digital accessibility, ensuring that all students, regardless of ability, have equal access to course content.
STEM instructional materials and content often heavily rely on images (e.g., diagrams, graphs, equations, and code) to help learners visualize and comprehend complex concepts. Developing precise alt text to describe each of these images with less than 128 characters is often challenging, if not impossible.
An alt Decision Tree | Web Accessibility Initiative (WAI) provides initial suggestions on alt text. However, due to the complexity of the images, it is often advised to provide a longer image caption to describe the image in depth, which can benefit all learners. Be mindful as you create alt text or captions to avoid providing “extra” information that someone seeing the image couldn’t directly observe.
Complex Diagrams and Visuals
Engineering systems, biological pathways, and layered technical illustrations often contain dense information. Sometimes, learning to interpret such complex visuals is itself the instructional goal. In those cases, accessibility is about ensuring that students who use assistive technologies can engage with the visual like their peers.
Best practice is to avoid relying solely on the images to convey the necessary information. Ensure the essential details related to the context are provided in text form elsewhere. If understanding the diagram is the learning objective, consider scaffolding the description by starting with the overall purpose of the visual, then breaking down its key components, relationships, or processes in logical order.
Also, consider the following tips while creating your course content:
- Focus on the main idea, such as what students should take away from the image.
- Simplify where possible; avoid describing every detail unless pedagogically necessary.
- Use tables or structured lists when flowcharts or sequences are involved.
- Link to longer descriptions if the content is too detailed for a short caption.
Mathematical Equations and Notation
Math presents unique accessibility challenges. Since equations are the content students must master, making them machine-readable (rather than images) is crucial. Rather than images, use an equation editor or the tools listed below that output MathML or LaTeX. These equation formats are supported by screen readers
- MathPix Snip can convert printed or handwritten equations into LaTeX or MathML.
- JAWS with MathCAT and Apple VoiceOver can read equations aloud and allow for structural navigation.
- If an image must be used (e.g., in scanned PDFs or slide screenshots), make sure to include descriptive alt text.
Graphs, Charts, and Plots
Graphs can be especially tricky. The goal is to describe key components without overwhelming students. When graph interpretation is part of the assignment (e.g., identifying trends, slopes, or correlations), provide a structured textual description that mirrors the analysis process you want students to learn.
For simple graphs, tools like Desmos support screen reader-friendly access. For more complex visuals, provide a short summary and link to extended descriptions. Consider using a simple 3-part framework below to get started:
- Axes and Labels– What is being measured? What are the ranges or units?
- Trends or Patterns– Are values increasing, stable, cyclical, etc.?
- Key Insights – What’s the takeaway? Any outliers or comparisons worth noting?
Chemical Structures and Molecular Models
In chemistry and biochemistry, visuals often represent processes or relationships between molecules. When describing chemical content, please identify reactants and products first. Then, describe the process or transformation, avoiding symbols like arrows that aren’t readable aloud. Finally, mention relevant conditions (e.g., heat, light) if they add context. If part of the learning outcome is to help students practice “reading” these diagrams, consider supplementing with step-by-step guided text descriptions that mirror how an expert would analyze the structure.
For 3D models or complex reactions, consider partnering with tools like MolView, ChemDraw, or SILMES that support accessible output.
For example: Reaction for photosynthesis
6 CO₂ + 6 H₂O → C₆H₁₂O₆ + 6 O₂
(in the presence of light and chlorophyll)
The suggested alternative text could be: “Six molecules of CO2 plus six molecules of H2O become one molecule of C6H12O6 plus six molecules of O2, in the presence of light and chlorophyll.”
Code and Programming Output
Accessibility in computer science is more than utilizing readable fonts. It requires structural clarity and thoughtful presentation of the code. Include the code as text, rather than screenshots or images, and use consistent indentation and spacing whenever possible. This avoids the need for alt text and makes the code screen reader accessible.
Additionally, include a description of the purpose of the code if the structure alone isn’t self-explanatory. If reading code is the skill students must develop, you can scaffold accessibility by pairing code blocks with narrated walk-throughs, inline comments, or line-by-line breakdowns. Using comment headings and templates to separate code sections and improve readability when teaching concepts like loops, functions, or outputs. Adding line numbers to reference specific code statements within the written explanations and text is also helpful.
Conclusion
Creating accessible content isn’t about perfection—it’s about inclusion. Writing alt text for STEM materials may require a bit more thought, but it ultimately leads to better learning experiences for all students. By using consistent frameworks, reusable templates, and supportive tools, your courses will be more inclusive.
Keep in mind that sometimes the point isn’t just to provide access to the content, but also to give students equitable opportunities to learn how to interpretthe content itself. Accessibility in STEM means balancing clarity with the instructional purpose of the visual, equation, graph, or code.
Start small to describe one graph, one equation, or one code block. Over time, you’ll develop your own rhythm and vocabulary for writing meaningful alt text in your discipline.
If you’re interested in learning more or collaborating on accessibility efforts in STEM, we invite you to make a consultation appointment with the DASH team or register for a DASH Studio session where you will be facilitated by the DASH team to work directly on your own Canvas course, lecture slides, instructional videos, and documents to make them more accessible for all students before the Fall quarter begins.