Email

General
Email Accessibility Rule How To Fix

Use a descriptive subject line to draw attention to the email.

Descriptive subject lines allow users to know exactly what to expect. This is especially useful for individuals using assistive technologies.

When drafting an email, type a descriptive subject in the subject line.

Use proper ordered/unordered list structures.

Hand-created lists cannot be read properly by screen readers because a proper list structure is needed to inform users that a list is present. Lists convey a hierarchical content structure to screen reader users:

  • Unordered lists (bullet points) are used when list items can be arranged randomly.
  • Ordered lists (numbered or lettered) are used when a sequential order is important.

Use the built-in bullet or numbering tool to create an ordered or unordered list structure:

  1. Highlight the list items.
  2. Select either the bullet icon or the numbering icon.

Sufficient contrast between text and background is present.

People with low vision, poor vision, or color blindness often find it hard to read text that does not contrast with the background. Avoid the use of font colors such as pink, yellow and orange.

To edit text font color:

  1. Select the text.
  2. Use the font color menu to change light font colors to a darker shade; or if using a dark background, change dark font colors to a lighter shade. 

Clear descriptions are used for hyperlinks that convey where the link goes.

Screen reader users generate a list of links to assist in navigating a document; therefore, hyperlinks should be descriptive and clearly identify the target of the hyperlink. Redundant or ambiguous link text such as "More" or “Click here” should be avoided.

To add a hyperlink:

  1. Copy the URL (web address) you wish to use.
  2. Select the text you wish to make a hyperlink.
  3. Select the Hyperlink icon from the options.
  4. Paste the URL (web address) into the Address bar.
  5. Select Ok.

Multiple elements (i.e. color, underline, italics, etc.) are used to illustrate meaning.

Color should not be used as the sole method of conveying content or distinguishing visual elements. If color is used to illustrate a concept, be sure to provide alternative means of obtaining the same information or provide an explanation within the text itself.

Add additional elements to items in which meaning is illustrated through color alone. This could include underlining, or adding a note at the top of the document explaining that correct answers are underlined.

Keep in mind that color can be used with additional elements, as long as the contrast ratio of at least 4.5:1 for normal text and 3:1 for large text is present.

Select an easily readable sans serif font type; use a font size of at least 12 point (for printouts).

Select a font that is easily legible to benefit all users. Basic, simple sans serif fonts, including Tahoma, Verdana, Arial or Calibri were developed specifically for use in electronic media. Sans serif fonts contain no extra decorations or flourishes, making them highly legible fonts.

To edit the font type or size:

  1. Highlight the desired text.
  2. From the Font menu, select a font type.
  3. From the Font Size menu, select 12 or larger.
Images
Email Accessibility Rule How To Fix

Alternative text (alt text) is provided for all non-text content, including Images, Drawings, Elements (arrows, lines, etc.), or Charts.

Alternative text is a textual alternative for an image that makes it easier to connect the image to its context and allows users with visual impairments to perceive the image. Images that do not provide any meaning or content, also known as decorative images, should be identified as such. Images identified as decorative will be skipped over by screen readers so be purposeful when identifying images as decorative.

For Outlook Email:

  1. Right-click on the image, then select Add Alternative Text.
  2. Enter alt text in the text field.
  3. Select Ok.

For D2L Email:

  1. Within the HTML editor, select the Insert Image icon.
  2. Upload the desired image.
  3. Select Add.
  4. When prompted, enter alternative text or select the checkbox to mark the image as decorative.
  5. Select Ok.

Images do not have contrast issues.

Images that contain text with low contrast between the text and its background can cause the text to be difficult to read, especially for those with low vision, poor eyesight or color blindness.

If you have access to an editing program, such as Photoshop: Upload the image into a program to increase the contrast.

If you do not have access to an image editing program:

  1. Open PowerPoint.
  2. Insert the image to a slide.
  3. Under the Picture Format tab, adjust the contrast of the image in the Corrections dropdown menu.
  4. Right-click on the image to save it as a picture.

Images or other multimedia are not prone to induce seizures.

Animated images that contain flashing or contrasting lights or patterns can lead to seizures for people that suffer from photosensitive epilepsy. In addition, animated images with these characteristics can be generally unpleasant to look at, even for those not prone to seizures.

Find an alternative image. Do not use this image.
Tables
Email Accessibility Rule How To Fix

Table layouts are structured for easy navigation and proper reading order.

Users rely on the table layout to navigate through the content. Tables must be ordered logically for users to understand and navigate the content. It is important to ensure that the reading order of the table makes sense. Screen reader technologies read tables from left to right, top to bottom, one cell at a time (no repeats).

To test the reading order:

  1. Place your cursor in the first cell of the table.
  2. Press the Tab key repeatedly to navigate through the table.

This will be the reading order that assistive technologies follow.

Tables specify column header information.

Users rely on the table headings to understand the content that is subsequently read by the screen reader. Also, screen reading technologies often use the table header row to help convey to the user the current cursor location in the table and to provide information that enables the user to navigate the table.

Tables should not be used for layout purposes. If a table does not need headings (the top row or first column does not serve as a label for the data/info underneath/beside) then do not use a table.

For Outlook Email:

  1. Select the header row of the table.
  2. Right-click and from the Table Options menu, select Header Row.

For D2L Email:

  1. From within the HTML Editor, select the cells of the header row or column.
  2. From the table menu in the Editor, select Row, and then Row Properties.
  3. From the Row Type menu, select Header.
  4. Select Save.

This page content is offered under a CC Attribution license.

This page content is offered under a CC Attribution license.