Creating Accessible Documents

Relevant to: faculty, staff, and students

This article contains information considered accurate at the time of publishing. Technology updates, changes in University security practices, policies and procedures may effect the information in this article - updates to articles are scheduled on a periodic basis and will address any required changes.

Introduction

Empire State University has a legal and moral obligation to ensure that our electronic documents are accessible to students, faculty, and staff with disabilities. For this reason, when creating any new document (even purely internal documents), you should make the document accessible. This article will cover the basics of accessibility that you have control over when creating or editing a document. Additional information on this topic can be found on the US Dept. of Education website here: ED Accessibility Requirements for Electronic Documents, and SUNY information can be found here: SUNY Website Accessibility.

It is important to make documents accessible for individuals who are blind, have low vision, are deaf or hard of hearing, or have a disability which impacts physical movement. Some individuals require the use of assistive technology, such as screen readers, to navigate documents; screen readers rely on certain cues and landmarks on the page, such as headers or alternative text. Some examples of things to keep in mind:

  • A user who has low vision may have difficulty reading text if there is insufficient contrast between the foreground and background colors.
  • A user who is blind may rely on alternative text (alt tag) to access images in a document.
  • An individual using a screen reader may not be able to access information in a table if the table does not include properly marked headings.

The following topics focus primarily on accessibility for documents created in Microsoft Word and PowerPoint. Many PDFs are originally created in Microsoft Word, so it is important to keep accessibility in mind when originally making the document, so that it remains accessible when it is converted to PDF. See the Microsoft resource: Make Your Word Documents Accessible and the Adobe InDesign resource: Creating Accessible PDFs.

Headings

Screen readers rely on a document having properly built headings to make for accessible navigation. Word can create these headings easily for you from "Styles."

Styles menu in Word showing Heading 1 selected

In the above image, Heading 1 is currently selected. When creating a document, be sure to properly format your document with these styles. Your page should have a logical, hierarchical order, starting with header 1 (only one per page -- and most basic web pages in our CMS have this built into the "Heading" field, above the Body), then header 2 (as many as you want) if you require sub headers and then the content of your document. Do not skip heading levels.

Here is an example of a page layout you might see in a document:

  • Heading 1
    • Heading 2
      • paragraph
    • Heading 2
      • Heading 3
        • paragraph
      • Heading 3
        • paragraph
    • Heading 2
      • Heading 3
        • paragraph
          • Heading 4
            • paragraph
      • Heading 3
        • paragraph

Heading 1 would be the highest level heading on the page and Heading 2s would be relevant sub-headers to Heading 1. It's perfectly acceptable to not use sub headers if your document does not require them; a very simple document may consist of just a Heading 1 and Normal content (paragraphs, lists, tables for data, etc.). It is important not to skip heading levels.

There are a number of different styles available in Word that can customize the look and feel of your document. You can change the look of your document from the Design tab. Just be sure to make use of these styles to keep your page accessible. Never attempt to create your own headers by just resizing text - this will not be recognizable as headers to any user who relies on assistive technology to read the document.

Links

Descriptive Links

When a screen reader moves to a link it will start to read out the text of that link. For this reason the text of a link should be descriptive of where the link is going - not just a long URL. For example, see the following two links which both go to the same page:

The second link is better than the first because it will be more accessible to someone using the page with a screen reader - instead of hearing the link spelled out to them, they would instead just hear a descriptive name which is much easier to understand. This applies to both digital documents and websites.

Unique Links

Another thing to keep in mind with links in a document is that every link on a page needs to have a unique name - links can only share a name if they both point to the same page. This helps to avoid confusion for users who are using screen readers by making it obvious where each link is meant to go. See the following examples:

Bad Example

In this example there are two major issues:

  1. The links are not descriptive of where they go.
  2. All 3 links share the same name ("Link") even though they each point to separate pages.

This would be very difficult to navigate with a screen reader. You will also want to keep an eye out for links that point to pages with similar topics on separate pages and be sure that they all have unique names. For example, if you have two links on a page for Admissions Requirements and Admissions Checklist, make sure that each is uniquely named and both aren't just links with the name of "Admissions."

Good Example

In this example, the issues of the previous example are avoided. These links are unique and descriptive.

Images

Many individuals who are blind or have low vision rely on screen readers to give them information about an image. This information about an image is located in what are called alt-tags or alt text. If this text is not present then the user may not know what information an image contains.

In Microsoft Word, you need to manually add alt text after putting an image into your document. This must be done for every image. To add alt text just right click on the image in your document and then choose "View Alt Text."

Screenshot of Empire State University logo in Microsoft Word showing how to add alt text by right clicking on the image and selecting View Alt Text.

Then, write alternative text for the image (remember to include any text in the image). Note: you do not need to state "image of..." because a screen reader will already signal to the user that they're encountering an image. In the example below, the alternative text is "Empire State University logo on blue background." Avoid using the "generate alt text for me" button because it will likely not be an accurate description of your image.

Screenshot of alternative text window in Word, with sample alternative text that says Empire State University logo on a blue background.

Tables

Tables have the potential to be unreadable for screen readers if they are not formatted properly. If you are making a document with a table there are a few important factors to keep in mind.

Simple Tables are Better

Screen readers keep track of their location in a table by counting table cells. If a table is nested within another table or if a cell is merged or split, the screen reader loses count and can't provide helpful information about the table. Blank cells in a table could also mislead someone using a screen reader into thinking that there is nothing more in the table. To ensure that tables don't contain split cells, merged cells, nested tables, or completely blank rows or columns, use Word's built in Accessibility Checker.

Use Table Headings

When making a table, be sure that your table contains at least one row or column of headers. Do not just make your own headers by making a row/column bold - this will not be interpreted properly as a header by a screen reader.

To make sure your table has headings, select your table in Word and look under the "Design" tab at the top of the page. On the left hand side, ensure "Header Row" is selected.

Heading layout design menu. Includes preset styles and boxes to select Header Row, Total Row, Blended Rows, First Column, Last Column, and Blended Columns.

If you want to change the look of the table, using one of the preset styles from the top of the page is a good way to help ensure it remains accessible.

Color and Contrast

Using color in your document is fine, however you need to keep in mind that certain color combinations may make it difficult for users with visual disabilities (such as color blindness or low vision) to make sense of your document. The following are some things you need to keep in mind.

Information Through Color

People who are blind, have low vision, or are colorblind might miss out on the meaning conveyed by particular colors. Avoid using colors alone to convey any meaning in your document - do not use color codes to differentiate information unless you are also providing an alternative means for people to understand that information without color. For example, if you have some text in red, you can also include an *asterisk next to the red text, so that there are two ways to signal its importance, one of which does not rely on color.

Think - "If this document were to be converted to black and white, would anything be lost?" If yes then you will need to re-examine the design of your document and find another way to make that information clear.

Contrast

While some stylization of your document is fine - adding a background and other visual effects - you need to keep in mind the contrast any text has with the background you have chosen. If your text is at all difficult to distinguish from your background it is likely inaccessible.

As a general rule, try to avoid changing text color from black, as many other colors may be more difficult to read. Using a plain white background is safe, however if you do use a background with color make sure it provides sufficient contrast. If you are not sure if the contrast is sufficient between two colors, you can check them using a color contrast resource, such as WebAIM's Contrast Checker.

Print Article

Details

Article ID: 11026
Created
Fri 6/9/23 11:55 AM
Modified
Thu 4/25/24 1:49 PM