HomeTN eCampus FacultyAccessibilityDecorative Images in Brightspace

10.7. Decorative Images in Brightspace

Course Images

Images can be an important part of any course. Images may enhance information or contribute to the understanding of text content. Those types of images need alternative text to be accessible. Other images are purely decorative and add no content value. Those types of images need to be correctly tagged as decorative in the alt text field add two quotation marks (“”) or "Null" in the alternative text field.

Which images do not need descriptive alt text?

You can learn more about decorative images at W3C Web Accessibility Initiative (new window).

 

Decorative or Substantive

Is this image decorative or substantive to the content?

 

That is a judgment call. This could be a whimsical or decorative image on a page, but there could be a number of ways to use this image in a meaningful way. The intent of the image depends on the context it is used.

Adding Images

Before you can add an image to a course page, you must add the file to the appropriate folder in Managed Files. Take a look at the steps to add an image and the appropriate alt text. Select and edit the page that needs an image. Choose the image (camera) icon from the menu.

 

Choose Course Offering Files to access the image file.

*Please note, the other options will add images to your course pages, but the files will not be stored in Brightspace for cloning and future uses of the course.

 

 

Navigate to the folder storing the image file. To preview the image, choose the file name first. Choose the radio button and choose Add to place the image on the course page.

 

If the image is decorative, there are two options:

 

Choose either procedure, but do not use both. This course has the same image twice, but the alt text is different.

 

Take a look at the HTML code to see the difference.

The first image is enclosed in a green border with the alt text in a red border. The second image is enclosed in a tan border with the alt text in a red border. A screen reader will work with each correctly by skipping the image. The second image will be flagged by Brightspace ’s accessibility checker. Brightspace uses this opportunity to guide users to double-check there is no useful description of the image.

Knowledge Tags

This page was: Helpful | Not Helpful