W3C Tokyo Workshop – part 2 – new CSS modules

Several CSS module can help the publishing industry create better e-publications. Such technologies, now implemented in the latest versions of the main browsers, were presented by CSS experts: Rachel Andrew, Elika Etemad  (aka Fantasai), Dave Cramer (Hachette Livre US), Myles MaxField (Apple), Nat McCully (Adobe) and Shinyu Murakami (Vivliostyle).

CSS Grids and Media queries are a way to create responsive layouts, i.e. a layouts which automatically adapt to the size of the user screen. Unlike reflowable content, there is no automatic pagination of the content if it does not fit in to the screen size. And unlike fixed layout, the author can choose the exact rendition of the page as a function of the size of the user screen, using media queries. If the screen is small, the author may choose to adapt the position of the information, minimize the font size or decide to filter out some content.

The question is therefore: is there an interest from the publishing industry to move from Fixed Layout to Responsive Layout for certain types of ebooks, e.g. arty publications, scholarly and educational publishing, digital comics?

We believe that for some applications, Responsive Layout could well be a great move from skeuomorphic e-publications. Jen Simmons, advocate of the CSS Grid module, demonstrates on her website the power of CSS Grids for highly designed pages. Digital educational publishing would also benefit from a clearer separation between lessons, illustrations and exercices, when  the student is reading his manual on a mobile device (Fixed Layout is a nuisance in such a case).

Such technology may also be suitable for digital comics, as Pablo Defendini from digitalcomics.co demonstrated during the conference. The drawback to this way of authoring comics is the additional work needed to obtain, for different screen sizes, a graphical balance between the different elements placed on the screen. Few authors will be ready today to loose, for instance, the precision of the placement of a balloon connected to a character, for enabling a fixed font balloon in a panel of flexible size. This may be easier when we move from a “multi-panel page” centric type of comics to a “mobile first / single panel page” type, we’ll talk about that in another post.

CSS Paged Media is suitable for printing HTML/CSS based ebooks, with proper margins, headers, page numbers, etc. We could say it’s a replicate in CSS of the good old XSL-FO that we all miss (don’t we?).

The Vivliostyle viewer is a good tool to visualize the result of such presentation, as demonstrated on stage by Shinyu Murakami from Vivliostyle.

We used the opportunity of this workshop to raise once again the issue we face at EDRLab/Readium, regarding dynamic pagination of reflowable content. In order to paginate content in a reading system based of e.g. the Readium SDK, we are obliged to use CSS multi-columns, the only technology available on all browser engines, but somewhat flawed (Jiminy Panoz, creator of  Readium css, wrote an great article on the subject. All reading engine developers need browser engines to support a better solution for paginating content on screen.

The response of the CSS experts in the room was that the browser vendors currently don’t feel a strong pressure to develop such technology; the corresponding CSS module, namely CSS Fragmentation, is therefore still a draft and nobody is working on it. In order to move the project forward, there is a need for supporters of this project to participate, directly (EDRLab) of via hired CSS experts, to the finalization of the CSS Fragmentation module and lobby the main browser vendors to integrate it in a next version.

The good news is that the meeting was the opportunity to meet a senior developer working on Google Blink, who told us that CSS Fragmentation will be included in the next major version of Blink, early next year. We hope that the representatives of Mozilla and Apple, who were participating to the conference, will forward the issue to their teams. We’ll continue talking to these people during the next W3C Technical Plenary meeting, in Lyon in October.