APEX@IGP

Infogrid Pacific-The Science of Information

34

Fixed Layout Test books

A range of aspect ratio and viewport size books exploring the various options in the IDPF Fixed Layout Specification and a discussion on design decisions. Updated: 2013-06-19

For more information on Fixed Layout visit our AZARDI FLO page.

Overview

The test books available for the IDPF Fixed Layout specification do not give a particularly good "production" view into the potential of fixed layout for any particular purpose on a range of devices.

This set of test books was created using IGP:Digital Publisher for the development of the upcoming AZARDI ePub3 fixed layout features update. They are primarily made available to users of IGP:Digital Publisher to understand and plan their various production requirements, but they may be useful for others as well. This list may be added to from time to time and the books may change to reflect testing requirements.

Please note these are development test books created for the purpose of evaluating software FLO ePub properties behaviour. There is no entertainment inside.

All these books were made in a day because of the absurb ease with which the property mechanics of fixed layout can be addressed in IGP:Digital Publisher. That doesn't of course mean creative products of excellence are as easy!

iBooks 3

The iBook3 support for the specification has been done very well in as far as they have gone. In particular the no-spread, portrait and landscape locked views are exceptionally well handled. A no-spread 4:3 aspect ratio landscape or portrait page takes over the whole screen giving designers a totally blank canvas. The zoom feature is more or less infinite which reveals the no-spread pages are actually images as the text pixels reveal themselves. This is hardly an issue given the resolution of the rendered image.

As expected it didn't like different page sizes so in some test books content goes missing.

The lack of spine controls is of course disappointing which means publishers will have to continue to make different books for different reading systems. What's new!

Readium

The IDPF Readium project fixed layout performance is reasonably complete but does not allow a proper landscape, no-spread presentation. The specified FLO properties are over-ruled by the users ability to choose one or two page views. This works against the intention of the spec. and against the ability to create great single page content where you don't want two page juxtaposition. The intention of fixed layout is presumably to give the book designer control not the end user.

Landscape presentation is also disappointing. The purpose in using landscape is of course to take over the maximum area of the viewport. What happens with Readium is the maximum landscape window that can be viewed is locked to half the viewport width. Let's hope that adjustment is on the roadmap.

AZARDI

Developing commercial ePub3 reading systems of value is non-trivial. While it is possible to do a quickie, or limited implementation of fixed-layout, it is essential to think of the end user first. For our target user channels: technical documentation, training and education users, fixed-layout with re-flowable sections is important. We tend to specialize in content that doesn't fit the paper chrome model.

It is important that the eBook behaviour makes visual, mental and tactile sense whether delivered from the desktop, a browser or on a table. That means a lot of testing and use cases.

For that reason this range of test books looks at the different presentation issues in terms of layout, orientation and spread to allow the evaluation of behaviour with default and optional FLO properties applied.

If anyone else is developing a FLO ePub reader and would like additional or different custom test cases please contact us at [azardi at infogridpacific dot com].

The Ultimate Fixed Layout Test/Demo Book

FLO Grows Up is a power fixed-layout test book. It covers everything in the specification and also covers the implied fixed-layout options.

The on the options for Fixed Layout Implementation are discussed in significant and illustrated detail in the AZARDI and ePub3 Fixed Layout article.

In summary this text/Demo book shows ALL of the fixed layout specification in action, plus a lot more. The ePub is annotated internally so you can see the various options. It uses some real content to lift it above just a test book into the power-demonstration category. Notably:

Reflowable and Fixed Layout mixed.

Full Fixed Layout spine property support.

Full page size variations supported.

Assymmetical viewports supported.

Correct spread layout behaviour

While this will load in iBooks and Readium because they do support ePub3, the book will not present correctly as those reading systems don't support most of these essential features. You will have to download and install AZARDI to see this working correctly in action. 

AZARDI has the tools to allow you to change background colour and page chrome interactively for your own preference. It even has ugly gutter shadow on spreads if you want to go there.

Download FLO Grows Up ➤

The IGP Fixed Layout ePub3 Test books

The 16:9 Test Book Series

Portrait Locked 16:9

