Skip to Main Content

Digital Accessibility

Information on digital accessibility for content creators.

Word Processor Documents

Word processor documents (created in Microsoft Word, Google Documents, LibreOffice, and other similar programs) may be used for sharing and archiving important information including reports, scholarship, and teaching materials. By following best practices, these formats can be made accessible for all users.

Jump to a section on this page:

Text

Text forms the majority of the content in digital documents. Making text accessible means using structure and style to ensure that all users can perceive and understand the text itself and the relationships within its parts.

Headings

Headings are short phrases or titles that describe sections of text on a page. They are distinct from regular body text and communicate the organization of content. To be accessible, they should be used in a meaningful, ordered hierarchy and should make use of proper encoding.

 

Order and Hierarchy

In digital documents, every heading has a level or rank: Heading 1, Heading 2, Heading 3, and so on. These headings should be used in a meaningful hierarchy to form a document outline.  

 

Encoding

If headings are merely styled to look important, but not marked up in the code, web browsers, plug-ins, and assistive technologies cannot detect them, meaning that they are essentially not there for a broad range of users and technologies.

 

Create properly encoded headings by using the HTML tags for headings or by selecting Heading 1, Heading 2, etc. from a drop down menu in the text editor. The result is the same: proper HTML heading tags are applied to the underlying code.

 

<h1>Symposium Schedule</h1>
  <h2>Friday</h2>
    <p>Dinner for participants at 6:00 pm</p>
  <h2>Saturday</h2>
    <p>Breakfast and welcome at 9:00 am</p>
    <p>...</p>

Links

Links are a key part of much digital content. Making links accessible means making them perceivable (links should be visually distinct from surrounding text) and making the purpose or destination of the link understandable. As much as possible, the text of the link should itself communicate the destination or purpose of the link by being meaningful, understandable, unique, and efficient.

 

Meaningful

Link text should be understandable and should describe its purpose or destination, most often using the exact language of its destination.

 

The link to a page titled “Fine Arts Library” should read, Fine Arts Library, not “Our Library” or “more about this library.”

 

Understandable

Link text should make sense to a human reader. The complete URL’s of webpages are usually not understandable and should generally not be used as the only indication of a link’s destination.

 

The link to the “Penny W. Stamps School of Art & Design Diversity, Equity and Inclusion Strategic Plan” should read, Stamps School of Art & Design DEI Plan, or similar, not  https://stamps.umich.edu/pdf/DEIPlan2017-2018.pdf.

 

NOTE: in digital documents, when some users are likely to see a printed or offline version of the content, a complete URL may be useful to include in addition to link text. For example:

 

See the Stamps School of Art & Design DEI Plan, at the following URL: <https://stamps.umich.edu/pdf/DEIPlan2017-2018.pdf>.

 

Unique

If several links within the content lead to different destinations, the text of each link should be distinct. Similarly, if several links lead to the same destination, their link text should be identical.

 

The links to pages titled “Group Tickets” and “Senior Tickets” should read, Group Tickets and Senior Tickets; neither should simply read, “Tickets.”

 

Efficient

Link text should be no longer than necessary and should put unique information first. Note that “unique” information depends on context.


The link to the page titled “Undergraduates - American Culture,” when linked from within the American Culture website should read, Undergraduates - American Culture or Undergraduates; when linked from a list of programs at U-M should read American Culture - Undergraduates.

Lists

Lists are a structural element that indicates a relationship between text. There are 2 types of list, and each has a specific function.

Unordered lists

Unordered lists (with bullet points) are used when there is no order or sequence of importance.

Ordered lists

Ordered lists (with sequential numbers) are used when the progression or sequence is meaningful.

Lists make content more accessible by making it more readable, and communicating hierarchical relationships over different devices and assistive technologies.

Font

Avoid complicated or decorative fonts. Choose standard fonts with easily recognizable upper and lower case characters.

Avoid ALL CAPS.

Sans serif fonts are easiest to read for longer portions of text on a screen, serif fonts are easiest to read for longer portions of text in print.

Size

For print, font size 12 is standard, 17 is large font.

Color

Color can be used to enhance digital content, making it more perceivable and understandable. This can be accomplished by maintaining good contrast between foreground and background colors and by using color as one means among many to highlight elements.

Color Contrast 

to make text perceivable, there must be sufficient contrast between text color and the background or surrounding color. Contrast is basically the difference between lightness and darkness, regardless of the color or hue. As long as one color is dark enough and the other is light enough, text and background can be any colors—although neutral colors are often easiest to read.

Color and 

Because color cannot be perceived by all users with all devices, color should be used along with other means to highlight elements or express meaning. For example, the bars in a bar graph can be distinguished by color and text labels; a missing assignment in a spreadsheet can be indicated by color and the absence of a check mark. When this is achieved, the page can be viewed in grayscale without losing any information.

Images

Visual media and images are key elements of web content. Making them accessible means including “textual equivalents” for all visual elements. A textual equivalent is text that can effectively replace the image in cases where the user cannot access the original, and should serve to communicate whatever the image communicates in this particular context.

 

Textual equivalents can be adjacent to visual media or can be embedded in the code (usually as “alt text” that is accessed via assistive technology or displayed when the image fails to load).

 

Alt text

Alt text refers to an element of code that is connected to an image file. Insert alt text by finding the “alt text” or “description” field in the image upload options.

 

Keep in mind that alt text should:

  • communicate meaning or purpose of image
  • serve as effective equivalent to image
  • be present for every image file, and should be blank or null (<alt="">) when the image is not meaningful in order to direct assistive technology to ignore that image
  • be short, probably 200 characters or less

 

Text description

Sometimes it is more appropriate to put the textual equivalent directly in the web content, where it is available to all users. This might be the case where the description will benefit many users (e.g. analysis of an artwork) or where the textual equivalent is especially long or complex (e.g. a transcription of an image of a poster or document).

Last Updated: Nov 7, 2024 3:39 PM