Best Practices for Digital and Document Accessibility

Use these practices to ensure the accessibility of webpages and electronic documents. It is critical that ALA Content Editors are using these practices for all organizational resources. Find even more resources on the ALA Accessibility Microsite: ala.org/accessibility

Learn how to:

 

Apply proper page structure  

Why does it matter? 

Headings create an outline for a webpage, like a table of contents, and provides logical order for assistive technologies. Screen readers interact with structural elements on your web page by how the elements are labeled. When first arriving on a page, the screen reader will announce the page title to orient the user. Headings are used to both skim and navigate content, as they provide both structure and hierarchy to the sections of text appearing.  

Best practices 

  • Page titles should be brief but meaningful. Titles are critical to the understanding of the page and are announced by screen readers. Titles also appear in browser tabs and search results.
  • Apply heading in a logical order. Typically, starting with Heading 1 (H1) and subsequent sections of content being Heading 2 (H2), Heading 3 (H3) and so on.
  • Headings should be used instead of text size to indicate importance and structure. Changing the font size to be larger at the start of a new section of text does not provide any structural context for a screen reader.
  • You should not skip or change heading styles simply to make changes in text size. This will confuse the structure of the page and further confuse the screen reader.  

Where can I learn more? 

Build better text and color

Why does it matter?

Inconsistent text formatting and usage of color can be an access barrier for screen readers, can decrease overall page readability, and can limit content understanding for people with low vision or reading disabilities. 

Best practices

Building better text

  • Use consistent sans-serif font for paragraph text and at least 12 pt font
  • Avoid underlining text, as underlined text can be misinterpreted as link text by screen reader technology
  • Avoid italics and use bold for emphasis if needed (not for style)
  • Avoid using all caps for text, as screen readers might read this as individual letters

 

Using appropriate language

  • Be aware of your audience and what language best serves the content
  • Avoid jargon and figures of speech
  • Write in shorter, clear sentences and shorter paragraphs
  • Expand acronyms when first encountered
  • Use concise, plain language
  • Use inclusive language and avoid ableist terms, such as “crazy idea” or “blindly follows”

 

Building better formatting

  • Use built-in tools to create unordered (bulleted) or ordered (numbered) lists. If your lists are spanning more than 7 to 8 items, though, consider breaking things up
  • Left align your text to keep spacing consistent; avoid justified text because it can create inconsistent word spacing and decrease readability
  • Using headings to break up your page into readable sections
  • Avoid tables as solely a formatting tool! Instead, use unordered or ordered lists where information is not overwhelming to list 

 

Building better color choices

  • Use high contrast colors for the foreground and background. Black text on a white background, while aesthetically simple, is highly effective for accessibility.
  • Use words in addition to color to convey meeting to ensure that web content is understood with or without color. 

 

Build better hyperlinks

Why does it matter?

Screen readers can skim a webpage for hyperlinks and announce them to the user in one list. Having meaningful and unique text to describe each link is critical to understanding the role and actions of various hyperlinks.  

Best practices

Avoid raw web addresses in links—unless you are designing a resource to print and hand out. Screen readers will read the entire string of words, letters, and numbers in a web address one-by-one.  

  • Use unique text that describes the purpose of the link and clearly explains the link’s destination:
  • Sometimes you need to share URLs rather than just meaningful link text, such as for bibliographies, siting sources, or creating electronic documents for download or instruction. Use screen reader friendly URLs where possible that are descriptive of your page and avoid raw URLs:
  • Free tools like TinyURL or Bitly can create a limited number of shortened URLs. There is also an option to create a shorter URL “alias” in Drupal.
  • Buttons that function as links should be described in the alt text field in terms of their purpose rather than their appearance.  
  • If you modify the text color of link text, ensure that good contrast remains between foreground and background and that the underline remains in place.  

Where can I learn more?

Create accurate alternative text/image descriptions

Why does it matter?

Alternative text (or Alt text) enables users with vision loss to have a better understanding of the context of images within a page or section. Screen readers can recognize an image when encountered, but unless there is descriptive text added to the alt text field for that image, the image is inaccessible to the user. Drupal, along with any good software committed to better accessibility practices, will have an “alternative text” field that can be populated when uploading an image

