EPUB with Multiple Renditions for different viewports and devices

7 posts / 0 new
Last post

Hi Everyone
I am new to the world of EPUBs. I have been exploring the possibilities of developing an EPUB with multiple renditions for different devices. Currently I'm testing through iBooks and I'm trying to get two different renditions displaying when the user changes the orientation of their device. I have specified rendition:media="(orientation: portrait)" and rendition:media="(orientation: landscape)" on the different root files as explained in this article:http://matt.garrish.ca/2015/08/the-making-of-multiple-renditions/. However the device only displays the first rendition regardless of, which device orientation is used. I have also tried to include (min-width:value) inside the rendition:media and this doesn't make any difference. I have searched for example files to check the code in my container.xml, however the only example is for the Braille text. Would anyone know if it's possible to display different renditions on different devices? My container code.xml currently includes the below. Perhaps I'm missing additional information to assist the device in detecting the correct rendition to display. Thanks.

container.xml code:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">
<rootfiles>
<rootfile full-path="OEBPS/content.opf" media-type="application/oebps-package+xml" rendition:layout="pre-paginated" rendition:label="Normal"/>
<rootfile full-path="OEBPS/contentp.opf" media-type="application/oebps-package+xml" rendition:layout="pre-paginated" rendition:media="(orientation:portrait)" rendition:label="Portrait-Layout"/>
<rootfile full-path="OEBPS/contentl.opf" media-type="application/oebps-package+xml" rendition:layout="pre-paginated" rendition:media="(orientation:landscape)" rendition:label="Landscape-Layout" />

</rootfiles>
</container>

Readium had an experimental build with support for multiple renditions, but that's the only reading system I know of that's implemented any of the specification so far.

There was talk of incorporating multiple renditions into the 3.1 revision, but because it's still a new specification and lacks implementations it's been nixed.

Here it is noted, that it is not a requirement to care about this for EPUB 3 viewers:
http://www.idpf.org/epub/renditions/multiple/#sec-1.2.1

If you do not use a viewer that claims to interpret this, this might be the reason for the problem.

Can't you simply use CSS media queries in the CSS files for this purpose or do you really need a completely different rendition?
Media queries should work better and are part of EPUB 3.0.1.

That section has nothing to do with reading system support. It's a note that you can author multiple renditions in a container without following the specification and they will still be valid per OCF rules. That's a practical acknowledgement that OCF has been around for a long time and the specification can't just invalidate anything that came before, even though virtually no one was using multiple renditions.

Ok, but still multiple renditions does not belong to EPUB 3.0.1

More pracitcal problem: There are still distributors, retailer, book creation programms sticking into EPUB 2. If authors try to use EPUB 3.0 or 3.0.1, they often hit this trouble. Obviously even worse for even newer features like this.
Maybe this is an indication, that there is not much need to hurry with new versions or features.

However, obviously not much trouble for retailers like apple oder amazon to create own extensions or versions or clone formats of EPUB ;-)

Hi matt.garrish and O.H.
Thanks for your feedback. I've tried a few workarounds, using iBooks to test on an iPad and iPhone.

Tried setting up the viewport to device-width and device-height in hopes that different media queries would run with device orientation since the viewport widths would be different sizes. However it seems that I need to set a pixel width and height otherwise the content displays too small and wide in the reading system. Also when I use pixel measurements for the viewport width and height, when rotating the device the viewport remains the same size just scaled so styling from the media queries doesn't change. Is there anyway for the viewport of an EPUBs to adjust to 100% width and height using pre-paginated layout? I would like to have the epub show as a portrait layout when the device is in portrait orientation and then a landscape layout to display when the user rotates to landscape orientation using media queries to adjust styling as the width and height of the device change.

Thanks again.
D

Hi matt.garrish and O.H.
Thanks for your feedback. I've tried a few workarounds, using iBooks to test on an iPad and iPhone.

Tried setting up the viewport to device-width and device-height in hopes that different media queries would run with device orientation since the viewport widths would be different sizes. However it seems that I need to set a pixel width and height otherwise the content displays too small and wide in the reading system. Also when I use pixel measurements for the viewport width and height, when rotating the device the viewport remains the same size just scaled so styling from the media queries doesn't change. Is there anyway for the viewport of an EPUBs to adjust to 100% width and height using pre-paginated layout? I would like to have the epub show as a portrait layout when the device is in portrait orientation and then a landscape layout to display when the user rotates to landscape orientation using media queries to adjust styling as the width and height of the device change.

Thanks again.
D

Secondary menu