Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 18 Next »

\uD83D\uDCD8 Instructions

Section 5.1: Alternative Text

All images regardless of their complexity need to have an Alt text in some way. Alt Text is a brief description of your image that is 150 characters or less. This Alt Text is meant for any image that has meaning within the context of the document. Screen readers cannot read images to the reader, so Alt text acts as a substitute. To add an Alt Text to your image,

  1. Right-click the image and select Edit Alt Text.

  2. Type the alt text in the menu that pops up to the right. Use 150 characters or less.

    A slide showing places to visit in Tokyo Japan with a photo of Tokyo and Mount Fuji at sunset.
  3. If the image is decorative, write the word Decorative as the alt text (do not check the box that says "Mark as decorative").

    A powerpoint slide with a decorative image. The Alt Text panel in open to the right with Decorative in the text box.

Our decorative image has an Alt Text that says “Decorative”. The Mark as Decorative checkbox is unchecked.

An Alt Text description that lacks details.

This example of Alt Text fails to describe all of the details in the image.

Example of a good alt text that is descriptive.

This example of Alt Text is much better. It describes many details in the image so that the reader has a better idea of what is in the picture.

Section 5.2: Labels on Charts and Graphs

Data labels are very important for accessibility purposes. If data labels are not present, then readers will have fewer queues to help them read the information. Charts, tables, and graphs can become completely inaccessible without their labels, so always add them.

To add data labels, click on your chart, and click the Chart Elements Plus sign in the top right corner. Choose which data labels you want to use and customize them so they are visible but does not distract from the chart itself.

A pie chart on the most popular sports in the USA without data labels.

This table does not have any data labels on it. A person who is color blind may have trouble knowing the differences between the sections and categories.

A pie chart on the Most Popular Sports in the USA with data labels.

This table has the data labels. Now a person who has visual disabilities can still know what each category stands for without needing color.

Section 5.3: Long Descriptions for Complex Images, Pie Charts, and Bar Graphs

When using complex images like pie charts or bar graphs, it is better to use a long description rather than Alt Text. Alt Text is meant to be brief, while long descriptions give you a bit more freedom to explain the image. There are many ways to create a long description including:

  • Describing the complex image in text below the image.

  • Adding a link below the complex image.

  • Providing the data from the image in text form.

Make sure the long description is visible to all users. Even if they are links, or buttons.

A pie chart on the Most Popular Sports in the USA without a long description.

This pie chart is missing a long description. This will be an issue to readers who cannot see at all or can see very little.

A pie chart of the most popular sports in the USA with a link to the text description

This pie chart is now accessible due to it having a link. The link will take the reader to a long description or index when clicked.

A pie chart of the most popular sports in the USA with a long description of the chart underneath it

This pie chart contains a long description that tells the screen reader and reader exactly what is on the pie chart. This will make it much easier for the reader to understand the chart, and the statistics, and learn at a faster pace.

A pie chart of the most popular sports in the USA. The pie chart provides alt text explaining that the data can also be found in the table below.

This pie chart is also accessible because it provides Alt Text directing the readers attention from the pie chart to the table. A reader may have a difficult time reading a pie chart, to remedy this, create a table underneath the chart with the same information. This will give them the ability to get the information they need.

Additional Types of Long Descriptions

When you use complex images, you must describe it using Alt Text and have a longer description.

A slide with an image of the Hagia Sophia with Alt Text but no long description.

This image of the Hagia Sophia in Turkey has an Alt Text. However, there is no long description.

Image of the Hagia Sophia with alt text and a link to a long description.

This image of the Hagia Sofia has an alt text. There is also a link to the long description that will go into more detail about what is in the picture.

Section 5.4: Watermarks and Backgrounds

Watermarks and background images should not be used. They will interfere with peoples ability to read the page. Watermarks and backgrounds tend to be very distracting to most readers. It is best to use a background that does not interfere much at all with the text on the slide.

A slide on for the Introduction to the Stock Market.

This slide has a background that is very distracting to readers. These should always be avoided when making a presentation.

Introduction to the Stock Market slide with a non distracting background.

This background does not interfere with the text and gives the PowerPoint a very professional look.

Section 5.5: Text Boxes, Shapes, and Other Floating Objects

PowerPoint differs from Word in one very significant way: floating objects are easy to navigate and make up the very nature of the entire slide. The title field in a slide, for instance, is a text box. However, unlike in Word, where navigating text boxes with a screen reader is tedious, in PowerPoint, a user just needs to tab around the slide and each object will be selected, announced, and the alt text (if present) will be read.

You do not need to add alt text to text boxes, since the contents are directly read by a screen reader, but you MUST add alt text to other non-text objects, including shapes and icons (and of course, images, graphs, charts, etc.).

