When I was in elementary, middle, and high school, I often struggled to read diagrams that my teacher would show in class or print on a worksheet or exam. It wasn’t until college that I learned about creating and adapting accessible diagrams for low vision in a science class, and I immediately noticed that my grades on assignments that featured diagrams were higher, because I was finally able to see all of the information that had been presented to me. While I can’t go back to my high school science teacher and ask them if I can retake a test I failed years ago due to the diagrams being too small to see, I can share my tips for how to create accessible diagrams for low vision and how to adapt diagrams for visually impaired students that access print/visual information.
What makes diagrams inaccessible for low vision?
There were many different factors that contributed to my difficulty with reading diagrams with low vision, some of which include:
- Labels not being in large print
- Images not being enlarged along with the rest of the text
- Low resolution graphics that were blurry when enlarged
- Poor contrast colors, i.e gray pictures on a white background
- Having difficulty with trying to figure out where the arrows/lines were pointing due to intersecting lines
- Text labels being close together, which would be difficult for me to identify with double vision- especially as my double vision would get worse later in the day.
This post primarily focuses on addressing visual accessibility of diagrams and remediating diagrams with print access (large print) in mind, with solutions that can be implemented by a paraprofessional, teacher, or other support team member that works with low vision students.
Related links
- High Contrast and Low Vision
- Adapting Page Layouts: Math Problems and Low Vision
- Disability Accommodations For Fluctuating Eyesight
- Ten Spooky Inaccessible Assignments and How To Fix Them
- Ten “Odd” Things I Do With Double Vision
- Implementing Shared Folders For Accessible Materials
Elements of accessible diagrams for low vision
While it can be difficult for students to identify what makes a diagram inaccessible for them, many students can look at an accessible diagram and identify what makes it easy for them to read/interpret. Some of these elements that come to mind for my low vision condition include:
- Color-coded images that use saturated/vivid colors
- Fonts designed for readability, such as Arial
- Digital copies of diagrams that can be enlarged on a computer with the zoom function or screen magnification and that are shown in a higher resolution than print
- High resolution graphics that can be enlarged without the text or important visual details getting blurry
- When available, 3D models that can either be examined in the physical environment, or magnified on a computer (which can be magnified at a higher resolution)
Some students with low vision benefit from tactile diagrams that contain raised lines and images/textures, or that incorporate real objects that students can interact with. I haven’t used this strategy very often since I primarily access information visually.
Related links
- My Favorite Free Fonts For Print Disabilities
- How I Document Accessibility Preferences With Low Vision
- How To Create High Resolution Images For Users With Low Vision
- Exploring Microsoft 3D Models For Low Vision Students
- How To Create Tactile Images With Everyday Objects
How to make diagram labels easier to read with low vision
It can be challenging to enlarge diagram labels in large print sizes, especially since “large print” is defined as being 14-pt font or larger. Here are the strategies my professors and I have used for accessible diagrams:
- One professor would provide a bulleted list of all labels on a diagram, listed in clockwise order. If color coding or numbering was used, they would write the color or corresponding number as well.
- Providing a link to a digital file so students can view diagrams in full screen view and zoom in. This was easier to access than embedding the image in a module.
- For assignments where students label diagrams on their own, a modification was made to let students write out the labels and a brief definition or description of what they look like or where they are located in relation to other items.
- Instead of writing words next to the diagram, one instructor would write numbers instead, and provide students with a separate page that had corresponding labels. This helped a lot for students who needed increased line spacing or struggled with visual clutter.
- Provide students with an index card or typoscope for blocking out visual elements and focusing on a specific area of the page.
Another helpful tool for reading diagrams with large print is a touchscreen tablet like an iPad. Besides using pinch-to-zoom, users can also position the screen at an angle or closer to their face, which can be useful for exploring images or enlarging content.
Related links
- How To Modify Accessible Anatomy Graphics For Low Vision
- Adapting Accessible Charts: Math Problems and Low Vision
- Math Test Accommodations For Low Vision
- How To Modify An Instrument Fingering Chart For Low Vision
- How To Make iPad Accessible for Low Vision
- A to Z of Assistive Technology for Reading Digital Text
What to know about color coding diagrams for low vision
As someone with low vision and intact color perception, I frequently use color as a way of labeling or conveying information in my own personal workflows. It takes me less visual effort to see if something is the color blue compared to reading a text label, so I will often use color in the following ways when working with accessible diagrams:
- Color-coding my own notes
- Using color as a landmarking tool. For example, the webbed feet on a frog diagram may be colored in yellow, which is different from the rest of the leg that is colored green. I use the color yellow to locate where the webbed feet are before examining other visual details like the shape
- Writing letters in different colors
- Highlighting lines with different colors, especially if there are a lot of intersecting lines on a page
- Drawing an outline around diagrams that have multiple levels to indicate how they are separated.
Even though I use color a lot, there are many people with visual impairments who have color deficiencies or colorblindness who find it challenging to use color as a labeling tool— conflicting access needs exist after all. For this reason, color alone should not be used to communicate information. Some strategies to keep in mind when using color within accessible diagrams include:
- Use more than one way to convey information, such as using both shape and color. If using red and blue color labels, consider drawing a red circle and blue square so that way viewers can use the shape as a labeling tool as well.
- To check images for contrast, try previewing them in a grayscale color scheme to assess how colors appear on the page and if information can still be conveyed accurately
- Color may be distorted when using high contrast displays or invert colors, so students may not be able to identify diagram elements that match a specific color.
Related links
- Highlighting Information With Low Vision
- Adapting Math Sketches: Math Problems and Low Vision
- Choosing Accessible Microscopes For Low Vision
- How To Use Invert Colors With Low Vision
Writing alt text and image descriptions for accessible diagrams
What is alt text? What is an image description?
Alt text is a short, written description that displays in place of an image if the image fails to load that tells people what is in an image, such as text, colors, or basic essential details. Screen readers will read alt text aloud so that users who are blind or that have low vision can understand what is in an image. If someone fails to add alt text for an image, the screen reader will either simply say “image” or ignore the image entirely, which means that users miss potentially valuable visual content. If an image loads correctly, alt text is invisible to users that do not use assistive technology.
An image description is a longer description that is typically exposed, meaning anyone can see it whether they are using assistive technology or not, though users can also insert image descriptions in a similar manner to alt text that remain hidden. An image description serves as a descriptive caption, which is great for people with vision loss, language learners, or people with cognitive or processing disabilities. I recommend keeping image descriptions exposed or having a link to image descriptions in content so that users can benefit from the additional description.
What to include in alt text/image descriptions
The alt text for an accessible diagram should provide a basic description of what is in a diagram. For example, if I was writing alt text for a diagram of a frog, I might use the description “a diagram that shows the anatomy of a lime green frog with color-coded sections across the body.” If this was for an assignment or exam with multiple diagrams, I would also include the question number so that students can easily jump between graphics while using a screen reader.
The image description or extended description should include the following information:
- A list of labels in clockwise order, with a visual description of what they are pointing to. For example, with the frog diagram, one of the labels is for the web located between the toes
- Color shade names can be used when writing image descriptions for color-coded graphics, i.e ear drum, maroon red
- Do not add additional information that is not included on the diagram, such as the function of a body part
- The list of labels can be structured as a bulleted list, which is helpful for students who use a screen reader
I recommend writing detailed image descriptions over extended alt text because it is easier to structure image descriptions with formatting like bulleted/numbered lists and to go back and read specific sections of interest.
Related links
- How To Write Alt Text and Image Descriptions for the Visually Impaired
- Options For Writing Extended Image Descriptions On Social Media
- How To Create Accessible Pie Charts For Low Vision
- How To Create Accessible Map Charts For Low Vision
- Tuva Tools and Low Vision Accessibility
Presenting diagrams in audio/video format
Another option for creating accessible diagrams is to present them in an audio/video format where a description of the diagram is read out loud, and additional labels can be drawn or added via text box on top of the image. These are also referred to as audio narrated images, and can be useful for students that benefit from additional description of individual elements.
One student I worked with would view diagrams as a PowerPoint presentation, where each slide corresponded to a visual element. In an activity where they studied parts of a flower, each slide had an image of the individual flower part (e.g. stem) on its own, written with the label next to it and a list of parts that it connected to.
Related links
- Creating Audio Narrated Images For Low Vision
- How To Create Accessible Videos and Narrated Images With Clips
- How To Create Accessible PowerPoints
- Meet The Cast: Supporting Literacy For Students With CVI
- Record your screen in PowerPoint (microsoft.com)
Getting accessible diagrams through AEM services
Accessible Educational Materials (AEM) services provide physical and digital accessible copies of a variety of educational materials including textbooks, exams, classroom assignments, and diagrams at no cost to the teacher. In Virginia, AEM services are provided through AIM-VA and can create custom accessible materials to fit a student’s personal accessibility needs. Teachers can submit copies of educational materials for their student(s) with print disabilities, and the AEM services will take care of the rest and send the accessible copies of materials back to the teacher.
Accessible materials from an outside source should be requested as soon as the teacher knows they will be using them
Related links
- Receiving Accessible Educational Materials With NIMAC and AIM-VA
- What To Know About College Assistive Technology Specialists
- File Formats For Low Vision and Print Disabilities
- How I Read Research Sources With Assistive Technology
Free applications and resources for creating accessible diagrams for low vision
Looking for a list of free apps and tools that can be used to create accessible diagrams for low vision? Here are a few that I have used:
- For my programming classes, I have had professors use Microsoft Whiteboard to draw diagrams, which can be labeled with alt text or enlarged with pinch-to-zoom. How I Use Microsoft Whiteboard With Low Vision
- Using video magnification tools to enlarge individual elements. Many of my friends and I use tools like iOS Magnifier and Low Vision Accessibility
- When modifying PDF diagrams, I often use PowerPoint for adding text boxes or drawing on top of content, which I share more about in How To Modify Accessible Anatomy Graphics For Low Vision
- There are several tactile image libraries that incorporate large print high contrast diagrams, which I write about in Free Braille Art and Tactile Image Libraries: World Braille Day 2024
- While this is more “technical”, another helpful tool I have used to create diagrams is Mermaid, which uses markdown syntax to generate images. This is helpful for understanding how different display elements connect. Mermaid | Diagramming and Charting Tool
Published July 13, 2020. Updated January 2025