Designing for Digital Accessibility: InDesign to PDF

Photo of a laptop on a wood table next to a cup and cactus plant.

Creating accessible digital documents can feel daunting, especially if you don’t have a background in writing code. To help get you started, here is a suggested workflow for designing documents that are intended to be exported to PDF (or another electronic format like ePub) from Adobe InDesign. This does not cover everything of course, but will get you going on the right foot.

Screen captures had yet to be added – but there are some coming!

Step 1. Collaborate with Your Client

  1. Add the alternative (ALT) text to the metadata of each image file the client supplies
  • PC Users: Add ALT text to the Details of an image by right clicking the image on their computer, selecting Properties, and adding the ALT text to the Details.
  • Adobe Bridge: Add the ALT text to XMP: Headline
  • If they do not have time to do the above, ask them to supply the ALT text in a separate Word document or email for you to add yourself in Adobe Bridge or within InDesign through Object Export Options.
  1. Encourage the client to supply Word documents that use Styles and remind them not to use keyboard formatting (eg: tab key or enter to format text) or format using tables for layout or text boxes.
    • Bonus: This also eases importing text content and using plug-ins like WordsFlow.

Step 2. Before You Begin Your Layout

  1. Review the content and consider what Paragraph Styles you need to set up and what hierarchy is used in the headings of the document
    • It could be as simple as all headings being Heading 1, or Heading 1, Heading 2 etc. Note that headings cannot jump from Heading 1 to Heading 3 with no Heading 2 in between. Headings must be in a logical sequence. You can have many different Styles for a single heading.
    • Including a marker such as H1 or H2 in the Style name will help you remember what level of hierarchy they are.
  2. Consider using high contrast colour combinations for text and background to increase legibility. This also aids with photocopying/faxing etc. If your document is going online, it maybe required by law (ie: large organizations in Ontario), but its an all-round good thing to do.

Step 3. Beginning Your Layout in InDesign

  1. Add title and keywords to the document’s File Info (File > File Info)
  2. Use minimal text frames. A single text frame is ideal for controlling reading order.

Note: You can format the text using built-in formatting tools such as columns (split/span), paragraph indenting, space before/after, baseline shift etc.

  1. Open Structure (View > Structure)
  2. Add Untagged Items (menu at the top right of the Structure pane > Add Untagged Items)
  3. Create Paragraph Styles (or create as you go along)
  4. If creating Tables, designate a Header Row (place the type tool inside the first row (your Header) > Table > Convert Rows > To Header)
  • You should not have more than one header. If you have multiple headers, you may need to do a fair bit of tweaking in Acrobat.
  • Avoid using merged cells can disrupt reading order. Use alternative methods of layout if you can in this case. If you must use merged cells, advanced manual touch-up will be needed in Acrobat Pro.
  1. Set up automated Table of Contents (TOC) (Layout > Table of Contents)
  • In the TOC menu, make sure “Create PDF bookmarks” is checked under Options. Otherwise, your interactive bookmarks wont carry over to the PDF.
  • Edit the hierarchy of the bookmarks (level 1, 2, 3 etc or all level 1) via More Options (note, you can control the look of your TOC by setting up specific Styles for the TOC text and spacing)
  • Update the TOC when changes to the document are made (Layout > Update TOC)

Step 4. Finishing Up Your Design

  1. Map Styles to Tags (menu at the top right of the Structure pane > Map Styles to Tags)
    1. Select appropriate Tag for each Paragraph Style from the dropdown menu
      • Avoid using the H tag.
      • Anything not tagged will automatically be tagged as P (paragraph)
    2. Tag footers/headers, page numbers, decorative images as Artifact (select the element > control Click > Tag Frame > Artifact)
    3. Add ALT text to image metadata in Bridge (if not done already) or using Object Export Options in InDesign (Object > Object Export Options > Custom)
    4. Delete any content from your pasteboard (this carries over to Acrobat and will be read by screen reading software). If you need to leave content there (eg: TOC), tag it as Artifact.

Step 6. Exporting Your Design to PDF

  1. Select PDF (Interactive) from the dropdown menu
  2. Confirm that “Create Tagged PDF” is selected

Step 7. Polish-Up Your PDF in Acrobat

  1. Run Action Script (File > Action Wizard) if you have one set up for Accessibility (You can create your own, or use the default Accessibility script in Acrobat. I highly recommend making your own)
  2. Attend to any errors that maybe reported by the Full Accessibility Check of the Action Script (Pro tip: Google unknown errors for help)
  3. Tweak Reading Order (Tools > Accessibility > Touch-up Reading Order) if necessary.
    • Remember to drag down not up – and to save frequently.
  4. Instead of thinking of the document laterally or what your eye goes to first, consider what is the most important content (eg: the title should be 1st in the Reading Order, not a logo for example)

Note: If images are missing ALT tags, you may want to go back into InDesign and add the ALT text there – this will help out future designers updating your file, or you if you end up exporting the document again if there are last minute changes.

General Tips

  • If colour is used to convey information, consider additional ways to convey that same information. For example, instead of wrong answers on a demo test being just in red, add the word “Incorrect:” at the beginning of the sentence. This will add a text cue to the colour cue that this answer is wrong.
  • Avoid using excessive ALL CAPS, bold, underline, and italic text as this can be distracting and inhibit the readability and legibility of a document.

Recommended Resources

Further information, instructional guides, and troubleshooting tips can be found online. Free resources from InDesign Secrets, Lynda Online Tutorials, Accessible Office Document Project (ADOD), WebAIM, Adobe Accessibility and Adobe forums are good places to start.

Advertisements

Author: nchitty

Inclusive designer based out of Toronto.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s