La tecla de acceso 'n' lleva a la navegación de la página. Ir al inicio del contenido.

Este documento es una traducción. En caso de discrepancias o errores, la única versión normativa es el último original en inglés. Los derechos de autor originales corresponden al W3C, como puede verse al final de la página.

Traductor: Spanish Translation Team, Spanish Translation US.

s_gotoW3cHome Internacionalización
 

CSS3 y texto internacional

Audiencia de destino: Autores de contenido HTML/XHTML y CSS que desean tener una idea general de lo que depara el futuro con respecto a si CSS admitirá caracteres no latinos. El artículo supone una comprensión básica de CSS.

Los módulos de CSS3 actualmente en desarrollo presentan una gran cantidad de propiedades diseñadas para admitir caracteres no latinos, desde escritura vertical hasta justificación kashida, desde posicionamiento ruby hasta numeración de listas. Este artículo le brinda un panorama de algunas de las propiedades que se aplicarán en el futuro y analiza de qué manera usted puede ayudar a convertir estas mejoras en realidad.

Este artículo no explica todas las propiedades que se planifica incluir en CSS3 para que admita texto internacional. Le dará una idea de lo que viene para que usted pueda ver los potenciales beneficios de completar el trabajo.

Ninguna de las especificaciones que analizaremos aquí están terminadas.

Esperamos que el artículo le genere expectativas y lo motive, según el caso, a involucrarse en la concreción de estos módulos hasta su etapa final y en su implementación por parte de los agentes del usuario.

Listas

La forma de numeración de los ítems de una lista varía según el sistema de escritura. En CSS2, se especificaron nueve sistemas de numeración no latina. Tales sistemas incluían: griego en minúscula, hebreo, armenio, georgiano, ideográfico cjk, hiragana, katakana, hiragana-iroha, katakana-iroha. Desafortunadamente, los agentes del usuario no implementaron todos los anteriores y, como parte de su misión de representar un breve resumen del uso actual, la especificación CSS2.1 redujo ese número a dos: armenio y georgiano.

Esto muestra hasta qué punto es importante que nos exprese su opinión respecto de si desea que se admitan caracteres no latinos en especificaciones y agentes de usuarios.

Es necesario señalar que el comportamiento esperado de estas opciones también se especificó de manera deficiente.

valores de list-style-type en CSS 2 y CSS 2.1

valores de list-style-type en CSS 2 y CSS 2.1

El Módulo de listas CSS3 actualmente especifica casi 70 esquemas no latinos para la numeración de listas y proporciona reglas mucho más rigurosas con respecto a su uso. (Sin embargo, si desea evitar esta reducción, ¡no lo acepte como algo definitivo y haga oír su opinión! De vez en cuando, los implementadores tienden a preguntarse si es necesario admitir tantas cantidad de posibilidades.)

list-style-type en CSS3

list-style-type en CSS3

Texto

Dirección del texto

CSS3 habilita el uso de texto vertical, y debe hacerlo de manera tal que la decisión entre dirección vertical u horizontal sea puramente estilística; es decir, usted podría pasar de un texto horizontal bien diseñado a un texto vertical bien diseñado y volver a la hoja de estilo haciendo unos simples ajustes, sin necesidad de cambiar las etiquetas. También podrá combinar texto horizontal y vertical en la misma página.

Aquí los parámetros clave son la dirección de progresión de bloque, la dirección de texto en línea y la orientación de glifo.

Propiedades de dirección de texto.

Propiedades de dirección de texto.

La dirección de progresión de bloque le permite especificar la dirección en la cual fluyen las líneas de texto. De arriba hacia abajo sería adecuado para el texto horizontal, dado que las líneas se colocan en ese mismo sentido. De derecha a izquierda sería la configuración normal para chino, japonés y coreano vertical, donde las líneas avanzan de derecha a izquierda de la página o del bloque. De izquierda a derecha sería adecuado para un sistema de escritura como el mongol, que también es vertical, pero en el que la vista comienza a leer de arriba hacia abajo.

Dentro de una línea determinada, debe ser posible especificar la direccionalidad en línea del texto. De derecha a izquierda sería adecuado para sistemas de escritura como el árabe y el hebreo. Esto debe interpretarse en relación con la dirección de la progresión de bloque.