No spread, portrait only pages with no spine controls. Pages are 1366px X 768px, being a popular laptop/desktop monitor size. We could have choosen 1680px X 1024px Galaxy Tab size at 162 dpi, but we needed desktop tests for AZARDI Online and AZARDI Desktop. Works well in iBooks, switch to single page view in Readium.

Download fxl-portrait-locked-16x9.epub

   

Landscape Locked 16:9

No spread, landscape only pages with no spine controls. Pages are 1366px X 768px, being a popular laptop/desktop monitor size. The idea is to fill the viewport rather than create a print-like page. Works well in iBooks, switch to single page view in Readium.

Download fxl-landscape-locked-16x9.epub   

Auto Spread 16:9

Spread portrait pages in a landscape/auto window with no spine controls. Pages are 683px X 768px, making a full spread size of 1366px X 768px being a popular laptop/desktop monitor size. Works well in iBooks, switch to two page view in Readium.

Download fxl-auto-spread-16x9.epub  

Forced Mixed Rendition 16:9

Spread portrait pages in a landscape/auto window with a number of spine controls including left, right, center and re-flowable sections. Pages are 683px X 768px, based on a popular laptop/desktop monitor size. iBooks ignores spine properties, switch to two page view in Readium.

Download fxl-spine-spread-16x9.epub   

Properties applied

This is the DP INI Configuration file for this book and demonstrates how the INI Config is used to update the FLO properties in the    OPF.

========================================
;EPUB3 FIXED LAYOUT CONVERTOR INI Config
;=======================================
[common]
XHTML:
CUSTOMXHTML: 
    id=Chapter4,<meta name="viewport" content="width=1366, height=768"/>;
    id=Chapter5,<meta name="viewport" content="width=768, height=768"/>;
    class=Colophon-rw,<meta name="viewport" content="width=1000, height=768"/>;
             
[idpf]
Declaration: prefix="rendition: http://www.idpf.org/vocab/rendition/#"
               
metadata:  
                 
spine: 
              
customspine: 
    class=Cover-rw,properties="rendition:page-spread-center";
    id=BookTitlePage1,properties="rendition:page-spread-center";
    id=Copyright1,properties="rendition:page-spread-center";
    id=Introduction1,properties="page-spread-right";
    id=Chapter4,properties="rendition:spread-none rendition:orientation-landscape";
    id=Chapter5,properties="rendition:spread-none rendition:orientation-portrait";
    id=Chapter6,properties="rendition:spread-none";
    id=Chapter7,properties="page-spread-right";
    id=Chapter8,properties="page-spread-left";
    class=Appendix-rw,properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none";
    class=Colophon-rw,properties="page-spread-right";
                     
=========================================
Generated FXL-Spine-Spread-16x9 OPF Spine
=========================================
                       
<spine page-progression-direction="ltr">
    <itemref idref="s001" linear="yes" properties="rendition:page-spread-center"/>
    <itemref idref="s002" linear="yes" properties="rendition:page-spread-center"/>
    <itemref idref="s003" linear="yes" properties="rendition:page-spread-center"/>
    <itemref idref="s005" linear="yes" properties="page-spread-right"/>
    <itemref idref="s006" linear="yes"/>
    <itemref idref="s007" linear="yes"/>
    <itemref idref="s008" linear="yes"/>
    <itemref idref="s009" linear="yes" properties="rendition:spread-none rendition:orientation-landscape"/>
    <itemref idref="s010" linear="yes" properties="rendition:spread-none rendition:orientation-portrait"/>
    <itemref idref="s011" linear="yes" properties="rendition:spread-none"/>
    <itemref idref="s012" linear="yes" properties="page-spread-right"/>
    <itemref idref="s013" linear="yes" properties="page-spread-left"/>
    <itemref idref="s014" linear="yes"/>
    <itemref idref="s015" linear="yes"/>
    <itemref idref="s016" linear="yes" properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none"/>
    <itemref idref="s017" linear="yes" properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none"/>
    <itemref idref="s018" linear="yes" properties="page-spread-right"/>
</spine>

The 4:3 Test Book Series

Portrait Locked 4:3

No spread portrait only pages with no spine controls. Pages are 2048px X 1536px (the dimensions of the new iPad screen). Works well in iBooks, switch to single page view in Readium.

