Manual Web

Introducción a XSLT

Qué es XSLT

XSLT o XSL Transformations es la parte más importante del lenguaje XSL (eXtensible StyleSheet Language). La función de XSLT es la de transformar documentos XML en documentos XHTML u otros documentos XML. El W3C es el encargado de la definición de especificación XSLT.

XSLT se basa en XPath para realizar la búsqueda de información a través del documento XML. XPath son cadenas que son expresiones regulares, las cuales hacen referencia a alguna estructura dentro del documento XML.

El proceso de transformación se basa en plantillas. Dichas plantillas identifican una estructura a partir de la cual realizar la transformación (con XPath), así como las acciones a realizar con dicha estructura: recorrerla, obtener el dato de la etiqueta, el valor de alguno de sus atributos, contar cuantos elementos tiene la etiqueta anidados,...

Además, para poder aplicar las transformaciones, necesitaremos asociar el documento de transformación al documento XML receptor de la misma.

Antes de empezar a aprender más cosas sobre XSLT sería recomendable que tuvieses algún conocimiento sobre XML.

HTML versus XML+XSLT

A diferencia del lenguaje HTML, donde cada una de sus etiquetas lleva asociada una representación gráfica, el XML identifica datos, los cuales no tienen representación gráfica asociada.

Cuando definimos una tabla en HTML (la etiqueta table), sabemos que las herramientas que interpreten el documento HTML, normalmente los navegadores web, pintarán la tabla. De una forma u otra visualizaremos la tabla en nuestra pantalla.

Si bien, si tenemos un documento XML, donde podemos tener definida la etiqueta <libro>, está no tendrá ninguna representación gráfica asociada. Es por ello que si visualizamos nuestro documento XML con alguna herramienta, esta, mostrará el contenido de la etiqueta, pero sin ninguna representación.

Es en este punto donde entra el lenguaje XSLT. Y es que este lenguaje permite transformar el susodicho documento XML en otro formato, el resultado de la transformación será el que lleve la representación gráfica.

Ejemplos de transformaciones

Así, podemos tener múltiples transformaciones del documento XML en otros documentos de distintos lenguajes: XHTML, SVG, VRML,... Por ejemplo, un documento XML que tuviese una lista de números podría ser transformado en: una tabla o lista de hitos con dicho listado en HTML, en un gráfico de líneas con SVG o podrían ser las alturas de figuras 3D con VRML.

Veamos cómo serían dichas transformaciones:

XML original

 2
 4
 6
 8

XML transformado en HTML

 
<table>
<tbody>
<tr>
<th>Datos</th>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>4</td>
</tr>
<tr>
<td>6</td>
</tr>
<tr>
<td>8</td>
</tr>
</tbody>
</table>
 

XML transformado en SVG

XML transformado en VRML

#VRML V2.0 utf8
 Box {
  size 2 4 6
}

En estos ejemplos, vemos que los datos de partida de un documento XML son utilizados como contenido de otros documentos que tienen representaciones gráficas y pasan a ser valores de los mismos. En el documento HTML son datos de una tabla, en el documento SVG son las coordenadas de una línea y en el documento VRML son las dimensiones de un cubo.

tags:HTML, svg, table, transformar, vrml, w3c, xhtml, xml, xpath

Introducción al HTML

¿Qué es el HTML?

HTML significa HyperText Markup Langauage. Es un lenguaje para crear páginas web mediante el uso de etiquetas. Dentro de este lenguaje, se puede incluir texto, imágenes, elementos multimedia, enlaces a otras páginas y elementos,...

Los navegadores o browsers serán los encargados de leer e interpretar el lenguaje HTML de las páginas web con el fin de configurar la forma gráfica de la página.

Una de las características del lenguaje HTML son los enlaces. Los enlaces nos permiten establecer navegaciones de una página web a otra. Esto es lo que hace diferente al HTML de otros formatos como Microsoft Word, PDF,...

¿Quién define el HTML?

El organismo que gestiona la especificación del lenguaje HTML es W3C (Word Wide Web Consortium). La última versión del estándar es HTML 4.01 (24 de diciembre de 1999).

Si bien en un principio se pensó que el HTML fuese un lenguaje portable en su totalidad a diferentes maquinas, ya fuesen MAC, UNIX,... hoy en día cada empresa ha ido generando sus variaciones sobre los estándares, por lo que puede suceder que haya algunas etiquetas que no sean visualizados por algunos navegadores o se visualicen de diferente forma.

Esto implica que cuando desarrollemos una página web, nos veamos obligados a escribir código específico para alguno de los navegadores, así como a realizar un testing sobre las diferentes plataformas/navegadores, asegurando la compatibilidad de nuestra web.

Herramientas para crear código HTML

Las páginas HTML son nada más que texto plano. Es por ello que, para crearlas, simplemente necesitemos de la ayuda de un editor o procesador de textos.

Editores de Texto

Puedes utilizar cualquier editor de texto. El Notepad o WordPad de Microsoft Windows, UltraEdit, NoteTab,...

Herramientas WYSIWYG

Si bien, existe otra alternativa que es el utilizar herramientas WYSIWYG (Why You See Is What You Get). Estas herramientas nos proporcionaran un interface gráfico para poder montar la página web, ocultándonos el código HTML que se genera por debajo. Si bien, estas herramientas, casi siempre, nos dejarán editar el código HTML generado.

Algunos ejemplos de herramientas:

• CoffeCup HTML Editor
• HoTMetal Pro
• DreamWeaver
• Microsoft Expression

Herramientas On-Line

Ahora está muy de moda el crear la página web desde una herramienta on-line. Es decir, desde una página web. Este tipo de sitios te permiten dos cosas: por un lado crear tu página web de forma gráfica y por otro almacenarla (en muchos casos de forma gratuita) para que la pueda visualizar la gente.

Algunos de estos sitios son:

• Google Page Creator
• Yahoo! Geocities
• Sitios de blogs (WordPress, Blogger,...)

Artículos relacionados

• Traducción al español de la especificación HTML 4.01
• Introducción al HTML de Desarrollo Web

tags:Blogger, CoffeCup HTML Editor, DreamWeaver, editor de texto, Google Page Creator, HotMetal Pro, HTML, Microsoft Expression, navegador, NoteTab, ultraedit, w3c, WordPress, WYSIWYG