Se ha propuesto una propiedad de modo de escritura como un acceso directo que une la progresión en bloque y en línea en una serie de combinaciones comunes.

Por eso es necesario proporcionar un medio para controlar si las letras latinas en el sistema japonés vertical aparecen de costado (como 'Johansson', que se observa en la imagen), o derechos (como 'FIFA', que también se observa en la imagen), y si el texto (izquierda a derecha y derecha a izquierda) corre en línea vertical o descendente.

Algunos de los aspectos más difíciles de la dirección del texto se relacionan con la forma de proporcionar el medio preferido por el usuario para admitir texto en línea en párrafos configurados en sentido vertical. El Grupo de Trabajo de CSS analiza actualmente cómo debería funcionar esto (mayo de 2006).

División de línea

Cuando el texto pasa a la siguiente línea para adaptarse al trayecto (text wrap), el tipo de sistema de escritura afecta el comportamiento esperado, en particular con respecto al tratamiento de espacios en blanco alrededor de las divisiones de línea en el código.

Los sistemas chino y japonés no delimitan las palabras con espacios y se adaptan al trayecto según el carácter en cuestión. Sin embargo, hay algunas reglas (denominadas reglas kinsoku en Japón) que prohíben que ciertos caracteres (principalmente de puntuación final) aparezcan al comienzo de la línea y otras que prohíben que ciertos caracteres aparezcan al final de la línea.

El sistema de escritura tai utiliza espacios para delimitar las frases en lugar de las palabras y, en general, no utiliza puntuación final para las oraciones. Sin embargo, existe un marcado concepto de la palabra, y el texto debe adaptarse al trayecto en los límites de aquélla. Algunos sistemas tai consisten en el agregado de espacios duros de anchura cero para indicar cuándo corresponde pasar a la siguiente línea para adaptarse al trayecto, pero es más común utilizar un diccionario para determinar los límites de las palabras.

A menos que la hoja de estilo requiera que se conserve el espacio, cuando se maneja el sistema latino, el proceso general de mostrar texto que pasa a una nueva línea en la fuente implica, en primer lugar, reducir a un solo espacio todos los espacios en blanco al comienzo y al final de la línea. Luego, a menos que la hoja de estilo indique lo contrario, los caracteres que se encuentran en la división de línea y todos los espacios circundantes se reducen a un solo espacio.

Las propiedades de división de línea en CSS3 le permitirán indicar el comportamiento adecuado para sistemas de escritura como el chino, el japonés y el tai, en los que puede no ser adecuado agregar un espacio entre texto adaptado al trayecto. (Esta es un área bastante complicada y aún se sigue debatiendo cuál es la mejor forma de abordarla.)

Algunas de las propiedades de CSS3 le permitirán especificar si adaptar o no al trayecto en forma diferente en medio de un texto incrustado desde otro sistema de escritura. Por ejemplo, si aparece un texto latino en medio de un texto chino, ¿debe adaptarse al trayecto caracter por caracter o palabra por palabra? Ambos enfoques son válidos y el CSS debe permitirle elegir según sus preferencias generales o según el contexto. (Vea los dos ejemplos en la figura que aparece debajo)

Posibilidades de división de línea con textos CJK y latino combinados.

Posibilidades de división de línea con textos CJK y latino combinados.

También es importante permitir que el usuario exprese sus preferencias con respecto a las reglas kinsoku y sus equivalentes chino y coreano. El ejemplo que aparece en la parte superior de la figura a continuación muestra un resultado típico cuando el último carácter de una línea está seguido de un carácter katakana pequeño.

Kana pequeño y divisiones de línea.

Kana pequeño y divisiones de línea.

El carácter katakana pequeño comienza en la segunda línea. Esto tiende a ser la opción preferida en la tipografía japonesa moderna y es particularmente útil en texto con columnas estrechas. El segundo ejemplo muestra el resultado de un enfoque diferente, al que con frecuencia se califica de 'estricto'. El algoritmo de adaptación al trayecto ahora arrastra el último carácter katakana hacia abajo desde la línea anterior, de manera que el carácter katakana pequeño ya no se encuentra en la posición inicial en línea y, si el texto no está justificado, deja una brecha al final de la línea.

