Images

Using Images in Your Course

Images can be added to break up large section of text or to emphasis a point.

Like this cat, you may want to stretch a bit before we get going.  

Cat stretching outside on the sidewalk

No one questions the power images can have in a course; but how images in the presentation of information for lectures and other course materials are used is important. 

For our this workout, we are going to look at adding alternative text or alt text to images in Canvas. Alt text is used to describe an image. When writing alt text, it may be helpful to consider how you might describe the image to someone over the phone. 

Ready for the calorie burn? Here we go.

Giving images alt text allows screen readers to explain the image to people with sight challenges and it can also be useful when an image doesn't load correctly. 

By default, the alt text of newly added image is the name of the file including the file extension (i.e., .png or .jpg), but it should be replaced with a short description of the image. It should briefly, but clearly, describe the image as what meaning it brings to to the content. 

When adding alt text, there is no need to include "image of" or similar. Screen readers already include the statement when announcing the image.


Choosing Images

We encourage faculty to use images that are creative commons (CC) licensed. Pexels Links to an external site., Pixabay Links to an external site., and Unsplash Links to an external site. are some great sites to search for images. 

Decorative vs. informational images

Not every image needs alt text. A decorative image is for visual enhancement. If an image is marked as decorative, a screen reader will skip over it. Decorative images do not need alt text. Directions for how to mark an image as decorative are below.

An informational image is one that has content a student needs to see. In these cases, an image needs an alt text.

Directions for Adding Images and Alt Text as a teacher

  1. On the page you want to add the image to, click the Edit icon in the upper right corner of the page.
  2. Next, click into the page where you want the image to appear and place the cursor where you would like place the image.
  3. In the Content Selector located to the right of the Rich Content Editor select the Images  tab.
    Location of the images tab of the content selector

  4. To add your own image, select Upload a New Image.
    Location of Upload a new image option

  5. Click the Choose File button and find the image on your computer, select it, click Open or OK. You will have the option to add Alt text to describe the image or mark it as a decoration if it does not add meaning to the content.
  6. Then select the Upload button. The image will immediately be placed where your blinking cursor was located.
    Image showing how to choose a file, add alternative text, and upload

 If you need to go back and edit the Alt text, click on the image once so it is highlighted, and then select the Embed Image icon on the second row toolbar within the Rich Content Editor. 

Embed image attibutes

Click the Update button to save your changes.

Image of where to add Alt-text and how to mark an image decorative

NOTE:

  • File extensions (i.e., .jpg and .png) should be removed from Alt text.
  • Not all images require descriptive Alt text; if an image is used only for visual enhancement, then check the Decorative box.