Its better to not use any floating objects in PowerPoint. Floating objects are not part of a documents structure. When they are brought into an essay or article, they can disrupt the flow and make it very difficult to read. JAWS 18 and newer can read some floating objects at their anchor or insertion point. However, they cannot read text boxes (the alt text is not automatically read). JAWS users can also use Control>Shift>O to access a list of floating objects. The issue here though is that they can easily be read out of order or violate the flow of the text. NVDA can also read some floating objects in the drawing layer, but only if they are inline with the text.

Inline Objects are more accessible for readers. The only way you can use Floating Objects, is by making sure they are inline with the text. If this cannot be done, do not use Floating Objects.

How to make Text Boxes Accessible

Generally, screen readers cannot access the text box. Despite this, there are still ways of making a text box accessible to all readers.

  • Create a warning or alert to the reader that there are text boxes and how to access them.

  • Position Text Boxes inline with the text.

  • Text boxes should be given Alt Text.

To create a text box, use the following steps.

  1. Go to the Insert Tab.

    Insert Tab with an orange line in PowerPoint.
  2. In the Illustrations Panel, click the Shapes Button.

    Shapes button in Microsoft Word
  3. Click Create Textbox in the upper left corner of the dropdown menu.

A textbox with the text - The sentence is inside a text box

A text box is used above. There really was no reason to put it inside a text box. Placing it on the slide itself would have meant the exact same thing.

A bullet list of why Accessibility Matters.

There is no text box used and the text is on the slide as it should be. When you create a slide, text boxes are made automatically so the text should go into those boxes instead of ones you made.

Create a Warning or Alert to the Reader that there are Text Boxes

Text boxes with out a warning or notice of their existence

These text boxes do not have any warning or alert. Now the screen reader will look past them and the readers would have no idea they are there.

A slide with three text boxes and a notice of how to use them.

These text boxes now have that important warning, including instructions on how to access the text boxes.

Text Boxes should be given Alt Text

A text box with the Alt Text panel blank

Alt text for a text box is not read automatically, but you should still create an alt text for readers. Its always good to get into this habit, especially since technology improves at a rapid pace.

A text box with Alt Text in PowerPoint saying Text Box 1.

This text box has alt text and it describes, in short, what the content is in the text box.

Section 5.6: Smart Art

In order for Smart Art to be accessible, only two rules must be followed.

  • The Smart Art has to be inline with the text.

  • You must provide an Alt Text for the Smart Art.

The Smart Art has to be Inline with the Text

Example of a slide with smart art interrupting the text.

When the Smart Art is not inline with the text, it integrates itself into the text. This causes a huge mess of space. The smart art forces all of the words to clear away and it blends itself poorly into the paragraph.

Example slide with an smart art not interfering with the text.

This Smart Art example shows it outside of the text. The Smart art does not interfere with anything and adds a good look to the page.

The Smart Art must have an Alt Text

Project Water Cycle Smart Art without Alt Text.

There is no Alt Text, so the reader and screen reader will ignore this image and move on. There is important information in the graph, so always include an Alt Text.

Project Water Cycle Smart Art with Alt Text.

An Alt Text has been included in the Word Document. The alt text explains exactly what is in the graph and describes the graph itself.

Section 5.7: Shapes

Shapes cannot be read by screen readers because it is considered to be floating content. Each screen reader treats shapes differently. NVDA announces the shape as “slash”, but does not read the alt text. JAWS announces the type of shape and the size, but does not read the alt text. VoiceOver automatically reads the alt text and announces that it is a shape, but not what shape. In short, there is no good way for shapes to be read yet. When creating shapes, follow these rules to make them more accessible.

Rule 1: The individual shapes may not be meaningful, but the overall drawing might be.

Rule 2: Provide Alt Text to only one of the objects.

Rule 3: Make the shape inline with the text. To do this, right click the shape, go to Wrap Text > In Line with Text.

Why accessibility matters bullet list with a star smart art in the middle of the text.

The shape is not inline with the text. With the shape overlapping the text, the shape could interfere with a person ability to see the text.

Why Accessibility Matters bulleted list with a star smart art outside the text.

The shape is now inline with the text. This presents a more organized look for the page, and nothing is distracting the viewer.

Rule 4: It is always recommended to add Alt Text to a shape. To do this, right click the shape. Then click Edit Alt Text. In 100 characters or less, describe your shape.

Rule 5: For exporting to HTML and EPUB, take screenshots and supply alt text.

Rule 6: A user must be alerted to meaningful shapes in the document.

Section 5.8: Using a Series of Shapes

A series of the same shapes or images should be grouped. They should also be given alternative text and a long description. You can group them together by right clicking each of the shapes and pressing Control G.

Movie Rating with 5 stars. Four of them are filled and one is blank. The stars are all separate items.

These shapes are inaccessible due to them not being grouped. The Alt Text is also only applied to one star, and is not a good Alt Text example.

Movie Rating with five stars grouped together. Four out of five starts are filled. Alt Text is included.

These shapes are accessible because they are grouped together. The Alt Text is also more descriptive of what the shapes mean.

  • No labels