This is available for Authors.

Authoring accessible questions involves using best practices to create questions that candidates with visual impairments can use. 

This article provides an overview of best-practice methods for authoring accessible questions, and it explains how to ensure image quality, use proper color contrast, label questions and prompts correctly, and write good alternative text.

Keys to visual accessibility

A screen reader is a type of assistive technology that turns text and image content into speech or braille. The methods explained in this article will help you create accessible questions for candidates with visual impairments, such as low-level vision, color blindness, or blindness.

The following methods we will cover:

• Ensuring image quality
• Labeling questions/prompts
• Writing alternative text
• Writing good alternative text

Ensuring image quality and contrast

Make sure your images are high quality. You can check an image's quality by zooming in to 400% to look for pixelation. This is especially important for candidates with low vision who often magnify the page. Pixelated images can be difficult for candidates to understand.

Use proper color contrast

You can choose to display the hotspot areas for the Hotspot question type questions and select the color of the border that outlines these areas. This helps to visually distinguish the selectable areas from the background, making it clear to candidates which areas they can select from.

When you choose a color, make sure it has enough contrast against the background. This ensures clear visibility for candidates with low vision or color blindness. The WCAG 2.1 guidelines for accessibility recommend a minimum 3:1 contrast ratio between foreground and background colors. By meeting the WCAG 2.1 guidelines, you can ensure that your Hotspot-type question is accessible to a wider range of users, including those with visual disabilities.

To check if your chosen color meets the recommended contrast ratio, you can use a color contrast checker or a similar tool.

See the examples below for best practices.

• We need to mark the hotspot where the figure is standing. 

  If the image is dark
  The dark color border makes it hard to see the marked spot.	The light color border and reduced opacity of the background makes it easy to see.

• We need to mark the hotspot in Australia on this map

  If the image is light
  The light color border and lesser background opacity make it hard to see the marked spot.	A slightly darker color border and increased opacity of the background make it more visible.

• We need to mark the hotspot to the circular windows.

  If the image is very busy
  The light color border and lesser background opacity make it difficult to see the marked spot.	The fluorescent-colored border and increased opacity of the background make the hotspots more visible.

Label questions and prompts

A prompt is an explanation of text for a question. It helps separate the question's description from its alternatives. The prompt appears below the question text and above the alternatives. Select one alternative is a default setting.

You can edit a question's prompt by clicking on the interaction in the text editor and choosing the Prompt option.

Add rich text

You can format plain text by clicking Edit rich text under each Prompt. In the rich text editor, you can make the text Bold, Italic, Underline, Subscript, Superscript, and Math.

Note: The prompt text is bold by default and will change to plain text once you begin editing the rich text.

Write alternative text

Alternative text, or alt text, is a description added to images so that assistive technology can give blind and visually impaired users a description of the image. If an image is unable to load, the alt text will also display in its place. All images should have a well-written alt text description.

Add alternative text to images in Inspera

After you upload an image in the authoring tool, a pop-up window will appear where you can add the alternative text. To update the alternative text for an image that is already in a question, right-click the image in the editor and select the Edit alternative text option.

Write good alternative text

Good alternative text gives blind candidates the same level of information as sighted candidates. 

• The description can be as long as you need it to be to provide the right level of detail, but it should be concise and to the point. If an image contains text, you should also include that text in the alternative description.
• Screen readers already tell a user that an image is an image, so avoid starting your alternative text with "Image of." In some cases, you can allow this, for example, when you are comparing a photograph and an illustration of the same subject.
• Cosmetic elements without meaning do not require alternative text. For example, a decorative image used as a separator between two blocks of text does not need a description.
• The alternative text should not give away any answers. For example, if a question asks "What breed of dog is displayed here?", "Huskies in the snow" would give away the answer. In that case, a better alternative text would describe the physical characteristics of the dog instead of the breed name.

• 

  • Bad alternative text:

    “Image” (doesn’t say what the image is about).

    “Image of dogs” (“image of” is redundant)

  • Okay alternative text:

    “Dogs” (it mentions the subject of the image, but nothing else)

  • Good alternative text:

    “Huskies in the snow” (it gives a more accurate description of the subject)

    “Five Huskies pulling a sled in the snow“ (it also describes what the subject is doing)

Alternative text for charts and complex images

When you include charts or complex images in a question, the alt text should provide context for understanding the visual. You should include the type of data and the reason for including the chart. You can also include a link to the data or source of the chart within the question, but do not include it within the alt text.

• 

  Alt = Line chart of clicks within the Help Center for the past 7 days, where clicks reached a maximum of 1700 and a low of 500.

Alternative text in PDFs

Our recommendations for alternative text in PDFs are:

• Avoid using images.
• Add alt text and export the PDF correctly.
• Write the alt text as a caption underneath the image.
• Avoid using binary images. Use text or vector graphics that a screen reader can access directly, or avoid using PDFs entirely.