Creación de páginas centradas en Texto en IE10

Internet Explorer 10 incluye dos nuevas características de CSS3 diseñadas para hacer más fácil a los programadores crear aplicaciones y páginas ricas centradas en texto. Las Regiones CSS3 ofrecen un mecanismo para trabajar con contenidos en varias áreas no contiguas. Además la Hyphenation CSS3 ofrece a los desarrolladores una forma fácil de separar el texto en sílabas en un amplio rango de lenguajes.

Vamos a ver qué nos ofrecen estas características de CSS3 en más detalle.

Regiones CSS3

Las regiones CSS3 ofrecen un mecanismo para tratar «moldear» contenidos. Además de añadir scrollbars, recortar contenidos , o dejar que el contenido sobrepase a su contenedor, los desarrolladores pueden pasar contenidos de un elemento a otro usando un par de nuevas propiedades de CSS 3.

Aquí tenemos una ilustración sobre cómo podemos usar las regiones CSS3:

Ejemplo de Region CSS3
Ejemplo de Region CSS3
Código de Regioness en CSS3
Código de Regioness en CSS3

Con CSS siempre se ha buscado la forma más optima de formatear el contenido de una aplicación o página web. Siempre ha sido un reto para la web crear diseños centrados en texto que realmente brillen.

Hace unos meses Adobe introdujo las Regiones de CSS 3 en la W3C con el co-editor de Internet Explorer Alex Mogilevsky. Esta especificación define un evento, una propiedad y un método que, juntos, permite a los desarrolladores crear y administrar regiones dinámicamente a traves de JavaScript. Ya está disponible una versión temprana de esas capacidades en IE10. El borrador de la especifiación de las regiones de CSS3 de la W3C podéis consultarla aquí.

CSS Hyphenation

La segunda caracterísitca de la que vamos a hablar consiste en el soporte nativo en IE10 para CSS 3 Hyphenation que permite a los desarrolladores obtener un gran rendimiento a la hora de separar palabras en sílabas en el navegador.

A medida que fueron incluyendose las multicolumnas, posiciones relativas y las regiones en CSS 3, han permitido crear escenarios más complejos a la hora de mostrar y crear layouts centradas en texto, incluyendo los problemas más comunes en cuanto a tipografía se refiere:

Ejemplo de Hyphenation.
Ejemplo sin Hyphenation.

Para poder crear sitios web y aplicaciones que realmente brillen es muy importante el uso de esta característica para que la interfaz sea realmente robusta en cualquier navegador.

Gracias a la experiencia de Microsoft después de tantos años con Office, Internet Explorer 10 soporta esto en los 18 lenguajes más comunes. Entre los que están el catalán, danés, inglés, francés, alemán, italiano, portugués, español, y un largo etcétera.

 

Separación de sílabas (Hyphenation)
Separación de sílabas (Hyphenation)

 

Espero que os sirva.

Juan María Laó Ramos.

0 comentarios sobre “Creación de páginas centradas en Texto en IE10”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *