Field of variety of Spring flowers

How to be friendly to everyone’s reading style

The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.
– Tim Berners-Lee, W3C Director and inventor of the World Wide Web

We have all come to appreciate the ability to consume documents in different ways in recent months. When a document is made accessible, it means we provide readers with multiple ways of interacting with it. We can listen, we can zoom, we can change the font size, and we can read on different devices.

Focusing on making your materials accessible will allow you to create content in multiple formats from web to print to PDF. The fundamentals for each of these are the same:

  • Use headings to improve readability
  • Use built-in lists
  • Use built-in tools to control the look and feel
  • Use alt text or descriptive text fields to describe imagery
  • Use descriptive link text
  • Fonts and line-height
  • Check contrast levels
  • Ensure tables have headings
  • Use accessibility checkers

Use Headings to improve readability

Use headings to outline a document and provide structure.  Headings allow any user to quickly jump from one section to another visually or auditorily (using read-aloud tools and screen readers) 

  • Do not fake headings by bolding, italicizing, or increasing the font size to make them look like headings.  
  • Every document should have at least one heading and should begin with a Heading 1
  • Heading levels should not be skipped (e.g. h2 followed by h4).  
  • If the look of a heading is undesirable, change that look in the document styles instead of skipping a heading

Use built-in lists

Every word processing tool has built-in lists tools – even InDesign has methods to create lists.  

  • Use numbered lists when the order matters (e.g. step 1 must be completed before step 2)
  • Use bulleted lists when order does not matter 
  • Use lists to break out items that are in paragraph format

List as paragraph:

Here is the list of ingredients you’ll need for creating a delish lemon curd without sugar: three egg yolks, ½ cup of powdered swerve, ¼ cup freshly squeezed lemon juice, two teaspoons of lemon zest, four tablespoons of grass-fed butter

The same paragraph with items broken into a list, which makes it much clearer to read:

Here is the list of ingredients you’ll need to create a delish lemon curd without sugar:

  • 3 large eggs
  • 1/2 cup powdered Swerve Sweetener
  • 1/4 cup freshly squeezed lemon juice
  • 2 teaspoons grated lemon zest
  • 4 tablespoons of grass-fed butter

Use built-in tools to control the look and feel

Use built-in styles to control and manipulate a consistent look and feel.  Word, Google Docs, and Apple Pages all provide the ability to create styles that help control the look and feel of headings, paragraphs, lists, and tables.  Use them to help maintain consistency.  Once these are in place they can easily be changed and automatically flow to the rest of your document.

Use alt text or descriptive text fields to describe imagery

There is nothing more annoying when listening to a document or website than to hear a description as “https colon slash slash www dot somewebite dot com slash 123Px94abc? dot jpg”.  This is what happens when you do not use alt text or mark an image as decorative.  It is very fatiguing for the listener.  

Imagine describing the image to a friend on the phone: 

  • How does the imagery relate to the content?
  • What is the essence of that image?
  • Why is it being included?

One important note:

  • Avoid text in images or text as images at all costs
  • If they absolutely must be used include the text contained in that image as a caption or in the descriptive text

The alt text should be “Top 10 Things to Do for Your Career Over Winter Break.”

Use descriptive link text

Link text should give readers an idea of where they will go when they engage a link.  Some read-aloud and screen reader tools allow users to list all the links in one place.  This means some users are getting links out of context.  

Here are examples of links that don’t make much sense out of context:

  • Here
  • Click Here
  • Read More
  • Learn More
  • Click Here to Read More

Better options could be:

  • Download installation instructions here
  • Sign up for the vegetarian soup class
  • Read more about metacognition
  • Explore the life and times of Mr. Magoo

All the items in the list above tell the user what to expect when they click on those links

Fonts and Line Height

  • Font-size should be no less than 12pt, 14pt is better and preferred for body text
  • Line-height should be 1.5 

Font-family

  • A sans-serif font is suggested for body text.  Verdana has the most white space between letters and it is the font recommended by most in the accessibility field.  You can use a serif font if desired, just make the font size slightly larger and be sure there is plenty of white space between lines
  • Headings tend to be short, concise, and larger than body text.  Because of these factors, font-family is not as important

Check Contrast Levels

Maintain and check the contrast between the text color and the background.

Ensure Tables Have Headings

Ideally, tables are only used to provide data.  Think about a train schedule, election data, or international literacy data. All tables must have row and or column headings that tell users what the row or column content relates to.  

Use Accessibility Checkers

Here are some links that might be useful