Una forma de aplicar las reglas kinsoku para el final de la línea es pasar los dos caracteres hacia abajo, a la siguiente línea. Esto puede hacerse, por ejemplo, para evitar que aparezca un delimitador final de la oración al comienzo de una línea.

Una alternativa es dejar la puntuación colgando fuera del margen. CSS3 debe permitirle controlar esto.

Puntuación colgante.

Puntuación colgante.

Alineación de texto y justificación

Al especificar la alineación y justificación del texto, CSS debe permitirle especificar cómo se aplicará la justificación a texto a sistemas de escritura combinados. El ejemplo que aparece debajo muestra cómo un solo enfoque puede hacer que el espaciado entre caracteres se aplique a caracteres ideográficos pero no a texto latino.

Las propiedades para controlar la justificación también permitirán los tipos de justificación adecuados para varios sistemas de escritura diferentes, por ejemplo, ideográficos, índicos con conectores con línea de base, del sudeste asiático que no utilizan espacios entre palabras, escrituras cursivas como el árabe, etc.

Tipo de justificación configurada en normal e interideográfica.

Tipo de justificación configurada en normal e interideográfica.

El sistema de escritura árabe generalmente se justifica expandiendo las líneas de base conectadas de las letras que forman las palabras, en lugar de expandir los espacios entre éstas. CSS3 debe brindar propiedades que permitan extender la línea de base de este modo.

También debe poder especificar hasta qué punto se aplica dicha expansión al justificar.

Tipo de justificación configurada en normal y kashida.

Tipo de justificación configurada en normal y kashida.

Como parte del proceso de justificación de texto CJK, es posible que desee especificar si se aplica compresión de espacios en blanco y cómo se comporta esta característica. La imagen que aparece debajo muestra un ejemplo de paréntesis de ancho completo en japonés, al que se le ha eliminado su espacio en blanco para permitir la compresión.

Recorte durante la justificación del texto.

Recorte durante la justificación del texto.

También debe poder especificar si un signo de puntuación de ancho completo en texto ideográfico debe estrecharse al comienzo de una línea, de modo que sus líneas "de tinta" se coloquen al mismo nivel que el primer glifo en las líneas superiores e inferiores. Esto hace que el margen izquierdo o superior se vean más prolijos, pero también afecta la justificación de la línea en la que esto ocurre.

Recorte de puntuación inicial de línea.

Recorte de puntuación inicial de línea.

Espaciado de texto

Cuando aparece texto no ideográfico o cifras en un texto ideográfico, con frecuencia es preferible separarlos con un pequeño espacio adicional. CSS3 brinda una propiedad que le permite agregar dicho espacio sin necesidad de espaciar el contenido. Puede aplicarlo alrededor de una serie de distintos tipos de texto incrustado y combinarlos como desee.

Autoespaciado de texto configurado en normal, luego en numérico y alfabético.

Autoespaciado de texto configurado en normal, luego en numérico y alfabético.

Grillas de documentos

Es común que los glifos de documentos escritos en idiomas del este asiático aparezcan distribuidos en la página siguiendo un patrón de grilla. Este enfoque está apoyado por el hecho de que los caracteres ideográficos, kana y hangul tienden a presentar el mismo ancho.

CSS3 puede especificar una serie de propiedades para aplicar a grillas y para administrar caracteres sin ancho completo dentro de la grilla, como texto latino, de varias maneras. Tales propiedades indicarían si la grilla debe aplicarse a caracteres no ideográficos del mismo modo que a caracteres CJK.

Esta imagen muestra texto vertical en japonés sin grilla.

Texto en japonés sin grilla.

Texto en japonés sin grilla.

En la siguiente imagen, observamos el efecto de aplicar un tipo de diseño de grilla al texto anterior.

Texto en japonés con un diseño basado en grilla.

Texto en japonés con un diseño basado en grilla.

Kumimoji y warichu

Kumimoji es un término japonés que se refiere a la práctica de combinar hasta 5 glifos dentro de un espacio de glifo de ancho simple.

Kumimoji.

Kumimoji.

