Mike Pierce


Designing Accessible Documents

Page last updated 1 June 2020

Much of education and academia is based around the creation and digestion of documents. We write countless worksheets, papers, exams, presentations, emails, statements, syllabi, etc. We might as well be designing these documents to be as accessible, and as convenient and comfortable to read as is it reasonably possible for us to do. Here are some points to consider when designing documents.

Contents

Use an Accessible Color Palette   ·   Export all Immutable Documents to PDF
Be Mindful of Typography   ·   Create Properly Tagged PDFs

Use an Accessible Color Palette

About 1 in 12 men and 1 in 200 women have some form of color blindness. In particular this means that your average 20–30 person class will very likely have a color blind student. Because of this, use a color blind accessible palette when designing graphics. A popular choice is Bang Wong’s conservative 7-color palette from Points of view: Color blindness.

There’s also these nice 12-color and 15-color palettes by Martin Krzywinski. I create most of my class documents in LaTeX, so I’ve redefined most of the standard colors in LaTeX based on an amalgamation of Paul Tol’s vibrant and muted colors palettes (figures 3 and 4):


        \RequirePackage{xcolor}
        \definecolor{purple}{HTML}{332288}
        \definecolor{blue}{HTML}{0077BB} %*
        \definecolor{cyan}{HTML}{88CCEE}
        \definecolor{teal}{HTML}{44AA99}
        \definecolor{green}{HTML}{117733}
        \definecolor{olive}{HTML}{999933}
        \definecolor{yellow}{HTML}{DDCC77}
        \definecolor{orange}{HTML}{EE7733} %*
        \definecolor{pink}{HTML}{CC6677}
        \definecolor{red}{HTML}{CC3311} %*
        \definecolor{brown}{HTML}{882255}
        \definecolor{violet}{HTML}{AA4499}
        \definecolor{magenta}{HTML}{EE3377} %*
    

The colors marked with %* are vibrant, and so might collide with the other colors which are muted. But overall this palette looks pretty good: you can see how someone with color blindness would perceive these colors using this tool by David Nichols. I’ve written up a few of these accessible colors palettes for LaTeX in the file accessible-colors.tex. And if you need to get your hands dirty designing graphics and you need more colors, be sure to use a color-blindness simulator like Color Oracle to test your design choices for visibility. Also check out these resources:

Export all Immutable Documents to PDF

This point is more about logistics and convenience than accessibility. By immutable documents I mean documents like a course syllabus, a course calender, a teaching statement: any document that you intend to be read but not edited. Any such document your create should be given as a PDF.

PDF files are more convenient to deal with than most other file types. They can be opened in any web browser or any one of many free PDF viewers. They can be viewed easily on a phone. They have all the typesetting information of the document embedded in the file so that the document is guaranteed to look the same regardless of what’s installed on the device that opens it. They are just easier to access than .docx files.

Be Mindful of Typography

You want people, your students or your peers, to read the documents you create. It’s only polite that you make the job of reading your document as convenient and comfortable as possible. The layout of text on the page should, at the very least, not get in the way of the content of the document, and this is why good typography is important.

But learning the best typographic techniques and practices is a deep rabbit hole one could dive into. If you’re interested, I recommend first reading Butterick’s Practical Typography. Since you probably don’t have time for that, here are some important considerations:

  1. Decrease the line length in your documents. Shorter lines are more comfortable to read because it’s easier for the reader to trace their focus back from the end of a line to the beginning of the next line. A good standard is 49–90 characters, which is about 2–3 alphabets long. This can be done by editing the page margins or the font size.
  2. Increase the line spacing in your documents. Again, this helps the reader's eye trace to the next line. Plus it just helps the page breathe.
  3. Either indent paragraphs or put space between paragraphs, but don’t do both. The beginning of a new paragraph needs to be indicated, but not twice.
  4. Have running headers and footers, and page numbers. This point is more about providing information to screen readers to help visually impaired readers.
  5. As for formatting the body text of your document,
    1. pick a non-default font, but don’t pick a goofy one,
    2. never use underlines, even for URLs and email addresses,
    3. and use bold and italics sparingly, and never together.
  6. Shorten URLs in print, or hide URLs behind a link. If you’re creating a document that could conceivably be printed, make sure any URL in the document is convenient to type. Use a URL shortener if you need to. If your document is intended to be viewed digitally, like in an email or on a webpage, hide the URL behind a descriptive link like I’ve done with all the links on this page. This is necessary because URLs are ugly and typographically distracting.
  7. Give your PDF a title in the meta-data. This also helps visually impaired readers.

Butterick describes how to realize these points in Microsoft Word or in HTML/CSS for the web. If you use LaTeX, here’s a some lines you could add to your preamble that will make your document reflect these points, like in this example:


        \documentclass{article}
        \usepackage{geometry}
        \geometry{margin=1.67in, bottom=1.33in}
        \usepackage{fourier}
        \usepackage{hyperref}
        \hypersetup{%
            pdfauthor={YOUR NAME}%
           ,pdftitle={DOCUMENT TITLE}% 
           ,pdflang=en-US% 
           ,colorlinks=true%
           ,urlcolor=blue%
        }
        \usepackage{fancyhdr}
        \pagestyle{fancy}
        \lhead{YOUR NAME}
        \rhead{DOCUMENT TITLE}
        \cfoot{\thepage}
        \usepackage{microtype}
        \usepackage{parskip}
        \usepackage[all]{nowidow}
        \usepackage{setspace}
        \linespread{1.167}
        \frenchspacing
    

For more reading on typography, if you want dive deeper down the rabbit hole:

Create Properly Tagged PDFs

This point requires a bit of work to implement. A PDF document can be equipped with additional structure, PDF tags, to make it more accessible to the visually impaired. These tags encode what certain elements of the PDF are (headings, lists, body-text, images etc) and what order they are intended to be read in. This information helps a visually impaired person using a screen reader read your document efficiently.

To make tagged PDFs from Microsoft Office documents, you have to format your document correctly before you export it to PDF. Learning to do this takes a bit of time. Instead of going over the details here, I’ll refer you to the University of Washington’s wonderful guide to Creating Accessible Documents.

Creating tagged PDFs from LaTeX is a even more complicated. You could do this by using ConTeXt instead of LaTeX but that's not convenient. It looks like our best hope for an easy solution is the accessibility.sty package that was recently put on CTAN. But that package still has issues. I’ll update this page as I learn more about making accessible PDFs from LaTeX. Note too that you’ll need to include the package axessibility.sty separately to set up tags on mathematical formulas. For more reading on PDF accessibility, see

Suggestions?

I would like to keep expanding this page as I learn more about the best practices in designing accessible documents. If you have any suggestions or recommendations, please let me know! Email me at , or message me on Twitter.