in the trenches with accessible epub - charles lapierre - ebookcraft 2017
Post on 05-Apr-2017
216 Views
Preview:
TRANSCRIPT
In the Trenches with Accessible EPUB Tales from the Publishing Front Lines
Charles LaPierre, Technical Lead DIAGRAM and Born Accessible
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
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
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)
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
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
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
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
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
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
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
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
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.
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
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
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%
Page 17
Accessibility Pilot Results
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.
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
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.
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>
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>
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>
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.
Page 25
Publishers Perspective
Page 26
Process is Everything
Publisher’s processes are at the heart of the Certification
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
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
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
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
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
Page 32
THANK YOU
Questions?
Charles LaPierre E-mail: charlesl@benetech.org Twitter: @CLaPierreA11Y Skype: charles_lapierre
top related