1.
In the Trenches with
Accessible EPUB
Tales from the Publishing Front Lines
Charles LaPierre, Technical
Lead
DIAGRAM and Born Accessible

2.
Page 2
Standards at the Core of
Accessibility
● World Wide Web Consortium (W3C)
– HTML 5, CSS, ARIA, SVG, MathML
● Web Accessibility Initiative (WAI)
● Web Content Accessibility Guidelines (WCAG
2.0)
● International Digital Publishing Forum (IDPF)
– http://www.idpf.org/
– EPUB the digital publishing standard built on Web
technologies (i.e. HTML5, CSS, ARIA, etc…)
– EPUB Accessibility Conformance and Discovery
1.0 Specification

3.
Page 3
● For the last three years the W3C has run a Digital
Publishing Interest Group
– I was the co-chair of the Accessibility Task Force
● The merger has placed EPUB under the domain
of W3C
IDPF and W3C Merger

4.
Page 4
● Adoption of EPUB 3 has been outstanding in most digital
publishing sectors
● EPUB 3.1 is an approved recommendation
– http://www.idpf.org/epub/31/spec/epub-spec.html
● Included is EPUB Accessibility 1.0
– http://www.idpf.org/epub/a11y/accessibility.html
● Conformance and Discovery Requirements for EPUB
Publications
● First ever spec to enable accessibility certification
– This establishes the baseline
● Important: We want to be practical in that publishers should
readily be able to produce accessible EPUB from their normal
production process
EPUB within the World Wide Web
Consortium (W3C)

5.
Page 5
● The Digital Publishing Interest Group in the W3C has
produced an ARIA 1.1 module to help add some Digital
Publishing semantics to ARIA
● Digital Publishing WAI-ARIA Module 1.0
– https://www.w3.org/TR/dpub-aria-1.0/
● This is currently under review and has not yet been
adopted as a recommendation
● Sample of the proposed new Roles:
– doc-abstract
– doc-appendix
– doc-chapter
– doc-introduction
W3C DPUB’s ARIA 1.1 Module

6.
Page 6
● Requires accessibility conformance in the EPUB
publication
● Builds on WCAG 2.0 with some additional publishing-
specific items
● in the USA WCAG 2.0 “AA” is generally recommended
● “conforms To” metadata pointing to “A,” “AA,” or “AAA”
Accessibility metadata must be included
Interestingly: publishers have actively participated in the
EPUB Accessibility Spec development and have been
updating their production process to support accessibility.
Baseline Features

7.
Page 7
● All headings must be marked in the HTML as headings
(Critical for navigation)
● All textual content must use HTML text markup, e.g.,
paragraphs, block quotes, list items
● All content must be in a logical reading order
● Images are marked as decorative, described in
surrounding text or captions, or have “alt” text
● If you want a fancy heading and use an image, remember
to surround the image with the heading markup and use
alt text (remember you can do very cool things these days
with CSS)
Concrete Examples of Some MUSTS

8.
Page 8
Metadata Requirements to Be Compliant
● EPUBs wishing to be conformant MUST:
– include accessibility discovery metadata
– include the following [schema.org] accessibility
metadata
• accessMode
• accessibilityFeature
• accessibilityHazard
• accessibilitySummary

9.
Page 9
● Certify that digital books (and all other publications) meet
the Baseline
● Self-certification
– Sad Story: What happened to Voluntary Product
Accessibility Template (VPAT)?
– Would you have a fox guard the henhouse?
– DAISY is building the EPUB Accessibility Conformance
Checker
• Can only test 20-30%
– Auto checking must be supplemented by human
inspection
Accelerating Publisher Adoption:
Certification of EPUB Publications

10.
Page 10
● Accessibility metadata required to be present in the
EPUB package
● Accessibility metadata supports
• Born accessible
• Find accessible
• Buy Accessible
Accelerating Publisher Adoption:
Conformance and Certification of EPUB Publications

11.
Page 11
Born Accessible: Certified by Benetech
● Benetech is piloting the certification process
● A documented process for certification must
be established and followed
● Publisher materials are reviewed and
remediated
● Long term process improvements would be
recommended to publishers