Download fxl-portrait-locked-4x3.epub   

   

Landscape Locked 4:3

No spread, landscape only pages with no spine controls.Pages are 2048px X 1536px (the dimensions of the new iPad screen). Works well in iBooks, switch to single page view in Readium.

Download fxl-landscape-locked-4x3.epub       

Auto Spread 4:3

Spread portait pages in a landscape/auto window with no spine controls. Pages are 1024px X 1536px (the dimensions of the new iPad screen). Works well in iBooks, switch to two page view in Readium.

Download fxl-auto-spread-4x3.epub   

Flow to Fixed 4:3

Standard flow book with three chapters, each chapter linked to a stand-alone fixed-layout page that is linear-"no" in the spine and pages are not in the nav.xhtml. Doesn't work in iBooks at all, switch to one page view in Readium and open the TOC for best effect. .

Download fxl-flow2fixed-4x3.epub ➤

Forced Mixed Rendition 4:3

Spread portrait pages in a landscape/auto window with a number of spine controls including left, right, center and re-flowable sections. Pages are 1024px X 1536px (the dimensions of the new iPad screen). iBooks ignores spine properties, switch to two page view in Readium.

Download fxl-spine-spread-4x3.epub   

Properties applied

This is the DP INI Configuration file for this book and demonstrates how the INI Config is used to update the FLO properties in the OPF

========================================
;EPUB3 FIXED LAYOUT CONVERTOR Config INI
;=======================================
[common]
XHTML: 
CUSTOMXHTML: id=Chapter4,<meta name="viewport" content="width=2048, height=1536"/>;
    id=Chapter5,<meta name="viewport" content="width=1536, height=1536"/>;
    class=Colophon-rw,<meta name="viewport" content="width=1800, height=1536"/>;
                 
[idpf]
Declaration: prefix="rendition: http://www.idpf.org/vocab/rendition/#"
                     
metadata: 
                         
spine: 
                            
customspine:
    class=Cover-rw,properties="rendition:page-spread-center";
    id=BookTitlePage1,properties="page-spread-right";
    id=Copyright1,properties="rendition:page-spread-center";
    id=Introduction1,properties="page-spread-right";
    id=Chapter4,properties="rendition:spread-none rendition:orientation-landscape";
    id=Chapter5,properties="rendition:spread-none rendition:orientation-portrait";
    id=Chapter6,properties="rendition:spread-none";
    id=Chapter7,properties="page-spread-right";
    id=Chapter8,properties="page-spread-left";
    class=Appendix-rw,properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none";
    class=Colophon-rw,properties="page-spread-right";
  
========================================
Generated FXL-Spine-Spread-4x3 OPF Spine
========================================
<spine page-progression-direction="ltr">
    <itemref idref="s001" linear="yes" properties="rendition:page-spread-center"/>
    <itemref idref="s002" linear="yes" properties="page-spread-right"/>
    <itemref idref="s003" linear="yes" properties="rendition:page-spread-center"/>
    <itemref idref="s005" linear="yes" properties="page-spread-right"/>
    <itemref idref="s006" linear="yes"/>
    <itemref idref="s007" linear="yes"/>
    <itemref idref="s008" linear="yes"/>
    <itemref idref="s009" linear="yes" properties="rendition:spread-none rendition:orientation-landscape"/>
    <itemref idref="s010" linear="yes" properties="rendition:spread-none rendition:orientation-portrait"/>
    <itemref idref="s011" linear="yes" properties="rendition:spread-none"/>
    <itemref idref="s012" linear="yes" properties="page-spread-right"/>
    <itemref idref="s013" linear="yes" properties="page-spread-left"/>
    <itemref idref="s014" linear="yes"/>
    <itemref idref="s015" linear="yes"/>
    <itemref idref="s016" linear="yes" properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none"/>
    <itemref idref="s017" linear="yes" properties="rendition:layout-reflowable rendition:orientation-portrait rendition:spread-none"/>
    <itemref idref="s018" linear="yes" properties="page-spread-right"/>
</spine>

 Updates

2013-06-19. Included the FLO Grows Up section to demonstrate a complete Fixed layout implementation and the limitations of current reading systems.

comments powered by Disqus