Warichu es un término japonés que se refiere a un tipo de nota en línea, donde el texto corre en dos líneas.

Warichu.

Warichu.

Ambos efectos están disponibles mediante las propiedades de CSS3.

Énfasis

El módulo de fuentes de CSS3 permite formas nativas de énfasis, como los puntos de énfasis utilizados en el japonés. El uso de éstos es similar al de la itálica o negrita en el texto latino: ninguno de ellos funciona bien en tamaños de fuente pequeños para texto ideográfico en pantalla.

Puntos de énfasis japoneses.

Puntos de énfasis japoneses.

Se necesitan diversas propiedades para especificar el tipo de carácter de énfasis a utilizar y la posición relativa al texto base (es decir, superior o inferior para texto horizontal, e izquierdo o derecho para vertical).

Módulo ruby

Ruby es un tipo de anotación asociada a un texto base que se utiliza con frecuencia en japonés y, hacia cierto punto, también en chino, para proporcionar información sobre pronunciación de ideógrafos y, a veces, explicaciones breves. El nombre 'ruby' proviene de un tamaño de fuente denominado de ese modo (aproximadamente la mitad de la fuente normal de 10 puntos) utilizado por tipógrafos británicos. En japonés se conoce como furigana.

Etiquetas ruby

La Recomendación sobre la anotación ruby describe cómo etiquetar texto de manera que quede claro cuál es el texto base y cuál es la anotación. (Esta no es una especificación de CSS) Hay modelos ruby simples y complejos. La imagen que aparece debajo muestra la forma más simple de etiquetado descrita en la Recomendación. El texto en el elemento <rt> es la anotación. El texto base es el elemento <rb>.

Ruby tal como aparece y con la etiqueta.

Ruby tal como aparece y con la etiqueta.

Un agente de usuario que muestra la etiqueta ruby normalmente muestra texto ruby simple sobre el texto base horizontal y en un tamaño de fuente más pequeño. Para texto vertical, la etiqueta ruby aparecería hacia la derecha de manera predeterminada.

Para obtener una descripción más detallada, consulte Estilo y etiquetado de ruby.

Estilo de ruby

Es posible que en ocasiones quiera controlar la ubicación del texto ruby. Por ejemplo, la especificación de la Anotación ruby establece que es común colocar anotaciones pinyin debajo de texto horizontal en chino, en lugar de colocarlas sobre éste. CSS3 brinda una propiedad que le dará control sobre la ubicación.

Posición de ruby: anterior

Posición de ruby: anterior

Si especifica la posición anterior, el texto ruby aparecerá sobre el texto base horizontal y hacia la derecha del texto vertical. Si especifica la posición posterior, y el texto ruby aparece debajo del texto base horizontal y hacia la izquierda del texto vertical.

Posición de ruby: posterior

Posición de ruby: posterior

Podría ser útil un valor de "derecha" para administrar anotaciones bopomofo en texto chino tradicional, donde ruby aparece en una columna hacia la derecha de cada carácter ideográfico, ya sea que el texto sea horizontal o vertical.

Posición de ruby: derecha

Posición de ruby: derecha

También se necesitan propiedades para indicar la alineación relativa de ruby y el texto base cuando uno es más largo que el otro. Esencialmente, el efecto se aplica al que sea más corto, ya sea el texto ruby o el texto base.

La imagen que aparece debajo muestra cómo se vería el texto si se configurara una propiedad de alineación ruby al final. (Pase por alto la línea verde, que está allí sólo para mostrar los límites con más claridad)

Alineación de ruby: final

Alineación de ruby: final

Si el texto ruby es más ancho que el texto base, usted puede especificar si excede o no el tamaño de cualquier texto base circundante, y hasta qué punto lo excede, utilizando la propiedad de ruby excedente.

El ejemplo de la siguiente imagen muestra el efecto de configurar una propiedad de ruby excedente al inicio. Observe cómo el texto ruby se superpone a los caracteres precedentes, pero no al siguiente texto base. Observe también que ruby no se superpone a sí mismo.

Excedente de ruby: inicio

Excedente de ruby: inicio

Para obtener una descripción más detallada del enfoque actual propuesto para estilo de ruby, consulte Estilo y etiquetado de ruby.

