FWIW, since Eric is working on ruby overhang, AFAIK, white space should become much less pronounced. I therefore would personally opt for more legible ruby characters (read: 8px or 9px) over whitespace worries.<div><br></div>
<div>Cheers,</div><div><br></div><div>- Roland<br><br><div class="gmail_quote">On Thu, Nov 4, 2010 at 8:05 AM, Yasuo Kida <span dir="ltr"><<a href="mailto:kida@apple.com">kida@apple.com</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex;">
<div style="word-wrap:break-word">Right. It is partly because webkit currently does not use glyphs that are designed for ruby. I would not worry this too much as with 14px many kanjis are only barely legible in anyway without the context. The lower bound for ruby can be 8px for base 16px = 12pt in 96dpi. I am reluctant to raise it to 9 px.<div>
<br></div><div>It would be more important to keep the 50% ratio until we hit the threshold to avoid too many white spaces between base characters.<div><br></div><div><div><font color="#888888">- kida</font><div><div></div>
<div class="h5"><br><div><br><div><div>On 2010/11/03, at 15:49, Ryosuke Niwa wrote:</div><br><blockquote type="cite"><div>Yes that works. With anything below 9px, it's really hard to differentiate $BBy2;(B ($B$P$S$V$Y$\(B) & $BH>By2;(B ($B$Q$T$W$Z$\(B).</div>
<br><div>- Ryosuke<br><br><div class="gmail_quote">2010/11/3 Yasuo Kida <span dir="ltr"><<a href="mailto:kida@apple.com" target="_blank">kida@apple.com</a>></span><br><blockquote class="gmail_quote" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0.8ex;border-left-width:1px;border-left-color:rgb(204, 204, 204);border-left-style:solid;padding-left:1ex">
<div style="word-wrap:break-word">Does this work?<div><br></div><div><a href="http://plexode.com/eval3/#ht=%3Cdiv%20style%3D%22font-size%3A16px%3B%22%3E%0A16px-8px%3A%3Cruby%3E%3Crb%3E%E5%9B%BD%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%8F%E3%81%AB%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C%2Frt%3E%3C%2Fruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C%2Frt%3E%3C%2Fruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C%2Frt%3E%3C%2Fruby%3E%E3%81%99%E3%82%8B" target="_blank">http://plexode.com/eval3/#ht=%3Cdiv%20style%3D%22font-size%3A16px%3B%22%3E%0A16px-8px%3A%3Cruby%3E%3Crb%3E$B9q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$/$K(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$B>]D'(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$7$g$&$A$g$&(B%3C%2Frt%3E%3C%2Fruby%3E%3Cruby%3E%3Crb%3E$B54Lg(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$-$b$s(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$BJ}3Q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$[$&$,$/(B%3C%2Frt%3E%3C%2Fruby%3E$B$r(B%3Cruby%3E%3Crb%3E$B6E;k(B%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A8px%3B%22%3E$B$.$g$&$7(B%3C%2Frt%3E%3C%2Fruby%3E$B$9$k(B</a>$B!#(B%3Cbr%3E%0A16px-9px%3A%3Cruby%3E%3Crb%3E$B9q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A9px%3B%22%3E$B$/$K(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$B>]D'(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A9px%3B%22%3E$B$7$g$&$A$g$&(B%3C%2Frt%3E%3C%2Fruby%3E%3Cruby%3E%3Crb%3E$B54Lg(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A9px%3B%22%3E$B$-$b$s(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$BJ}3Q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A9px%3B%22%3E$B$[$&$,$/(B%3C%2Frt%3E%3C%2Fruby%3E$B$r(B%3Cruby%3E%3Crb%3E$B6E;k(B%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A9px%3B%22%3E$B$.$g$&$7(B%3C%2Frt%3E%3C%2Fruby%3E$B$9$k!#(B%3Cbr%3E%3Cbr%3E%0A%3C%2Fdiv%3E%0A%0A%3Cdiv%20style%3D%22font-size%3A14px%3B%22%3E%0A14px-7px%3A%3Cruby%3E%3Crb%3E$B9q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E$B$/$K(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$B>]D'(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E$B$7$g$&$A$g$&(B%3C%2Frt%3E%3C%2Fruby%3E%3Cruby%3E%3Crb%3E$B54Lg(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E$B$-$b$s(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$BJ}3Q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E$B$[$&$,$/(B%3C%2Frt%3E%3C%2Fruby%3E$B$r(B%3Cruby%3E%3Crb%3E$B6E;k(B%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A7px%3B%22%3E$B$.$g$&$7(B%3C%2Frt%3E%3C%2Fruby%3E$B$9$k!#(B%3Cbr%3E%0A14px-9px%3A%3Cruby%3E%3Crb%3E$B9q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$/$K(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$B>]D'(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$7$g$&$A$g$&(B%3C%2Frt%3E%3C%2Fruby%3E%3Cruby%3E%3Crb%3E$B54Lg(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$-$b$s(B%3C%2Frt%3E%3C%2Fruby%3E$B$N(B%3Cruby%3E%3Crb%3E$BJ}3Q(B%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E$B$[$&$,$/(B%3C%2Frt%3E%3C%2Fruby%3E$B$r(B%3Cruby%3E%3Crb%3E$B6E;k(B%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A8px%3B%22%3E$B$.$g$&$7(B%3C%2Frt%3E%3C%2Fruby%3E$B$9$k!#(B%3Cbr%3E%0A%3C%2Fdiv%3E%0A&ohh=1&ohj=1&jt=&ojh=1&ojj=1&ms=100&oth=0&otj=0&cex=1</div>
<div><br></div><div><br></div><div>According to "<a href="http://www.w3.org/TR/2009/NOTE-jlreq-20090604/#en-subheading2_3_3" target="_blank">Choice of Size for Ruby Characters</a>" in "Requirements for Japanese Text Layout":</div>
<div><br></div><div><blockquote type="cite">(note 2) When the size of base characters is very small (for e.g. smaller than seven points), ruby which is half the size, will be even more small and illegible. In such cases where the size of base characters is very small, ruby is not a suitable method of annotation. In those cases, consider other annotation methods such as adding the reading in parenthesis immediately after the base character.<br>
</blockquote><div><br></div></div><div>- kida</div><div><div></div><div><div><br><div><div>On 2010/11/03, at 15:21, Ryosuke Niwa wrote:</div><br><blockquote type="cite">Hi Yasuko,<div><br></div><div>Somehow your example isn't working. Could you copy & paste the HTML?</div>
<div><br></div><div>- Ryosuke<br><br><div class="gmail_quote">On Wed, Nov 3, 2010 at 3:11 PM, Yasuo Kida <span dir="ltr"><<a href="mailto:kida@apple.com" target="_blank">kida@apple.com</a>></span> wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div style="word-wrap:break-word"><div>Thank you Ryosuke. This is a good demo. 5px is only barely legible and I agree it is too small. 6px is legible but not fun to read. 7px looks reasonable lower bound to me.</div>
<div><br></div><div>12pt text with 96dpi would translates to 16px, 50% ruby would be 8px. 10.5pt which is often used by printed books is 14px, 50% ruby would be 7px.</div><div><br></div><div>I do not think we should make the limit larger than 8px. The larger the ruby size gets the more often you need to put extra gaps in the base text, which makes the base text harder to read. See the <a href="http://plexode.com/eval3/#ht=%3Cdiv%20style=%22font-size:16px;%22%3E%0A16px-8px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A16px-9px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:9px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%3Cbr%3E%0A%3C/div%3E%0A%0A%3Cdiv%20style=%22font-size:14px;%22%3E%0A14px-7px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:7px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A14px-8px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A%3C/div%3E%0A&ohh=1&ohj=1&jt=&ojh=1&ojj=1&ms=100&oth=0&otj=0&cex=1" target="_blank"></a><a href="http://plexode.com/eval3/#ht=%3Cdiv%20style=%22font-size:16px;%22%3E%0A16px-8px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A16px-9px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:9px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%3Cbr%3E%0A%3C/div%3E%0A%0A%3Cdiv%20style=%22font-size:14px;%22%3E%0A14px-7px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:7px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A14px-9px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A%3C/div%3E%0A&ohh=1&ohj=1&jt=&ojh=1&ojj=1&ms=100&oth=0&otj=0&cex=1" target="_blank">e</a><a href="http://plexode.com/eval3/#ht=%3Cdiv%20style=%22font-size:16px;%22%3E%0A16px-8px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A16px-9px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:9px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:9px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%3Cbr%3E%0A%3C/div%3E%0A%0A%3Cdiv%20style=%22font-size:14px;%22%3E%0A14px-7px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:7px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:7px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A14px-9px:%3Cruby%3E%3Crb%3E%E5%9B%BD%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8F%E3%81%AB%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E8%B1%A1%E5%BE%B4%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%97%E3%82%87%E3%81%86%E3%81%A1%E3%82%87%E3%81%86%3C/rt%3E%3C/ruby%3E%3Cruby%3E%3Crb%3E%E9%AC%BC%E9%96%80%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%8D%E3%82%82%E3%82%93%3C/rt%3E%3C/ruby%3E%E3%81%AE%3Cruby%3E%3Crb%3E%E6%96%B9%E8%A7%92%3C/rb%3E%3Crt%20style=%22font-size:8px;%22%3E%E3%81%BB%E3%81%86%E3%81%8C%E3%81%8F%3C/rt%3E%3C/ruby%3E%E3%82%92%3Cruby%3E%3Crb%3E%E5%87%9D%E8%A6%96%3C/rb%3E%3Crt%20%20style=%22font-size:8px;%22%3E%E3%81%8E%E3%82%87%E3%81%86%E3%81%97%3C/rt%3E%3C/ruby%3E%E3%81%99%E3%82%8B%E3%80%82%3Cbr%3E%0A%3C/div%3E%0A&ohh=1&ohj=1&jt=&ojh=1&ojj=1&ms=100&oth=0&otj=0&cex=1" target="_blank">xample</a>.</div>
<div><br></div><font color="#888888"><div>- kida</div></font><div><div></div><div><br><div><div>On 2010/11/03, at 14:01, David Hyatt wrote:</div><br><blockquote type="cite"><div style="word-wrap:break-word">Yeah, that demo makes me think maybe 9px is fine after all. :)<div>
<br></div><div>dave</div><div><br><div><div>On Nov 3, 2010, at 3:56 PM, Ryosuke Niwa wrote:</div><br><blockquote type="cite">I think 5px is way too small. Maybe 7 or 8 at least but even those are really hard to read in high-resolution displays. <a href="http://plexode.com/eval3/#ht=5px%3A%3Cruby%3E%3Crb%3E%E4%BB%8A%E6%97%A5%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A5px%3B%22%3E%E3%81%8D%E3%82%87%E3%81%86%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AF%3Cruby%3E%3Crb%3E%E8%89%AF%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A5px%3B%22%3E%E3%82%88%3C%2Frt%3E%3C%2Fruby%3E%E3%81%84%3Cruby%3E%3Crb%3E%E5%A4%A9%E6%B0%97%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A5px%3B%22%3E%E3%81%A6%E3%82%93%E3%81%8D%3C%2Frt%3E%3C%2Fruby%3E%3Cbr%3E%0A6px%3A%3Cruby%3E%3Crb%3E%E4%BB%8A%E6%97%A5%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A6px%3B%22%3E%E3%81%8D%E3%82%87%E3%81%86%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AF%3Cruby%3E%3Crb%3E%E8%89%AF%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A6px%3B%22%3E%E3%82%88%3C%2Frt%3E%3C%2Fruby%3E%E3%81%84%3Cruby%3E%3Crb%3E%E5%A4%A9%E6%B0%97%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A6px%3B%22%3E%E3%81%A6%E3%82%93%E3%81%8D%3C%2Frt%3E%3C%2Fruby%3E%3Cbr%3E%0A7px%3A%3Cruby%3E%3Crb%3E%E4%BB%8A%E6%97%A5%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E%E3%81%8D%E3%82%87%E3%81%86%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AF%3Cruby%3E%3Crb%3E%E8%89%AF%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A7px%3B%22%3E%E3%82%88%3C%2Frt%3E%3C%2Fruby%3E%E3%81%84%3Cruby%3E%3Crb%3E%E5%A4%A9%E6%B0%97%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A7px%3B%22%3E%E3%81%A6%E3%82%93%E3%81%8D%3C%2Frt%3E%3C%2Fruby%3E%3Cbr%3E%0A8px%3A%3Cruby%3E%3Crb%3E%E4%BB%8A%E6%97%A5%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%8D%E3%82%87%E3%81%86%3C%2Frt%3E%3C%2Fruby%3E%E3%81%AF%3Cruby%3E%3Crb%3E%E8%89%AF%3C%2Frb%3E%3Crt%20style%3D%22font-size%3A8px%3B%22%3E%E3%82%88%3C%2Frt%3E%3C%2Fruby%3E%E3%81%84%3Cruby%3E%3Crb%3E%E5%A4%A9%E6%B0%97%3C%2Frb%3E%3Crt%20%20style%3D%22font-size%3A8px%3B%22%3E%E3%81%A6%E3%82%93%E3%81%8D%3C%2Frt%3E%3C%2Fruby%3E%3Cbr%3E%3C%2Fdiv%3E&ohh=1&ohj=1&jt=&ojh=1&ojj=1&ms=100&oth=0&otj=0&cex=1" target="_blank">See demo</a>.<div>
<br></div><div>- Ryosuke<br><div><br><div class="gmail_quote">On Wed, Nov 3, 2010 at 12:47 PM, David Hyatt <span dir="ltr"><<a href="mailto:hyatt@apple.com" target="_blank">hyatt@apple.com</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div style="word-wrap:break-word">That document also states:<div><br></div><div>"When the size of base characters is very small (for e.g. smaller than seven points), ruby which is half the size, will be even more small and illegible. In such cases where the size of base characters is very small, ruby is not a suitable method of annotation. In those cases, consider other annotation methods such as adding the reading in parenthesis immediately after the base character.</div>
<div><br></div><div>It also sounds like we need to special case Ruby elements and allow their font sizes to go down to about 5px instead of 9px. Anything lower, and you're getting to the point where ruby was unsuitable (according to the text above) anyway, since the base text was so small.</div>
<div><br></div><div>I filed:</div><div><br></div><div><a href="https://bugs.webkit.org/show_bug.cgi?id=48942" target="_blank">https://bugs.webkit.org/show_bug.cgi?id=48942</a></div><div><br></div><div>dave</div><div>(<a href="mailto:hyatt@apple.com" target="_blank">hyatt@apple.com</a>)</div>
<div><div></div><div><div><br><div><div>On Nov 3, 2010, at 2:29 PM, Yasuo Kida wrote:</div><br><blockquote type="cite"><div style="word-wrap:break-word"><div>In printing the standard is 50% of the base text. For larger point sizes like headings, the size of ruby is often smaller than 50%.</div>
<div><br></div><div><a href="http://www.w3.org/TR/2009/NOTE-jlreq-20090604/#en-subheading2_3_3" target="_blank">http://www.w3.org/TR/2009/NOTE-jlreq-20090604/#en-subheading2_3_3</a></div><div><br></div><div>So, how about we default to 50% and see how they come out. Glyphs designed for ruby are optimized for those small point sizes. It is possible on some screen resolutions we might want to make it a bit bigger but as screen resolution gets higher I think it makes more sense to stick to 50% following the standard in printing.</div>
<div><br></div><div>- kida</div><div><br></div><div><div>On 2010/11/03, at 12:05, Eric Mader wrote:</div><br><blockquote type="cite"><div style="word-wrap:break-word"><br><div><div>On Nov 3, 2010, at 8:56 AM, David Hyatt wrote:</div>
<br><blockquote type="cite"><div style="word-wrap:break-word">WebKit enforces a minimum font size of 9px when no explicit font size is specified. This means that the font for <rt> cannot fall below 9px if it is relative to the user agent default. It may be that we want to consider modifying this minimum for ruby text and allow it to go below 9px though. I'm not sure.</div>
</blockquote><div><br></div>Yes, that's probably what I'm seeing. I'm using default font size, which is probably 12pt.</div><div><br><blockquote type="cite"><div style="word-wrap:break-word"><div>If you make a really big Ruby (e.g., <ruby style="font-size:96px"> and then modify the font-size percentage on the <rt>, you should be able to see it take effect.</div>
<div><br></div><div>We should probably just study real-world Japanese examples to see how small Ruby typically is allowed to get. If it can go below 9px and still be readable, we should perhaps consider allowing that.</div>
</div></blockquote><div><br></div>I'm sure the detailed spec. addresses this issue. I'll review it.</div><div><br><blockquote type="cite"><div style="word-wrap:break-word"><div>In terms of excluding Ruby text from the overall line height, I don't think the font-size of the <rt> is particularly relevant. You just want to hack the Ruby to turn the ruby text into overflow rather than having it be part of the overall height of the inline-block.</div>
</div></blockquote><div><br></div>Of course. The website I was using has the line height set too tight for correct display this way, and I just wanted to try a smaller size to see if it looked better. OTOH, that site loads a style sheet that overrides the ruby text font-size to 6pt, so I can't easily override it, and its' probably displaying as 9pt anyhow.</div>
<div><br></div><div><blockquote type="cite"><div style="word-wrap:break-word"><div>dave</div><div>(<a href="mailto:hyatt@apple.com" target="_blank">hyatt@apple.com</a>)</div></div></blockquote><div><br></div>Regards,</div>
<div>Eric</div><div><br><blockquote type="cite"><div style="word-wrap:break-word"><div><div><div><div>On Nov 3, 2010, at 1:20 PM, Eric Mader wrote:</div><br><blockquote type="cite"><div style="word-wrap:break-word">Hi,<div>
<br></div><div>As part of my work on ruby text enhancements, I'm implementing the option of not counting the height of the ruby text in the overall line height. As part of this, I wanted to play with changing the size of the ruby text. I'm trying to do this by changing the following lines in <WebKit>/WebCore/css/html.css:</div>
<div><br></div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px">ruby > rt {</div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px"> display: block;</div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px">
font-size: 60%; /* make slightly larger than 50% for better readability */</div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px"> text-align: center;</div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px">
text-decoration: none;</div><div style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px">}</div><div><br></div><div>However, when I change the font-size: attribute to, say, 50%, I don't see any difference in the size of the ruby text. (I even tried 25% just to be sure). Is this value being set somewhere else?</div>
<div><br></div><div>Regards,</div><div>Eric Mader</div><div><br></div></div>_______________________________________________<br>webkit-dev mailing list<br><a href="mailto:webkit-dev@lists.webkit.org" target="_blank">webkit-dev@lists.webkit.org</a><br>
<a href="http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev" target="_blank">http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev</a><br></blockquote></div><br></div></div></div></blockquote></div><br></div>_______________________________________________<br>
webkit-dev mailing list<br><a href="mailto:webkit-dev@lists.webkit.org" target="_blank">webkit-dev@lists.webkit.org</a><br><a href="http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev" target="_blank">http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev</a><br>
</blockquote></div><br></div>_______________________________________________<br>webkit-dev mailing list<br><a href="mailto:webkit-dev@lists.webkit.org" target="_blank">webkit-dev@lists.webkit.org</a><br><a href="http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev" target="_blank">http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev</a><br>
</blockquote></div><br></div></div></div></div><br>_______________________________________________<br>
webkit-dev mailing list<br>
<a href="mailto:webkit-dev@lists.webkit.org" target="_blank">webkit-dev@lists.webkit.org</a><br>
<a href="http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev" target="_blank">http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev</a><br>
<br></blockquote></div><br></div></div>
</blockquote></div><br></div></div></blockquote></div><br></div></div></div></blockquote></div><br></div>
</blockquote></div><br></div></div></div></div></blockquote></div><br></div>
</blockquote></div><br></div></div></div></div></div></div></div><br>_______________________________________________<br>
webkit-dev mailing list<br>
<a href="mailto:webkit-dev@lists.webkit.org">webkit-dev@lists.webkit.org</a><br>
<a href="http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev" target="_blank">http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev</a><br>
<br></blockquote></div><br></div>