Creating interactive ebooks doesn't mean they need to be inaccessible to users with print disabilities. Interactive textbooks are poised to be huge in education, where reaching all users is critical. There are also opportunities in fiction and storytelling to bring the sense of exploration that is so enjoyable in gaming into the world of books. This presentation is released under a Creative Commons Non-Commercial Share-Alike license.

1. Highly accessible
interactive EPUB
Liza Daly (@liza)
Threepress / Ibis Reader

2. Highly accessible
interactive EPUB
Liza Daly (@liza)
Threepress / Ibis Reader

3. Highly accessible
interactive EPUB
Liza Daly (@liza)
Threepress / Ibis Reader

4. Highly accessible
interactive EPUB

5. accessible
1 Usable with standard
tools and interfaces.
1 Can be fully experienced
by the print-disabled.

6. 1 Usable with standard
tools and interfaces.

7. WAI-ARIA
g
WAI-ARIA provides a framework for
identifying features for user interaction, how
they relate to each other, and their current state.

8. WAI-ARIA
g
It describes new navigation techniques to mark
regions as menus, primary/secondary content,
and other types of Web structures.

9. HTML5
g
It describes new navigation techniques to mark
regions as menus, primary/secondary content,
and other types of Web structures.

10. ARIA HTML5
g g
application header
article nav
main section
navigation article
region footer
ARIA and HTML5 have some overlap in the semantic language they use to describe document
structure. When working with HTML5 and/or EPUB 3, you should use the HTML5 elements
rather than these ARIA roles. (Or both!)

11. application
Because this talk is about interactivity, I’m going to focus on those aspects of ARIA that are
meant to enhance the accessibility of “applications,” as opposed to “documents.” An
interactive EPUB will often be more like an application (or even an app!) than a document.

12. application
ARIA Roles
This speci cation identi es the types of
widgets and structures that are commonly
recognized by accessibility products, by
providing an ontology of corresponding roles
that can be attached to content.

13. application
State
A state is a dynamic property expressing
characteristics of an object that may change in
response to user action or automated processes.

14. application
Property
Attributes that are essential to the nature of a
given object, or that represent a data value
associated with the object.

15. Property
Attributes that are essential to the nature of a
given object, or that represent a data value
associated with the object.
“I could not be more delighted to
see you!,” I exclaimed.
In this example I’m creating a fiction book in which the prose contains hidden elements that
describe what the narrator was thinking at the time.

16. Property
Attributes that are essential to the nature of a
given object, or that represent a data value
associated with the object.
“I could not be more delighted to
see you!,” I exclaimed.

17. Property
Attributes that are essential to the nature of a
given object, or that represent a data value
associated with theIn truth, I loathe her.
object.
“I could not be more delighted to
see you!,” I exclaimed.
In a visual presentation, the user would click on the word “delighted” and the note would pop
up indicating how the narrator really felt at the time. In a normal scenario, the popup here
would _not_ be visible to a screen reader, nor would the user of the assistive reader even
realize that “delighted” could be activated.

18. Property
Parenthetical aside
Attributes that are essential to the nature of a
given object, or that represent a data value
associated with theIn truth, I loathe her.
object.
“I could not be more delighted to
see you!,” I exclaimed.
Behaves like a link
To begin to annotate this with ARIA information, I need to annotate the text with its role in
the application. “Delighted” behaves like a hyperlink -- but it’s not actually a link to another
document. It only has the behavior of a link. Likewise, the popup is semantically an aside --
it’s part of the document but not critical to the flow.

19. State
Propertya dynamic property expressing
A state is
Attributes that are essential to themay change in
nature of a
characteristics of an object that
given object, or that represent a data value
response to user action or automated processes.
associated with the object.
May be displayed or not
In truth, I loathe her.
When I analyze the states available, I come up with the fact that the popup may be in the
state of being “visible” (in a broad sense) or hidden.

20. <div id="container" role="document">
<div id="main" role="main">
<p>
“I could not be more
<span id="lie-1" role="link" aria-haspopup="true">delighted
</span>
to see you!” I exclaimed.
</p>
</div>
<aside>
<p id="lie-1-aside" role="note" aria-live="assertive"
aria-hidden="true">
In truth, I loathe her.</p>
</aside>
</div>
Here’s the markup I used, which is a mix of HTML5 and ARIA. I indicated that “delighted” has
a role of “link” and also more specifically that it has a popup. But note that it is not an HTML
<a>.

