jueves, 28 de febrero de 2013

Tips HTML5 – Etiqueta ruby

Esta es una etiqueta nueva, de tipo semántico y se usa para definir caracteres ruby, que son anotaciones que se usan en lenguajes ideogramáticos como por ejemplo el Japonés, con el fin de brindar una guía sobre su pronunciación.

Dentro de estas etiquetas colocamos el texto por ejemplo en japonés, y por medio de la etiqueta auxiliar <rt> definimos los furigana que indican la pronunciación del kanji. La etiqueta <rp> nos permite definir dentro de ella el carácter de paréntesis.

En el siguiente ejemplo traducido equivale a “Mi nombre es Fabián”

<ruby><rp>(</rp><rt>わたし</rt><rp>)</rp>
</ruby><ruby>
    名前 <rp>(</rp><rt>なまえ</rt><rp>)</rp>
</ruby>
ファビアン

En nuestra pagina se vera de la siguiente forma:

ruby

Usando hojas de estilo se podría lograr una mejor presentación, como podemos ver en el siguiente ejemplo, en donde el furigana aparece sobre el kanji correspondiente.

rubyExample

Como dato curioso, el nombre para esta notación deriva del nombre de una tipo de fuente de tamaño 5pt que era usado en las impresoras.

No hay comentarios: