[whatwg] rp is a styling tag and has no semantic function

Nikita Popov privat at ni-po.com
Fri Oct 30 07:00:10 PDT 2009

Futomi Hatano schrieb:
> On Fri, 30 Oct 2009 11:10:59 +0100
> Nikita Popov <privat at ni-po.com> wrote:
>> Talking about screen-readers: How should a screen-reader actually handle
>> ruby annotations? In this case
>> <ruby>
>> 漢 <rt> かん </rt>
>> 字 <rt> じ  </rt>
>> </ruby>
>> it would be quite strange if a screen-reader read the annotations,
>> because they have the same content as the ruby base text. (I hope this
>> is correct. I don't know the Japanese language, but I understood it as
>> 漢 beeing same as かん only in a different "way" of writing.) So the
>> reader must not read the annotation.
> More correctly, screen-readers should read only the contents of <rt> rather than the base text.
> That is, screen-readers are expected to read it as "ka-n-ji" from <rt>s.
> Of course, screen-readers which don't support <ruby> repeat 2 times such like "ka-n-ka-n-ji-ji" as you know.
I am not sure whether it is as easy. Please consider this one:
char <rt>pron 1</rt>
another char <rt>pron 2 pron 3</rt>
and some other text without a ruby annotation.
If a screen-reader now only would read the ruby-annotations, it would
sound like this: "pron 1 pron 2 pron 3" and the rest of the text
wouldn't be read.
> We also have to get <ruby> easy to read for visual browser users.
> But, the markup above is rendered by non-IE browsers as below.
> 漢かん字じ
> We feel it is odd.
> So, I want to mark it up like this.
> <ruby>漢字<rp>(</rp><rt>かんじ</rt><rp>)</rp></ruby>
> This markup is rendered by non-IE browsers as below.
> 漢字(かんじ)
> It's natural and easy to understand.
I fully agree that


is odd and not really understandable and that


is much better. But I still think that


is not the right way to mark this up. Much better would be:


An these two CSS-definitions:
rt:after {
content: ')';
rt:before {
content: '(';
This would add '(' before and ')' after all ruby-annotations. The only
problem is: Browsers being able to render ruby, will render the
parentheses too. So there must be another CSS-property, something like:
rt:after {
content: ')';
display: ruby-parenthese;
rt:before {
content: '(';
display: ruby-parenthese;
Browsers not knowing this value for ruby will fall back to display:
inline; and so display the parenthese. Browsers knowing ruby and this
property would not show the parentheses.
I think this is a much cleaner solution for the parentheses and the code
gets more readable.

Nikita Popov

More information about the whatwg mailing list