Your SlideShare is downloading. ×
  • Like
Accessible interactive books with EPUB 3
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Accessible interactive books with EPUB 3

  • 18,536 views
Published

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. …

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.

Published in Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
18,536
On SlideShare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
325
Comments
0
Likes
8

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Highly accessibleinteractive EPUB Liza Daly (@liza) Threepress / Ibis Reader
  • 2. Highly accessibleinteractive EPUB Liza Daly (@liza) Threepress / Ibis Reader
  • 3. Highly accessibleinteractive EPUB Liza Daly (@liza) Threepress / Ibis Reader
  • 4. Highly accessibleinteractive EPUB
  • 5. accessible1 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 gWAI-ARIA provides a framework foridentifying features for user interaction, howthey relate to each other, and their current state.
  • 8. WAI-ARIA gIt describes new navigation techniques to markregions as menus, primary/secondary content,and other types of Web structures.
  • 9. HTML5 gIt describes new navigation techniques to markregions 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 footerARIA and HTML5 have some overlap in the semantic language they use to describe documentstructure. When working with HTML5 and/or EPUB 3, you should use the HTML5 elementsrather than these ARIA roles. (Or both!)
  • 11. applicationBecause this talk is about interactivity, I’m going to focus on those aspects of ARIA that aremeant to enhance the accessibility of “applications,” as opposed to “documents.” Aninteractive 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 thatdescribe what the narrator was thinking at the time.
  • 16. PropertyAttributes that are essential to the nature of agiven object, or that represent a data valueassociated 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 popup indicating how the narrator really felt at the time. In a normal scenario, the popup herewould _not_ be visible to a screen reader, nor would the user of the assistive reader evenrealize 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 linkTo begin to annotate this with ARIA information, I need to annotate the text with its role inthe application. “Delighted” behaves like a hyperlink -- but it’s not actually a link to anotherdocument. 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 thestate 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” hasa 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 alsoapply 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 UniversityThese EPUBs from the Open University in the UK are available on iTunes U and make use ofsome accessible HTML5. Specifically they use HTML5 <canvas> for some very excitinginteractive elements, but provide an alternate version that was carefully tested with VoiceOveron 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. accessible1 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 digressionabout 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 3read discussions about games
  • 38. Pew Internet (2008) 1 in 6 write about gamesWhat’s important about these numbers is that games aren’t a solitary experience. Evengames that are meant for just one player generate a tremendous amount of discussion andengagement. Game plots are analyzed and debated. Character motivations are discussed.And unlike books, games offer players the ability to find new things and bring thosediscoveries to the community.
  • 39. Videogames are absolutely central to the lives of many younger people. They’re a form ofexpression in their own right and one that everyone should be able to participate in if at allpossible.
  • 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.
  • 41. [snippet of audio from the game]
  • 42. [snippet of audio from the game]
  • 43. Not all games are visual...
  • 44. Papa Sangre[Demo from Papa Sangre, a game for iOS that uses only 3D audio and no graphics]
  • 45. Some games used to be text...
  • 46. Get Lamp, by Jason Scott[Clip from Get Lamp by Jason Scott, featuring blind players of text adventure gamesdescribing their experience]
  • 47. Get Lamp, by Jason Scott[Clip from Get Lamp by Jason Scott, featuring blind players of text adventure gamesdescribing their experience]
  • 48. I believe that there’s a possible to bring games and books together in a way that is stillessentially bookish. We in the book community are uniquely positioned to bring the best ofthe 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.
  • 49. Fundamentally bookish. Hybrid audio/text. Encourage exploration and sociability.and we can do this in a way that is highly accessible to everyone.
  • 50. 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 byThanks! - @liza Creative Commons Share-Alike Non-Commercial http://creativecommons.org/licenses/by-nc-sa/3.0/us/