Skip to Main Content

Marco Carrillo: Accessibility OER

Adjunct Librarian - LibGuide - Library Portal

Accessibility Compliance

Introduction to Accessibility

We want all textbooks and other educational materials created to be usable by all our students. Legally, this means the materials should be compliant with the Americans with Disabilities Act and Section 508 of the Rehabilitation Act of 1973. ADA and Section 508 compliance allow more students to access open educational resources and should be prioritized during formatting. The following pages describe key aspects of compliance applied to several file types.

Often, OER specialists will initially format in Word and then convert the file to a PDF. While Word does have an accessibility checker, the PDF accessibility checker is often used as the final test of a document’s accessibility.

Creating an Accessible Document

Documents created in Microsoft Word and Google docs can be quite accessible, but there are some tips that OER Specialists should use to ensure that the documents they create will not only be accessible in Word but also be accessible when transformed into other formats (Web pages, PDF documents, braille documents). To easily build accessible documents in Word (and other word-processing tools like Google docs and Open Office), the OER specialist will need to become familiar with the editing toolbars. Using the proper styles "tags" the document with hidden code that makes the document understandable to screen reader software.

The basic tips to keep in mind include the following:

  • Use styles to denote headings.
  • Use list styles to create numbered and bulleted lists.
  • Provide alternative text for all images.
  • Ensure headers within tables are tagged.
  • Ensure adequate color contrast between all text and the background.
  • Use tabs, not spaces to move words.

Tutorials

While word processing software used to vary dramatically, Word for Windows, Word for the Mac, and Google docs actually function very similarly! Here are a few terrific videos that will help the OER specialist get a bird's eye view of making documents accessible, and for Word users, a terrific online resource that should be bookmarked for future use:

To better understand the guidelines for designing electronic documents, please watch the following video presented by the OEI as an introduction to basic accessibility in MS Word:

Basic Accessibility in MS Word

Documents: Chunking and Headers (Windows, Mac, Google Docs)

Headings within a document--whether Word, Google Doc, PowerPoint, or PDF--should be used to separate content into "chunks" by identifying the main ideas or concepts of the page. Headings also identify a change in the flow of information on the page and allow individuals to visually scan the document for the desired information.

From an accessibility perspective, properly formatted headings are valuable as they provide individuals using screen readers with a simple method to navigate within a document. Rather than reading line-by-line through a document or web page, the use of headings allows individuals to move through the information based on heading topic.

