w3c / epub-specs

Shared workspace for EPUB 3 specifications.
Other
307 stars 60 forks source link

Recommend adoption of "text-vertical-align" property for paged media #217

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
# EPUB specification proposal

This is related to the specifications of EPUB itself instead of WebKit or 
Readium.

This is a design seen in vertical-writing Japanese books called "Naka-Tobira 
(中扉)", which means "Sectional Title Page". It is not supported in the 
present CSS specifications.
I strongly recommend adding "-text-vertical-align" in "@page rule" for paged 
media as an EPUB specification feature.

【example】
[Style]
@page {
  -epub-vertical-text-align:middle;
}

[HTML]
<h1>第一章 賢治の夢の世界</h1>
【Figure】
http://voyager-dev.info/readium/jp/images/chapter.png

----
http://voyager-dev.info/readium/jp/page_vertical_align.html

Original issue reported on code.google.com by ko...@voyager.co.jp on 9 Apr 2012 at 7:38

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago

Original comment by d...@google.com on 28 Mar 2013 at 5:29

GoogleCodeExporter commented 9 years ago

Original comment by mgarrish on 28 Mar 2013 at 8:56

GoogleCodeExporter commented 9 years ago
I would be more comfortable to use a property in OPF rather than CSS for this 
purpose for the following reasons:
1. CSS may or may not define such property in future. Such an unknown extension 
should be done in OPF rather than proprietary extensions to CSS.
2. CSS Page is still under big discussion and is still very early stage for how 
to define in browser (rather than PDF generation software.) It's safer not to 
rely too much on such an early spec.
3. Implementation-wise, this is done during paging calculation rather than 
layout-within-pages, and therefore RS is easier to handle if defined in OPF.

Original comment by kojii...@gmail.com on 31 Mar 2013 at 8:37

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
By the method which Brady wrote, it does not operate well.
<html>
<head>
    <style>
    .vert {-epub-writing-mode: vertical-rl;}
    p {margin-left: auto; margin-right: auto;}
    </style>
</head>
<body>
    <p class="vert">ABC</p>
</body>
</html>

By the method which Brady wrote, it does not operate well. 
A more complicated method has been tried, as below;

<html>
    <head>
        <meta charset="utf-8" />
          body.hori {
              -epub-writing-mode:horizontal-tb;
          }
          div.vert {
              width:auto;
              height:auto;
              margin-right:auto;
              margin-left:auto;
              -epub-writing-mode:vertical-rl;
          }
    </head>
    <body class="hori">
        <div class="vert">
            <p>ABC</p>
        </div>
    </body>
</html>

but even by this method, the text of the overflowing portion will be out of 
display.

So, I proposed to specify this as a new function in 3.0.1.
I first thought of doing this in CSS, but now I agree to the way Ishii-san has 
written: to use a property in OPF.

ex)
<spine page-progression-direction="rtl">
  <itemref idref="XHTML001a" properties="vertical-align:middle" />
  ....
</spine>

Off course, a suitable prefix is needed.

Original comment by ko...@voyager.co.jp on 1 Apr 2013 at 10:04

GoogleCodeExporter commented 9 years ago
I'm afraid this is a new feature request and it is too short to start the 
discussion as 301.

I assume content creators will design pages based on this property, but the 
pages will not be rendered correctly on existing EPUB 3 viewers. I don't think 
the new property is existing viewer friendly.

The property behaves like as CSS properties, so its processing model should be 
defined as well. Without evaluating the processing model, it is hard to judge 
whether it is easy to implement or not, I think.

Original comment by tkanai...@gmail.com on 9 Apr 2013 at 4:45

GoogleCodeExporter commented 9 years ago
We're probably not using CSS property model but OPF property model, please stay 
tuned for the proposal to come out to discuss technical details further.

This issue has been under discussion for more than two years among us, and I 
hear a lot of complaints from many publishers and vendors. I don't think it's 
too short. Also, we will take care of backward compatibility issue as much as 
we can, at least to the level the new property won't make things worse.

Thanks for the opinion anyway.

Original comment by kojii...@gmail.com on 9 Apr 2013 at 12:55