12.
Page 12
Find Accessible: Certification Metadata
● How to find certified content in the future:
– certifiedBy: Specifies the name of the party that
certified the content. The certifier of the content could
be the same party that created the EPUB publication,
but can also be a third-party accessibility certifier.
– certifierCredential: Identifies a credential or badge
that establishes the authority of the party identified in
the certifiedBy property to certify content is accessible.
– certifierReport: Provides a link to an accessibility
report created by the party identified in the certifiedBy
property.
– conformsTo: the Baseline and WCAG-A, -AA, or -AAA

13.
Page 13
Buy Accessible: Certified Accessible
Content
● Procurement MUST focus on “Buy Accessible”
● “Buy Accessible” - Demand Certified Accessible
EPUB3 by third party credentialed agencies.
● All content must be certified. Point them to
“Certified by Benetech” initiative.

14.
Page 14
Benetech Pilot – EPUB Accessibility
Certification
● Currently working with Macmillan Learning and
other publishers, as well as a conversion vendor
● In depth evaluations of multiple EPUB books from
each
● Generate a detailed accessibility report for each
title

15.
Page 15
Sample Pilot: Summary
Title: Road Runner - Not a Myth
Publisher: Acme Inc.
Author(s):Wiley Coyote Sr.
Package Metadata (Required): FAIL
Page and Publication: FAIL
Page Navigation: PASS
Media Overlays Playback: FAIL
Overall 1.0 Compliant: FAIL
Born Accessible Score: 25.5%
Overall WCAG Compliance Reached: FAIL
EPUB Complexity Score: 5 - Very Complex

16.
Page 16
Sample Pilot: Born Accessible Scores
Image Accessibility: 39% WCAG FAIL
Audio Accessibility: 22% WCAG FAIL
Video Accessibility: 0% WCAG FAIL
HTML Tags: 29% WCAG FAIL
General Accessibility: 29% WCAG FAIL
Language: 50% WCAG Level-A
Structured Navigation: 17% WCAG FAIL
Links: 50% WCAG Level-A
Lists: 50% WCAG FAIL
Tables: 0% WCAG FAIL
Notes: 67% WCAG Level-A
Java Script: 0% WCAG FAIL
MathML: 0%
Package Metadata (Optional):50%
DPUB ARIA (Future): N/A
Born Accessible Total Score 25.5%

17.
Page 17
Accessibility Pilot Results

18.
Page 18
Image Accessibility - Feedback Given
● Decorative Images
– The fancy images that are placed at the start of each chapter have
alt=“image.” This should instead be alt=“”, and be marked as
role=“presentational” and as an added safety aria-hidden=“true”.
Technically you should only need role=“presentational” but not all
reading systems honor both so having both will ensure that the
image won’t be announced to the assistive technology.
● Longer descriptions
– There are 13 complex images – graphs and text-as-image – with
no descriptions.

19.
Page 19
General Accessibility - Feedback
● Landmarks
– There are no epub:type semantics (eg: chapter, titlepage,
footnotes, …)
● Color-Contrast
– Color contrast Level AA 4.5 : 1 or AAA 7 : 1
● Inline Styling
– Use of <em> and <strong> used instead of <i> <b>
● Page Lists
– There are pages marked but no page lists given should also
include metadata dc:source declared in OPF file

20.
Page 20
Table – Feedback
● Table headings marked
– No Table Headers marked (First row and/or first column usually is
a header and must be indicated as such to help assistive
technology automatically announce the header as the user moves
around the table.)
● Table summary added for complex tables
– Complex tables should have a Table Summary, consider adding a
summary for the more complicated tables.
● Not used for fixed or presentational content
– A table was used in the appendix purely for presentational layout,
use CSS styling instead.

21.
Page 21
Extended Image Descriptions : Current
Solution
Using aria-describedby pointing to a hidden Fig Caption - Aside
<figure>
<img src=" pythagorean.jpg " aria-describedby="pyth-details" alt=“Pythagorean Theorem”/>
<figcaption>
Figure 1.0 Example of Pythagorean Theorem
<aside class="hidden" id="pyth-details">
<p> The Pythagorean Theorem is a relationship in Euclidean Geometry
between the three sides of a right triangle, where the square of the
hypotenuse is the sum of the squares of the two opposing sides.</p>
<p> c2 =a2 + b2 </p>
</aside>
</figcaption>
</figure>