Best practices

  • Context is important! Think about the image’s content, function, and intent as it relates to the page and written text.  
  • Keep descriptions brief and centered on the most important context the image is meant to convey.
  • Avoid using images as your sole means of information sharing. If you are using an image alone to convey meaning, make sure the alternative text provides the context of that image.  
  • You do not need to start your description with “image of” or “picture of” or “link to.” The screen reader technology is designed to recognize image files. But, if the image is a painting, cartoon, or screenshot, you should note that detail, as it provides necessary context.
  • Use appropriate grammar and punctuation in alt-text fields.
  • Don’t use alt-text if the image is purely decorative, like a border or image used solely for visual appeal. If the image is already described within the text on the page, you do not need to also describe it via the alt text field. 

Where can I learn more?

Create accessible audio and video

Why does it matter?

More and more people are captioning or transcripts when viewing videos or listening to podcasts, regardless of disability status. By adding captions, transcripts, ASL interpretation, and image descriptions to our video and audio content, we are not only lessening barriers to access for diverse learners and folks with disabilities,  but we increase opportunities for library students who are not native English speaker as well.  

Best practices

  • Only use videos that have captions either embedded in the file (open captions) or that can toggle caption view on or off (closed captions)
  • Subtitles and Captions are not the same. Subtitles provide translation of spoken content into another language while captions also describe additional audio, such as sound effects (i.e. a door slamming, an alarm sounding)
  • If you don’t own the video, reach out to the creator and ask if they have a captioned version or if they consider creating a captioned version to allow for greater accessibility
  • If creating your own caption files through Zoom or Vimeo (or other platform’s) automatic captioning tools, be sure to review and make changes to the text before sharing

Where can I learn more? 

 

Build better electronic documents 

Why does it matter? 

Many of the practices used to support website accessibility can be applied to the creation of more accessible electronic documents. We house a lot of resources on the ALA site in PDF format, and we also work heavily with slide decks, which can be inaccessible to assistive technologies (and non-AT users) if not created with access in mind. While remediation is possible, processes can be very time consuming and still result in barriers. The more we start building the habit of creating born-accessible documents, the larger our reach! 

Best practices 

  • Whenever possible, avoid PDFs as the primary document format! Instead, use HTML or EPUB, where appropriate
  • Create the document in Microsoft Word or other word processing document first before converting to a PDF.
  • Use built-in tools, like the Accessibility Checker, and check Properties when saving as a new file format to ensure maximum accessibility
  • Use Accessible Templates when building PowerPoint Decks and run the built-in Accessibility Checker to help ensure you have unique slide titles, correct reading order, adequate color contrast, and helpful alt text.

  • When scanning an image, use applications that ensure your scan is converted into a PDF that can have alternative text added.

     

Top 10 tips for slide accessibility

  • Use built-in slide layouts when creating new slides, as they are structured more accessibly.
  • Use a larger font size (18 as a minimum recommended) and use a sans serif font type.
  • Include meaningful alternative text on all images/visuals.
  • Add meaningful and accurate hyperlink text instead of raw URLS, since PPTs are often shared on digital platforms.
  • Use sufficient color contrast for text and background colors and ensure color is not the only means of conveying information.
  • Give every slide a unique title name—folks using screen readers rely on slide titles to navigate so having the same title for each slide is hard to navigate.
  • Avoid tables as stylistic choices where possible--use bulleted lists instead. If a table is needed, keep it simple and use table headers and alt text to describe.
  • Limit any slide transitions—complex animations are not often accessible to screen reader technology.
  • If your presentation has video, add subtitles, captions, or provide a linked transcript for attendees

  • Check reading order—a screen reader reads a slide in the order in which elements were added to the slide, so if you added the body text first and then the slide title second, the content could get confusing for assistive tech users.  

     

Test and review for digital accessibility

Free extension that can be added to your browser which does a quick automated scan for compliance issues, such as page structure, alt text, contrast, form fields, language. A great tool for units to use to get a baseline of their pages and what might need to be focused on via a staff training or to help inform contractors about what needs to be addressed. 

You can enter the foreground and background color codes of your page to double check contrast compliance.  

NonVisual Desktop Access (NVDA) 

Free screen reader tools to help test for errors a user might encounter if using assistive technology. 

 Windows Narrator  

Windows Narrator is a free screen reader tool built into the Microsoft Operating System. 

 

Non-Technical Accessibility Tests

A great tool for content editors to review web pages and identify where accessibility improvements may be needed.