Media & Interactive Elements

With Pressbooks, you can include media and interactive elements such as H5P activities.

Audio and Video

Audio:

Smaller audio files can be uploaded directly to your book. You may also choose to stream audio from  SoundCloud. One of our first books, Mvskoke Language Patterns by Jack B. Martin, uses audio to introduce sounds from the Mvskoke language.

For video, simply use the share link from YouTube, Vimeo, or Kaltura and your video appears. You do not have to build it brick by brick.

View Transcript

This transcript begins at 3:35 to align with the start of the video on this page. The full video and its transcript are available on YouTube (opens a new window).

The video shows an intricate scene built with LEGO bricks: Thomas Paine and his printshop and printing press. Two offscreen hosts are discussing the build.

John: It’s a really great piece this is actually Thomas Paine’s printing office. And Thomas Paine, he was one of the the great voices of the Revolution and here, for 1776, The American Crisis was published in 1776 and 77 on forward. That’s the document that says, “These are the times that try men’s souls.”

Speaker 2: Dig in a little bit into this build here. Like what what made this? There’s some really intense technique exhibited. What do you find particularly interesting?

John: I love the modeling of the of the brick work, so that it’s got the multiple colors, the different brick work in the chimney there as well. It really kind of Pops. I don’t have the right words for it. It’s a really complex build. It looks like a brick building. It’s something that I can’t do, so when I see somebody else doing it, I love to see them doing it. And this is that stacked plate technique so it’s making each individual one-by-two plate look like its own brick. It gives those nice fine lines on there.

Then what he’s done with the figures as well is he’s actually given them those kind of pantaloons, so it’s very—

Speaker 2: I saw that initially. You see that from a mile away. That’s not a Lego mini-figure leg, right?

John: Right. And sometimes it’s okay to do that. Sometimes it’s fun to do that and the 18th century is when you’ve got the sexiness of the man is in the ankle so here here you’re drawing the accentuated lines right down to that ankle.

And then that printing press is just amazing. It looks exactly like the types of printing presses—and I pulled an image down there so we could depict them. [He shows a printed image of the historic press.] I mean that looks almost exactly like the type of printing press that Thomas Paine was operating in 1776. I have to give Ryan real props for that. That’s an amazing little micro build.

Speaker 2: Super, super amazing build. Good stuff.

John: Awesome. Thanks man.
Speaker 2: Thank you, John.
John: Have a good one.

Accessibility

Any media elements included in your book must comply with WCAG AA (accessibility guidelines).
  1. Video captions
  2. Transcripts for audio
  3. Audio descriptions for video-only content

Example: The video above has captions turned on by default, accomplished by adding &cc_load_policy=1 to the video’s YouTube share link. We also added a transcript directly below the video, which can be read by screen readers or expanded for anyone who would rather read than watch the video, but can also stay “folded up” for users who don’t want the transcript.

Enable Annotation with Hypothes.is

Pressbooks has built in support for Hypothes.is, an open source web annotation tool that allows public or private annotation, and facilitates discussions between students from within your book. You can enable public annotation, or limit comments and discussions to your class. Hypothes.is can also be activated on PDFs hosted within your book. You decide how you want users to be able to use the tools.

Hypothes.is provides examples and guides for educational use on their website.

Add interactive elements with H5P

Choose from over 50 different activity types to make your book interactive. In your EPUB and PDF exports, H5P activities will be replaced by placeholder text which includes a link to the activity in the webbook.

Examples of what you can do:

Top section of the Dunlap Broadside printing of the Declaration of Independence.

Not all h5P activities meet WCAG requirements. The H5P Group maintains a chart  of activities and their status.

You find more examples in other chapters of this showcase.

Interactive Content and Accessibility

As you consider the needs of your students and the types of content your work includes, use this table to understand how each distribution format handles that content. We’ll work with you to create fallbacks for some formats if needed.

Content Compatibility Matrix
Content Type Webbook (Browser) PDF (Print & Digital) EPUB (eReaders)
Standard Text & Images Fully Supported.
Reflows to fit screen size.
Fixed Layout.
Static placement ideal for printing.
Fully Supported.
Reflows; user controls font size.
H5P Interactive Activities Fully Interactive.
Quizzes, timelines, and games work natively.
Static Placeholder.
Displays an alert box with a link to the web activity.
Static Placeholder.
Displays a link to the web activity.
Audio & Video Embeds Playable.
Natively plays within the browser.
Not Supported.
Requires a fallback link or QR code to the web version.
Varies.
Some readers support it; others require a fallback link.
Hyperlinks Clickable. Visible URL required.
Links must be written out or converted to footnotes.
Clickable.
Complex Tables Scrollable.
Large tables can scroll horizontally.
Risk of Cut-off.
Wide tables may run off the page; requires redesign.
Squished/Scrollable.
Difficult to read on small screens.

Other embeds

Pressbooks allows iframes to be embedded from the providers listed below. Other iframes are restricted for security reasons.

  • PhET Interactive Simulations
  • knight lab Timeline
  • Brightcove
  • Google Forms
  • Google Maps
  • H5P iframe

License

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

W&M Press Showcase Book Copyright © by The College of William & Mary is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.