Creating accessible links in PDFs

11th April 2010 | by Ted Page

Summary

Creating accessible links in PDFs is a basic accessibility requirement. This article looks at a selection of techniques for tagging links correctly to ensure that they are both keyboard-operable and usable with a screen reader. It also looks at, amongst other things, how to make URLs more intelligible for screen reader users.

Tagging

Creating links that are keyboard operable is a single A requirement under the Web Content Accessibility Guidelines (WCAG) 2.0., and is vital in ensuring the accessibility of PDFs.

Tag tree showing Link tag, and child Link-OBJR and link text tags
Figure 1

For a link to be accessible it must have a specific tag structure consisting of:

  • a parent <Link> tag
  • one or more child tag(s) containing the link text 
  • a Link–OBJR tag which must also be a child of the <Link> tag

The Link–OBJR tag enables assistive technologies to properly recognise the link and handle it correctly.

A complete, accessible link tag structure can be seen in Figure 1 above.

Word, InDesign and beyond

Provided that PDFs are tagged on creation, links originated in Microsoft Word documents will have the required tag structure and will present no problems (provided that they don’t span two or more lines). However, links currently authored in InDesign will need fixing, as will those found in untagged PDFs.

InDesign originated links

 Incorrectly tagged link structure from a document originated in InDesign
Figure 2

As of the date of writing, hyperlinks created in InDesign (CS4), when converted to PDF, will produce inaccessible tag structures. An example can be seen in Figure 2. [Update (May 2011): note that this problem was resolved in InDesign version CS5.5 and later.]

The problem is that the tag containing the link text will be created at the wrong level in the tag tree hierarchy. The tag in question – in this case containing the word “Hyphenation” – will be created at the same level as the <Link> tag, rather than being a child of it.

Such links work with a mouse and appear normally in the tab order but don’t work with screen readers.

However, the problem is easily solved. Just click and drag the link text tag (“Hyphenation”) and drop it underneath (as child of) the <Link> tag, at the same level as the Link-OBJR tag. Figure 3 shows the same tag tree corrected in this way.

Corrected tag links from a document originated in InDesign CS4
Figure 3

Creating accessible links in Acrobat

Creating an accessible link from scratch in Acrobat Professional is (usually) relatively straightforward. To do so, highlight the text in question, right-click and, from the context menu, select Create Link. Choose Go to a page view.

Creating link tags by alternative means

In some PDFs the create link process outlined above won’t work (in some Quark-generated documents, for example, or when links span across line breaks). In such a case it may be necessary to create <Link> and Link–OBJR tags manually.

Creating a Link tag

To create a <Link> tag, in the tags panel select New Tag, either by right-clicking or from the Options menu. In the Type input field, either type “Link” or select Link from the dropdown.

Create a Link–OBJR tag

To create a Link-OBJR tag, in the tag tree, either right-click or open the Options menu and select Find. From the Find dropdown select Unmarked Links. Click Find and then Tag Element. A Link–OBJR tag will be created.

Making link text screen reader friendly

Because PDFs are often designed to be printed, link text frequently comes in the form of raw URLs which are not particularly screen reader friendly. It is helpful to screen reader users to provide a text alternative for such links in order to make them easier to understand. (In terms of WCAG 2.0 compliance this is a triple A requirement but fixing it is arguably more beneficial than this would imply).

Again, the solution is simple. Highlight the URL and press Ctrl + C to copy it. In the tag tree, right-click the <Link> tag and select Properties. In the Alternative Text field of the TouchUp Properties dialogue box, paste the previously copied URL.

Then, for a URL such as www.ecdp.org, type “www.e c d p.org” (with spaces between the “e”, “c”, “d” and “p”), or for www.bbc.co.uk, type “www.bbc.co.u k” with a space between the “u” and the “k”.

Following these simple techniques will ensure that your links are accessible to a wide range of readers.

A conflict between accessibility and standards compliance

Please note that in the above example, although using the Actual Text field would be the standards compliant option here, doing so will actually render the link unusable, so at least for the time being you should use the Alternative Text field.