22.
Page 22
Extended Description: Future Solution
ARIA 1.1 : aria-details
The aria-details attribute references a single element that provides more
detailed information than would normally be provided by aria-describedby. It
enables assistive technologies to make users aware of the availability of an
extended description as well as navigate to and within it.
<img src="pythagorean.jpg" alt="Pythagorean Theorem" aria-details=”pyth-details”/>
<details id="pyth-details">
<summary>Example of Pythagorean Theorem</summary>
<p> The Pythagorean Theorem is a relationship in Euclidean Geometry
between the three sides of a right triangle, where the square of the
hypotenuse is the sum of the squares of the two opposing sides.</p>
<p> c2 =a2 + b2 </p>
</details>

23.
Page 23
Table Markup
● Tables is one area which has some accessibility concerns
<table summary=“Here we have our lunch menu which showcases a Salads, Entrées and
Desserts.”>
<caption>Today's Lunch Menu</caption>
<tr>
<th>Salad</th>
<th>Entree</th>
<th>Dessert</th>
</tr>
<tr>
<td>Caesar</td>
<td>Chicken Divan</td>
<td>Chocolate Mousse</td>
</tr>
… </table>

24.
Page 24
Current State of Math ML
● DIAGRAM Center currently working on a solution
● Separate workflows that can or cannot support JS
● Javascript can be used to make either the
MathML the primary and the Image as a backup
or vice versa
● If Javascript is not available, or must be removed
the default will be an image with an alt description
and have the mathML either removed or hidden.
● mathmlcloud.org has APIs that given MathML,
AsciiMath or Latex can obtain SVG, PNG,
MathML and Alt description.

25.
Page 25
Publishers Perspective

26.
Page 26
Process is Everything
Publisher’s processes are at the heart of the Certification

27.
Page 27
How we Integrated New Standards
● Get involved in working groups – it’s a chance to share
your solutions and learn from others
● Standards groups provided specifications but it was up to
us to develop implementation guides based on our needs
– V1 took 6 months to build
– updates are coming out every 2-3 months based on feedback
● Developed a validator based on open source resources
and our implementation guide
– Update with every implementation guide update
● Established a checklist for non-automated QA and
educated team members on what to look for

28.
Page 28
Sharing Responsibility
● Art – Develop all art to have proper contrast, readable text
● Design – Ensure read order is clearly indicated
● Authors – Provide guidance about pedagogical intention
for digital conversion
● Editors – Communicate with authors about focus and
development
● Compositor – Apply publisher standards, give feedback on
gaps
● Quality Assurance – Automated and manual checking of
everything developed

29.
Page 29
Addressing Complexity
● Text with markup
● Complex image layouts
● Marginal elements
– Texts contain a large quantity of pedagogical material in the margin
● MathML
– Reader compatibility is not standard
– Expensive and difficult to write alt text (mathMLcloud.org)
● ChemML
– Reader compatibility is rare
– Expensive and difficult to write alt text
● Graphic Novel
– All image text

30.
Page 30
Why Are We Doing This?
● ‘Certified by Benetech’ advantages
– 3rd party confirmation of accessibility standards
– Assurance for students and adopters
– Easy to roll up to administrators
– Gives us feedback to pass on to vendors about the
quality of their work
– Provides internal confidence about the quality of what
we’re delivering
– Helps identify for schools what errors are addressed
and what warnings are relevant
– Most importantly: Shows us what we’re missing and
what we have left to learn

31.
Page 31
EPUB Accessibility 1.0 (Specification)
EPUB Accessibility Techniques 1.0 (Supplemental)
WCAG 2.0 (Specification)
BISG: Quick Start Guide to Accessible Publishing
DIAGRAM Center: Image Description Guidelines
Poet Image Description Training Module
Helpful Resources for Publishers

32.
Page 32
THANK YOU
Questions?
Charles LaPierre
E-mail: charlesl@benetech.org
Twitter: @CLaPierreA11Y
Skype: charles_lapierre