¿Cuándo estará listo?

Situación actual

Lejos de haber revisado la totalidad de posibilidades, hemos analizado muy brevemente algunos de los módulos CSS3 admitidos en el ámbito internacional que se ofrecerán. Sólo realizamos un breve análisis de las propiedades descritas. Cuando CSS3 esté listo, muchas de las secciones aquí incluidas podrían convertirse, merecidamente, en un artículo independiente.

Algunas de las funciones analizadas se han implementado en Internet Explorer 5+, pero las especificaciones han sido modificadas desde entonces; por lo tanto, usted debe ser muy cuidadoso al utilizarlas. No hay garantía de que una función implementada en la actualidad en Internet Explorer se convierta en un código interoperable a largo plazo. Por ejemplo, las propiedades de diseño de grilla ahora son completamente distintas.

Con la posible excepción de la propiedad de tipo de lista, no parece haber implementaciones de estas funciones en otros agentes de usuario hasta el momento.

Si estas implementaciones le despiertan curiosidad, podrá encontrar algunos ejemplos en las siguientes páginas.

La siguiente lista indica el estado actual de los módulos aquí analizados. Tenga en cuenta que aún se está trabajando en el desarrollo de estas especificaciones. Incluso la Recomendación candidata puede volver a ser un Borrador de trabajo antes de convertirse en Recomendación.

Esta no es una lista exhaustiva de especificaciones que contenga propiedades pertinentes al texto internacional. Por ejemplo, el Módulo de línea CSS3 propuesto, que aún no ha sido publicado como Borrador de trabajo, promete otorgar cierto nivel significativo de control sobre el comportamiento de la alineación de líneas de base en los sistemas de escritura.

También hay trabajo adicional que debe completarse en módulos que dependen de estas especificaciones.

¿Cómo acelerar el proceso?

Si está interesado en ver la disponibilidad de estas funciones, hágaselo saber al equipo de W3C. Siempre nos resulta útil saber lo que desean los usuarios. También hay varias maneras prácticas de participar.

El Grupo de Trabajo de CSS tiene una gran cantidad de trabajo en este momento, por lo que el desarrollo de estos módulos ha avanzado lentamente. Tal como se mencionó, actualmente hay un constante debate acerca de las funciones en las Recomendaciones candidatas. Apreciamos su colaboración en el desarrollo de estas especificaciones.

Usted puede ayudar al avance de dichas especificaciones revisando los documentos públicos disponibles, o haciendo comentarios sobre ellos. Si tiene experiencia en esta área, es posible que también considere la posibilidad de participar en el CSS en los Grupos de trabajo sobre internacionalización para ayudar en el avance de las tareas. La especificación JIS 4051 japonés contribuyó a desarrollar una significativa parte de dichas tareas, pero aún quedan numerosas áreas donde sería útil contar con información local o confirmación de los requisitos y de los comportamientos esperados del texto en otros sistemas de escritura.

Incluso si avanzamos con estas especificaciones hasta la etapa de Recomendación, todavía no hemos ganado la batalla. Los desarrolladores de agentes de usuario deben implementar estas funciones para que podamos usarlas y necesitamos que las propiedades se implementen en forma masiva en una serie de agentes de usuario. Nuevamente, escuchar la opinión de los usuarios locales es importante para concretar los objetivos. Es improbable que los desarrolladores de agentes de usuarios implementen estas funciones si nadie se las pide.

Finalmente, usted puede ayudar manteniéndose informado sobre estas funciones e implementándolas en sus contenidos cuando estén disponibles.

Dinos qué piensas (en Inglés).

Suscripción a feed RSS.

Nuevos recursos

Noticias de la página de inicio

Twitter (Noticias de la página de inicio)

‎@webi18n

Lecturas complementarias

De: Richard Ishida, W3C. Traductor: Spanish Translation Team, Spanish Translation US..

XHTML 1.0 válido
CSS válido
Codificado en UTF-8

Traducido del inglés con fecha 2006-05-17. Traducción modificada por última vez el 2011-05-04 8:51 GMT.

Para ver el historial de cambios del documento, busque article-css3-text en la bitácora de internacionalización.