21. <div id="container" role="document">
<div id="main" role="main">
<p>
“I could not be more
<span id="lie-1" role="link" aria-haspopup="true">delighted
</span>
to see you!” I exclaimed.
</p>
</div>
<aside>
<p id="lie-1-aside" role="note" aria-live="assertive"
aria-hidden="true">
In truth, I loathe her.</p>
</aside>
</div>
*[aria-hidden=true] {
display: none;
}
I use the aria-hidden attribute to tell the screenreader that it should be hidden, and also
apply that presentation to the CSS so it is also hidden for visual users.

22. [Video demo]

23. [Video demo]

24. 1 Usable with standard
tools and interfaces.

25. The Open University
These EPUBs from the Open University in the UK are available on iTunes U and make use of
some accessible HTML5. Specifically they use HTML5 <canvas> for some very exciting
interactive elements, but provide an alternate version that was carefully tested with VoiceOver
on iOS.

26. [Demo of the Open University book being read by VoiceOver on a Mac]

27. [Demo of the Open University book being read by VoiceOver on a Mac]

28. The Open University
http://bookbind.sourceforge.net/
Their toolkit for creating these books is completely open source.

29. accessible
1 Usable with standard
tools and interfaces.
1 Can be fully experienced
by the print-disabled.

30. 1 Can be fully experienced
by the print-disabled.

31. A brief digression
about games.

32. The Entertainment Software
Association (2008)
65%

33. The Entertainment Software
Association (2008)
65%
of Americans play videogames

34. Pew Internet (2008)
50%
of teenagers played a game

35. Pew Internet (2008)
50%
of teenagers played a game yesterday

36. Pew Internet (2008)
97%
of all American teenagers play videogames

37. Pew Internet (2008)
1 in 3
read discussions about games

38. Pew Internet (2008)
1 in 6 write about games
What’s important about these numbers is that games aren’t a solitary experience. Even
games that are meant for just one player generate a tremendous amount of discussion and
engagement. Game plots are analyzed and debated. Character motivations are discussed.
And unlike books, games offer players the ability to find new things and bring those
discoveries to the community.

39. Videogames are absolutely central to the lives of many younger people. They’re a form of
expression in their own right and one that everyone should be able to participate in if at all
possible.

40. Terry Garrett
1 Can be fully experienced
by the print-disabled.
Terry Garret is a blind gamer who learns to play games designed for sighted players only by listening to the audio.

42. [snippet of audio from the game]

43. [snippet of audio from the game]

44. Not all games are visual...

45. Papa Sangre
[Demo from Papa Sangre, a game for iOS that uses only 3D audio and no graphics]

46. Some games used to be text...

47. Get Lamp, by Jason Scott
[Clip from Get Lamp by Jason Scott, featuring blind players of text adventure games
describing their experience]

48. Get Lamp, by Jason Scott
[Clip from Get Lamp by Jason Scott, featuring blind players of text adventure games
describing their experience]

49. I believe that there’s a possible to bring games and books together in a way that is still
essentially bookish. We in the book community are uniquely positioned to bring the best of
the gaming experience to the world of literature. We can invite readers to not just turn pages,
but to take their own paths through the story and share those paths with others.

50. Fundamentally bookish.
Hybrid audio/text.
Encourage exploration
and sociability.
and we can do this in a way that is highly accessible to everyone.

51. References
http://www.archive.org/stream/refractionhowtor00thoriala http://www.archive.org/stream/
bradleysgamesthe00milt
http://www.archive.org/stream/internationalgam00gibs
http://bibliodyssey.blogspot.com/2010/02/
beautiful-bookbinding.html
http://www.archive.org/stream/machinery00unkngoog Entertainment Software Association
http://www.scribd.com/doc/4786879/
Pew Internet and American Life Project
http://bookbind.sourceforge.net/ http://www.pewinternet.org/Reports/
2008/Teens-Video-Games-and-
Civics.aspx
Accessible Rich Internet Applications (WAI-ARIA) 1.0
http://getlamp.com/
http://www.w3.org/TR/wai-aria/
Use of this PDF is governed by
Thanks! - @liza Creative Commons Share-Alike Non-Commercial
http://creativecommons.org/licenses/by-nc-sa/3.0/us/