How to make PDFs accessible

Diagrams include flowcharts, process maps, structure charts and infographics. They use images and text to show how things work or are organised.

Diagrams often use layout, colour, lines and arrows to convey meaning. This can help people engage with and understand complex information. 

You must make your diagram accessible so it:

• Is clear and easy to understand
• Can be understood by people using assistive technology. For example, screen readers and tools that change text size, spacing or colour.

How to check diagram accessibility

Design

If you include a diagram in your PDF, it must:

• Show information in a consistent, logical way 
• Be simple - try to stick to one idea per diagram 
• Have horizontal text only 
• Make it clear where the starting point is if it has one 
• Avoid overlapping arrows or lines 
• Use simple shapes - and as few different types as possible 

Colour

You might use colour coding in your diagram. If you do, you must also use text, shapes or patterns to ensure that people who find it difficult to see colours can still understand it. Include a legend/key to explain what any shapes or patterns mean.  

You must also make sure any colour combinations you use have good colour contrast.

Formatting

Simple diagrams 

Simple diagrams with a clear left to right and top to bottom reading order should be formatted using: 

• Text - this must be formatted as text rather than part of an image 
• Decorative images only - these are images that don't add information to the diagram 

For example, the 'How to grow turnips' diagram in our accessible PDF example (PDF, 970 KB) has arrow images and text. It makes sense when reading the text from left to right and top to bottom. The arrow images correspond with the reading order, so they don't add information to the diagram. They are marked as decorative.

This screenshot shows that the diagram text is tagged and in the correct order. The arrow images don't have tags because they have been marked as decorative.

• You must use Adobe Acrobat Pro to check the reading order is correct - follow our PDF programmatic reading order advice
• Visit our PDF images accessibility page to find out how to decide if an image is informative or decorative, and how to check if an image is marked as decorative 

Complex diagrams

More complex diagrams may have multiple reading orders or informative images.  

For example, you could read a structure chart in several different orders. It also has lines that explain how people relate to each other. 

Complex diagrams, like structure charts, must be formatted as a single, flat image. The image must be good quality, so it remains clear and easy to use when a user zooms in up to 400%. 

The diagram must also have a text description, so all the information the diagram image shows is available in text format. 

How to make diagrams accessible

If you find that any diagrams in your PDF aren't accessible, you must fix them.

Edit the source document

Most PDFs on our websites were created in Word originally. The easiest way to make diagrams in your PDF accessible is to edit the source (Word) document, then reconvert it to a PDF. 

If you need to go back to your original Word document:

• For help formatting your graph or chart as a single, flat image, go to our advice on how to make diagrams accessible in Word
• For help marking an image as decorative or providing a text description for your diagram, go to our advice on how to make images accessible in Word 

You may find our Word accessibility advice useful even if you used a different application to create your PDF.

Edit the PDF

Visit our PDF images accessibility page to find out how to provide a text description or mark an image as decorative in a PDF using Adobe Acrobat Pro.

Diagram alternatives

If you find it difficult to make your diagram accessible, consider these alternatives:

• Present information using clear structured text, including things like headings and bullet points. For example, like the text under the diagram on this  accessible procurement flowchart page
• Present ordered information or instructions as a numbered list
• Present visual information using video - follow our video and audio accessibility guide