To help students get the most from headings, follow these three rules:

  1. Ensure the headings are logical and descriptive.
    • There should only be one Level 1 Heading.
    • Use Level 2 Headings as the main topics. (A page may only require h2s.)
    • Use Level 3 for subtopics.
  2. Use Styles to denote headings.
  3. Maintain the semantic structure of the headings (don't skip levels).

Windows

To create headings in Word 2016 for Windows:

    1. Highlight the text that will be the heading (or place the cursor within the text).
    2. In the Home tab, select the appropriate heading style from the Styles.


Additional Windows Resources


Mac

To create headings in Word 2016 for the Mac:

    1. Highlight the text that will be the heading (or place the cursor within the text)
    2. In the Home tab, select the appropriate heading style from the Styles.  

If the window is small, the style may be hidden. Select Styles, and a drop down menu will appear. 


Additional Mac Resources


Google Docs

To create headings in Google Docs:

  1. Highlight the text that will be the heading (or place the cursor within the text)
  2. From the menu bar, select the Styles drop-down menu, and then select the appropriate heading level.

Styles can also be accessed from the Format menu. 


Additional Google Resources

Formatting Lists (Windows, Mac, Google Docs)

Lists can help transform dense sentences or paragraphs by making the material more visually accessible. Lists are terrific ways to:

  • present related ideas to students;
  • illustrate items in a group;
  • present pieces of a series; or
  • outline steps in a process. 

They also capitalize on white space, which can help make the content more visually appealing.

To make a list accessible, however, please ensure to use the list style. Simply adding sequential numbers or bullet icons before each line of text or item in the list does not make the list accessible. 


Windows

To create a list using Word for Windows:

  1. Enter each item in the list (separate items with a return).
  2. Highlight all the items in the list.
  3. Choose either bulleted or numbered list from the formatting ribbon.


Additional Windows Resources:


 

Mac

To create a list using Word 2016 for Mac:

  1. Enter each item in the list (separate items with a return).
  2. Highlight all the items in the list.
  3. Choose either bulleted or numbered list from the formatting ribbon.

 


Additional Mac Resources:

 


 

Google

To create a list using Google docs:

  1. Enter each item in the list (separate items with a return).
  2. Highlight all the items in the list.
  3. Select Format, then list.
  4. Choose the list style.

Google Docs formatting Lsts

 


Additional Google Resources

Google support: Add a bulleted or Numbered ListLinks to an external site.

Google Docs: Working with ListsLinks to an external site. (video)

Links to an external site.

Hyperlinks (Windows, Mac, Google Docs)

While hyperlinks are a helpful and simple way to quickly direct students to web-based resources, they can pose accessibility challenges when the purpose and destination of the links are unclear to screen reader users. Screen readers will identify all the links in the document and present them  in an alphabetical list for easy navigation, but the links need to be descriptive. To make the links accessible to every student, follow these rules:

  • Identify the purpose or function of the hyperlink as part of the hyperlink name.
  • Be as descriptive as possible without being overly long--the user will have to listen to the whole link before moving to the next link on the list.
  • Integrate the link into a sentence--sighted users will see the link, and screen readers will identify the link.

There are also a few things to avoid. Avoid using vague or repeated text for hyperlinks, such as Click Here, Read more, or Link. In addition, in keeping with the idea of being descriptive, links should not be URLs. Not only are most URLs not descriptive, they are usually very long.

Windows

To insert a hyperlink:

  1. Copy the URL of the linked website.
  2. Highlight the phrase that will be the link text (remember to follow guidelines for link text).
  3. Select Insert from the menu bar, select links/Hyperlink(depending on the size of the menu tab).
  4. Paste the URL into the Address field of the dialog box, then select OK.


Additional Windows Resources


 

Mac

To insert a hyperlink:

  1. Copy the URL of the linked website.
  2. Highlight the phrase that will be the link text (remember to follow guidelines for link text).
  3. Select Insert from the menu bar, and then Hyperlink.
  4. Paste the URL into the Address field, then select OK.

Insert tab in Word for Mac


Additional Mac Resources

 

Google

To insert a hyperlink:

  1. Copy the URL of the linked website.
  2. Highlight the phrase that will be the link text (remember to follow guidelines for link text).
  3. Select Insert from the menu bar, and then select Link...
  4. Paste the URL into the Link field, then select Apply.

Because it is web-based, Google Docs will also allow one to search for an appropriate link, and even make suggestions for links. This can be handy if one is not sure of the resource to which they would like to link, but be sure to check out Google's suggested link! Remember, the linked site needs to be accessible, too!

 


Additional Google Resources

How to Create Internal Links in Google Docs

 


Additional Hyperlinks Resources

 

an external site.

Including Images with Alt Text

To ensure a document is accessible, it's important to add a text description to images. This allows individuals who are visually impaired or blind using screen-reader software to "hear" the description of the image. Additionally, for individuals who are using a text-only Web browser or other mobile device, the text description still provides access to the information when the images are not displayed.

** IMPORTANT **

As a reminder, adding alternative text is required under the WCAG 2.0, Level ALinks to an external site., and the Section 508 StandardsLinks to an external site..

There are scenarios where descriptive alt text is not required--sometimes an image is just there for visual appeal. It's purely decorative. In this case, alt text is not necessary, as the image has no value in helping a student using assistive technology to understand the information being presented. Many images, however, have a pedagogical purpose, and, therefore, require a description explaining the information the image conveys. 

When providing alternative text for images, the CCC High Tech Center Training Unit offers the following guidelines:

  • Keep the alternative text brief (10 words or less), but be descriptive.
  • If there is text content in the image, include the exact text in the alternate text box.
  • Do not use the word "image" to begin the description - instead identify the type of image being used if it is relevant to the image content (e.g., photograph, painting, screenshot).
  • If the image is very detailed and cannot be summarized in a few sentences, consider placing additional information about the image into the page text preceding or following the image.

Windows

Alt Text in Word for Windows

To set the alt text on an image:

  1. Select the image and perform a right-mouse-button click.
  2. Choose Format Picture from the menu.
  3. In the Format Picture side panel select the Layout and Properties option.
  4. Click on ALT TEXT, and then enter a short text description of the image.
    • Include information about the content and/or function of the image.
    • Try to keep the alt text under 7 words.


Additional Windows Resources

Microsoft Support: Make Word documents accessible


Mac

To set the Alt Text in Word 2016 for the Mac:

  1. Select the image; the Picture Format tab will appear on the ribbon.
  2. Open the Format Pane, then select the Layout and Properties icon.
  3. Open the Alt Text option by selecting the arrow.
  4. Enter the appropriate alt text in the Description (not the title).

Additional Mac Resources

Microsoft Support: Make Word documents accessible


Google

To set the Alt Text in Google docs:

  1. Select the image.
  2. Choose Alt Text from the Format menu.
  3. Enter the appropriate alt text in the Description (not the title).
  4. Select OK.


Additional Google Resources

Google Doc Alt Text Video

Google Doc Alt textLinks to an external site.Google Doc Alt text

Additional Alt Text Resources

More information about alternative text is available at:

Tables

To ensure students can navigate through a table with ease, all tables should be formatted for optimal use with a screen reader, including properly denoting the table header row. Remember, the header row allows the screen reader to keep track of where it is within the table, providing valuable information that allows visually impaired students to better understand the table. To maximize the clarity of the table, it's important to avoid nested tables (a table within a table), split and merged cells, and empty cells.


Windows

Formatting Tables

  1. Select the header row.
  2. Right-click in that row and choose Table Properties.
  3. Select the Row tab.
  4. Check “Repeat as header row at the top of each page.”

Additional Windows Resources


Mac

To insert a table in Word for Mac 2016:

  1. Select Insert and then Table from the format ribbon.
  2. Select the number of columns and rows using the grid.
  3. Ensure the table has a header row.
    Mac drop down table insert
    Table design tab

If the table is longer than one page or breaks across two pages, Please ensure the header row is repeated on the second page. This will make the table more usable for both sighted and visually impaired students. To repeat the header row:

  1. Place the cursor in the header row, and Control+click or select Table from the Word Menu. 
  2. Select Table Properties from the list or drop-down menu. 
  3. Select the Row tab, and then select the Repeat as header row box. 

Additional Mac Resources


Google

Google Tables are not currently accessible, as a header row cannot be delineated. 


Additional Google Resources

Links to an external site.

Color

There are a number of very important considerations when it comes to color: Contrast, Color Blindness, and Color Processing Issues.

When creating a document, always be very aware of contrast. It is generally best for readability not to overlay text on top of a busy graphic. Similarly, when using a colored background, make sure that the text contrasts strongly with the background. Never use light text on a light background (for instance yellow text on white) or dark text on a dark background (for instance black text on dark blue).


Also remember that a significant portion of the population has some degree of colorblindness (most often red/green). If green text is used for correct answers and red text for incorrect answers, some students may be completely lost. It is fine to use color as a reinforcement, as long as color is not the only indicator. For instance, have the word “correct” in green and “incorrect” in red.

It is quite common for students with vision issues, including visual processing issues, to be affected in some way by color. The nice thing about a fully accessible document is that the programs that students use to read the documents can alter the color as necessary.

Color Contrast

When possible, use the default settings for text colors. If using custom colors for headings or other textual markers, check the contrast via a free online color contrast tool. In order to test the colors, it is important to know the hex codeLinks to an external site. of the colors being used. Some recommended color contrast tools are:

Instructions for checking the contrast in a Word document:

Contrast in Microsoft WordLinks to an external site.

Attributions:

CVC-OEI Adoptable: Creating Accessible Course Content By Helen Graves. This work is licensed under a Creative Commons 4.0 International LicenseLinks to an external site.

Unit 6: Accessibility Continued--Document Design By Suzanne Delahanty. This work is licensed under a Creative Commons Public Domain Mark 1.0 LicenseLinks to an external site.

Accessible PDFs

The path to creating accessible documents is full of potholes. One particular issue is the software students will need to open a file--if they are provided with a Word document, they will need Word to read it. In addition, if their operating system or version of Word is not the same as the document creator's, there is no guarantee the document will look the same to them as it did to the person who created the file.

Converting Word, Google Docs, PowerPoint, and Google Slides documents (Excel and Google Sheets, too) to a PDF eliminates the software issue. With PDFs, students can download the free Adobe ReaderLinks to an external site., allowing universal access to the course material, and, the document will look exactly the same as when it was designed. 

There is, however, a caveat:

The PDF is only as accessible as the original document.

In other words, an accessible PDF is built from an accessible Office or Google document. If the original file has an accessibility issue, that issue will be passed on in the PDF format. Additionally, sometimes new accessibility issues occur as the file is being rendering into the PDF format, so even if the Word document was 100% accessible, the PDF version may not be!

It's important to always check a PDF for accessibility and, if needed, remediate the accessibility issues in Adobe Acrobat ProLinks to an external site..

The following tabs on this page will provide guidance on converting Office for Windows files into PDFs, converting Office for the Mac, and converting Google docs. In the next section we'll cover using Adobe Acrobat Pro.


Windows

The beauty of the Microsoft products is their consistency. Whether converting a Word doc or PowerPoint, the process is going to be very similar:

  1. Make sure the original "source" file (from Word or PPT) is accessible.
  2. Select File, then Save As.
  3. Choose where to save the file.
  4. Select PDF as the Save As type.
  5. Select Options, then check the box for Document structure tags for accessibility. 
  6. Select OK.

It never hurts to check the final PDF, as well. In the next section, we'll learn more about assessing the accessibility of PDFs.


Additional Windows Resources

Microsoft Office Tutorials: Save or Convert to PDFLinks to an external site.


Mac

Remember, to end up with an accessible PDF, it is important to begin with an accessible file. In addition, if using any version of Microsoft Word for the Mac that is prior to 2016, the document cannot be converted to an accessible PDF from Word or PPT. The documents will need to be imported to another tool (Google docs or OpenOffice, for instance) in order to create an accessible PDF. For this reason, we strongly suggest all Mac users upgrade to MS Office for the Mac-2016

** IMPORTANT INFORMATION **

We want to be very clear here. MS Office products designed for the Mac prior to 2016 will allow documents to be saved as PDFs, but, these PDFs are not accessible.

This is because there are two types of PDFs--image only, and tagged. Image-only PDFs are like a picture of the original document. It looks the same, but the text has actually been changed to an image. The text cannot be edited, and, more importantly, the screen reader won't see text--instead, it will detect a single image. It is, essentially, a photo of the original document.

Tagged PDFs, on the other hand, are text documents, and the 'tags' retain the important formatting information so useful to screen readers. 

In the MS Office for Mac products prior to 2016, the conversion process turned the original document into an image-only PDF--no text, no tags, just the image. It looked great, but it was useless to students using assistive technology.

So, here's how to ensure MS Office for Mac documents are converted to accessible PDFs:

  1. Check the version of Office to be sure it is the 2016 version (select Word from the menu bar, and then About).
  2. Select Save As from the File menu, name the file, and choose the folder in which it will be saved.
  3. For File Format, choose PDF.
  4. Select Best for electronic distribution and accessibility.
  5. Select Export.

It never hurts to check the final PDF, as well. In the next section, we'll learn more about assessing the accessibility of PDFs.

 


Google

To convert a Google doc to a PDF:

  1. Select Download as from the drop-down list in File menu.
  2. Select PDF document (.pdf) from the drop-down list.
  3. Save the converted document to the computer.

 


Additional Resources for CCC Faculty and Staff

Through the Vision Resources Center (formerly the Professional Learning Network (PLN)) all California Community College faculty and staff have access to LinkedIn Learning's (formerly Lynda.com) entire library of tutorials for FREE.

Vision Resource CenterLinks to an external site. (formerly the Professional Learning Network)

Learning HomeLinks to an external site. at the VRC

Retrofitting PDFs

For many years, there was an unfortunate myth floating around that the PDF format magically made documents accessible. Now, however, it's time to confront the skeletons in the closet, and check those old PDFs. 

Never assume a PDF, even one that looks very professional, is accessible.

Checking PDFs

The best way to check a PDF is with Adobe Acrobat Pro. If using PDFs extensively, investing in this software could prove invaluable to a campus with OER specialists. Adobe Acrobat has a host of tools, including an Accessibility Checker. To run an accessibility report, open a PDF in Adobe Acrobat Pro:

  1. Select the Accessibility tool.
  2. Select Full Report from the menu bar.
  3. Select Start Checking.

The accessibility report will open in the left column. Follow the feedback to correct any errors. 

Retrofitting

The approach to retrofitting PDFs will depend on whether the OER specialist owns the original source file that was converted to PDF. If they have the original file, that's where they'll start:

  1. Ditch the inaccessible PDF.
  2. Retrofit the original source file and format accordingly.
  3. If choosing to retrofit the original source file, after fixing any accessibility issues, convert the file to PDF.

If this is not the original source file, Adobe Acrobat Pro will be needed to make the file accessible:

  1. Open the file in Adobe Acrobat Pro.
  2. Run the Accessibility Check.
  3. Follow the tips generated by Adobe to fix any issues.

Using Adobe requires practice. They have some terrific web-based tutorials, included in the additional resources. 


Additional Resources

Cerritos College Library | 11110 Alondra Blvd., Norwalk, CA 90650 | 562-860-2451 | Reference ext 2425 | Circulation ext 2424