GoogleCodeExporter commented 9 years ago
After discussing with Koike-san and some back-and-forth, I'm almost back to 
Koike-san's original proposal except a few minor differences.

The proposal is to add a itemref property:
  Name: align-x-center
  Description: The content document is layout as usual, then the resulting box is centered horizontally. If the content document consists of multiple pages, all pages are centered.
  Usage: Package Document spine itemref element
  Cardinality: Zero or one

Example:
  <spine page-progression-direction="rtl">
    <itemref idref="XHTML001a" properties="align-x-center" />
    ....
  </spine>

FAQ:
Q: Why "vertical-align" is renamed to "align-x"?
A: In order to make it clear that the direction is physical, not logical.

Q: Why "center", not "middle"?
A: In order to align the value names in CSS. In CSS, "middle" indicates the 
center of x-height due to historical reasons, and "center" is the center.

Q: Why use "-", not ":" as in Koike-san's original proposal?
A: Considering future possibility to add this as meta property, syntax is 
aligned with "Specifying name-value pairs on the spine itemref element"
   http://www.idpf.org/epub/fxl/#syntax-itemref
   With this syntax, in future when needed, we could define a meta property named "align-x" with "center" value.

Q: Why physical, not logical?
A: To make calculation slightly easier, and also because there's no real use 
cases to align center vertically.
   There was a discussion in Japan that why this issue only came up in Japan.
   Our best guess is that, when layouting a small object in a page with lots of margins,
   it makes most sense to center horizontally, and bottom margin being larger than top.
   In horizontal flow, this layout can be done by text-align:center with appropriate margins.
   In vertical flow, CSS can't handle this property, and this property came in to help.

Q: Why not to define in CSS?
A: This property is a document property, not an element property, and 
inheritance/cascading is not needed at all.
   This property has nothing to do with layout within page boxes.
   It is also easy to implement outside the rendering engine.
   Such property is better defined in OPF than in CSS.

Original comment by kojii...@gmail.com on 2 May 2013 at 7:49

GoogleCodeExporter commented 9 years ago
Not only in Japanese Books, Books in Traditional Chinese also designed in that 
way.
I've made several books with "Naka-Tobira". Some of them positioned by margin 
proportion, you have to do responsive design for multi-screen. And once reading 
system changed their way to render, I have to adjust again. 
align-x-center could do great help for ebook design and capability. I support 
Koike-san and Ishii-san's proposal.
Adding align-y-center also do great help for book design in easy way.

Original comment by bobbyt...@wanderer.tw on 2 May 2013 at 8:32

Attachments:

GoogleCodeExporter commented 9 years ago
Although I am sympathetic, I think that we should ask W3C CSS WG.

Original comment by eb2m...@gmail.com on 6 May 2013 at 11:36

GoogleCodeExporter commented 9 years ago
A first draft of the prose has now been committed for review:

https://code.google.com/p/epub-revision/source/detail?r=4657

The rendered html can be accessed here:

https://epub-revision.googlecode.com/svn-history/r4657/trunk/build/301/spec/epub
30-publications.html

Please review the prose for accuracy and completeness, in particular the 
informative note at the end. If any additional changes are necessary, please 
note them in this issue.

Original comment by mgarrish on 15 Jun 2013 at 5:55

GoogleCodeExporter commented 9 years ago
Noticed that the fragment identifier got stripped from the URL in #17. Direct 
link to the rendered section is:

https://epub-revision.googlecode.com/svn-history/r4657/trunk/build/301/spec/epub
30-publications.html#layout-property-align-x-center

Original comment by mgarrish on 11 Jul 2013 at 2:33

GoogleCodeExporter commented 9 years ago
The second paragraph has been updated to the following, as decided on the 
2013-07-11 telecon:

For reflowable content, Reading Systems that support this property must center 
each virtual page.

https://code.google.com/p/epub-revision/source/detail?r=4686

Original comment by mgarrish on 12 Jul 2013 at 11:49

GoogleCodeExporter commented 9 years ago

Original comment by markus.g...@gmail.com on 17 Jul 2013 at 8:30