XHTML 1.0 – Manual de introducción

Terminología utilizada

  • Agente de usuario: es una aplicación que lee y procesa documentos SGML (para nosotros XHTML).
  • Atributo: es un parámetro de un elemento. El tipo y el rango de valores incluyendo el valor por defecto se definen en el DTD.
  • CSS: son las Cascade Style Sheet (hojas de estilo). Contienen información acerca de cómo hay que representar los datos de los documentos.
  • DOM: es el Document Object Model, se trata de una API de acceso a documentos SGML.
  • DTD: es el Document Type Definition, es una colección de declaraciones XML que definen la estructura, elementos y atributos que deben cumplir los documentos conformes al DTD.
  • Elemento: Es la unidad básica definida en el DTD. Son las marcas usadas en los SGML
  • Convalidación: La convalidación es un proceso por el cual los documentos SGML son contrastados con su DTD asociado, asegurándose de que la estructura, el uso de elementos y el uso de atributos son consistentes con las definiciones descritos en el DTD.
  • XML: son las siglas de Lenguaje de Etiquetado Extensible (eXtensible Markup Language). Fue concebido como un medio para recobrar la potencia y flexibilidad de SGML sin que adquiriese su complejidad. A pesar de ser una forma restringida de SGML, XML conserva casi toda la potencia y riqueza de las características de SGML. Aún manteniendo estas características, XML elimina las más complejas de SGML que hacían la creación y diseño de los agentes de usuario apropiados difícil y costosa.

¿Qué es XHTML?

Es una reformulación de HTML 4.0 como una aplicación XML 1.0. Para ello, utiliza las reglas de alguno de los 3 DTDs definidos por el W3C. La compatibilidad con agentes de usuario HTML existentes es posible siguiendo un pequeño conjunto de reglas.

Las ventajas más evidentes que ofrece el migrar a XHTML son:

  • Los documentos XHTML se establecen en base a las reglas XML. Por tanto, pueden ser visualizados, editados y validados por cualquier herramienta estándar XML.
  • Los documentos XHTML pueden escribirse para que funcionen igual o mejor que lo hacían antes tanto en los agentes de usuarios conformes a HTML 4.0 como en los nuevos agentes conformes a XHTML 1.0.
  • Los documentos XHTML pueden contener aplicaciones (por ejemplo applets o scripts) que se basen en DOM y que modifiquen la propia estructura del documento XHTML.
  • Permite insertar en el documento XHTML nuestras propias marcas que no tienen por qué estar definidas en el estándar general. Esto es lo que se llama modularización XHTML.
  • Se estima que para el año 2002 el 75% de los accesos a la Red se harán a través de dispositivos que no son PC’s. XHTML está diseñado para poder ser visualizado en cualquier tipo de plataforma.
  • Hacer las páginas legibles por personas discapacitadas. Al no tener marcas que indiquen forma de representación entremezcladas con el propio contenido, es mucho más facil construir agentes de usuario que lean ese contenido a personas invidentes o lo pasen a otros formatos como Braille.

¿Qué debe cumplir un documento XHTML?

Definido según un DTD
En XHTML 1.0 hay 3 DTDs definidos como estándar:

  1. xhtml1-strict.dtd: Usado cuando queremos utilizar un sistema de marcas realmente limpio y estructurado libre de cualquier marca que especifique forma de representación (<font>, <b>, <u>, …). Está preparado para ser usado junto con las CSS en las que se especifica el tipo de letra, colores, …
  2. xhtml1-transitional.dtd: La idea es tomar la ventaja de las capacidades de XHTML incluyendo las hojas de estilo pero sólo para hacer pequeños ajustes a las marcas para beneficiar a aquellos que tienen navegadores antiguos que no entienden las CSS.
  3. xhtml1-frameset.dtd: Hay que usarlo cuando queramos tener Marcos HTML para particionar la ventana del navegador en uno o más marcos.

El elemento raíz debe ser <html>
El elemento por el que empieza un documento XHTML debe ser <html> y el que finaliza </html>

El elemento raíz debe designar el espacio nominal
Debe designar el espacio nominal a través del atributo xmlns teniendo que ser el valor de éste para XHTML: http://www.w3.org/1999/xhtml

Un pequeño ejemplo de un documento XHTML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sp" lang="sp">
<head>
<title>Biblioteca Virtual</title>
</head>
<body>
<p>Trasladada a <a href="http://vlib.org/">vlib.org</a>.</p>
</body>
</html>

En la línea 01 se define que el documento va a ser de tipo xml versión 1.0 y el tipo de codificación de los caracteres utilizados en dicho documento, en este caso, UTF-8.
En la línea 02 se hace la declaración del DOCTYPE (ver explicación en el siguiente punto).
En la línea 04 se hace referencia al espacio nominal de xhtml y especificamos que el lenguaje es el Español.
El resto de líneas es la definición del documento XHTML de la misma forma que haríamos si fuera HTML.

El espacio nominal XHTML 1.0 puede usarse conjuntamente con otros espacios nominales XML aunque, los documentos así producidos, no serán documentos XHTML 1.0 estrictamente conformes.

El siguiente ejemplo muestra cómo XHTML 1.0 podría usarse junto con con la Recomendación MathML:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sp" lang="sp">
<head>
<title>Un ejemplo matemático</title>
</head>
<body>
<p>Lo que viene a continuación es etiquetado MathML:</p>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<apply> <log/>
<logbase>
<cn> 3 </cn>
</logbase>
<ci> x </ci>
</apply>
</math>
</body>
</html>

En la línea 01 se especifica el espacio nominal de XHTML
En las siguientes líneas utilizamos los elementos habituales de HTML
En la línea 07 indicamos que queremos utilizar el espacio nominal de MathML
Hasta la línea 14 utilizamos los elementos de MathML que, en este caso especifica log3x
Hasta el final volvemos a usar los elementos HTML

Debe existir una declaración <!DOCTYPE>
Debe haber una declaración de DOCTYPE previa a la declaración del elemento raíz. Esta declaración debe referenciar a uno de los 3 DTD’s definidos como estándar:

  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "DTD/xhtml1-frameset.dtd">

El documento debe ser "gramaticalmente correcto"
Un documento gramaticalmente correcto significa que todos los elementos deben tener su marca de cierre y sin solapamiento con otros elementos.

  • BIEN: <p>esto es un párrafo <u>y esto subrayado</u>.</p>
  • MAL: <p>esto es un párrafo <u>y esto en negrita</p>.</u>
  • MAL: <p>esto es un párrafo <u>y esto en negrita</u>. (falta </p>)

Los nombres deben ir en minúsculas
Los nombres de los elementos y de los atributos deben estar en minúsculas. Esto se debe a que XML distingue entre mayúsculas y minúsculas.

  • BIEN: <html><body leftalign="0">hola mundo</body></html>
  • MAL: <HTML><Body LeftaligN="0">hola mundo</Body></HTML>

Todos los elementos deben indicar su cierre
Esto se debe a que en HTML 4.0 se pueden definir elementos que deberían tener su cierre indicado pero que luego no utilizan.


EJEMPLO HTML

EJEMPLO XHTML

<table>
 <tr>
  <td>1
  <td>2
 </tr>
 <tr>
  <td>3
  <td>4
 </tr>
</table>
<table>
 <tr>
  <td>1</td>
  <td>2</td>
 </tr>
 <tr>
  <td>3</td>
  <td>4</td>
 </tr>
</table>

Los valores de los atributos deben ir entrecomillados
Todos los valores de los atributos deben ir entrecomillados, incluso los numéricos.

  • BIEN: <table border="0" align="center">…</table>
  • MAL: <table border=0 align=center>…</table>

No soporte de atributos minimalizados
XHTML no soporta atributos minimalizados que son aquellos que sólo necesitan el nombre del atributo pero sin ningún valor.

EJEMPLO HTML (no soportado): <table><tr><td align=center nowrap>…</td></tr></table>

Los elementos vacíos deben tener su cierre
Un elemento vacío es aquél que no tiene principio o fin, sino que declara un elemento en el metalenguaje para el cual está definido.

  • EJEMPLO HTML: <br> (Salto de línea)
  • EJEMPLO XHTML: <br />

Incompatibilidades entre elementos
Existen ciertas incompatibilidades en el anidamiento de elementos. Esta prohibición se aplica a todas las profundidades de anidamiento.

  • a: no puede contener otros elementos a.
  • pre: no puede contener los elementos img, object, big, small, sub o sup.
  • button: no puede contener los elementos input, select, textarea, label, button, form, fieldset, iframe o isindex.
  • label: no puede contener otros elementos label.
  • form: no puede contener otros elementos form.

Requisitos de conformidad para Agentes de Usuario

Los agentes de usuario deben cumplir una serie de reglas para representar documentos XHTML de forma correcta.

Ver si el XHTML es gramaticalmente correcto
El agente de usuario debe analizar y evaluar si un documento XHTML es gramaticalmente correcto. Es decir, si cumple con todas las reglas definidas anteriormente. En principio, y tal y como se está definiendo el estándar, si no es gramaticalmente correcto el documento no se representa.

Reconocer el atributo "id"
Cuando un agente de usuario procesa un documento XHTML como XML genérico, tan sólo debería reconocer atributos del tipo "id".

Presentar el contenido de elementos no reconocidos
Si un agente de usuario encuentra un elemento que no reconoce, debe presentar el contenido de dicho elemento.

Ignorar atributos no reconocidos
Si un agente de usuario encuentra un atributo que no reconoce, debe ignorar completamente la directriz que marque el atributo, es decir, el atributo y su valor.

Manejar valores desconocidos de atributos
Si un agente de usuario encuentra un valor de un atributo que no reconoce, debe usar en su lugar el valor por defecto de dicho atributo (que se encuentra definido en el DTD).

Asignar ciertos valores como espacios en blanco
Los siguientes caracteres se definen en XHTML como caracteres de espacios en blanco:

  • Espacio (&#x0020;)
  • Tabulación (&#x0009;)
  • Retorno de carro (&#x000D;)
  • Avance de línea (&#x000A;)

Modularización de XHTML

Modularizar XHTML
A la vez que el uso de XHTML vaya pasando de los agentes de usuario del ordenador de sobremesa tradicional a otras plataformas, está claro que no todos los elementos de XHTML serán necesarios en todas las plataformas. Por ejemplo un PDA o un teléfono móvil pueden soportar sólo un subconjunto elementos de XHTML.

El proceso de modularización rompe XHTML en una serie de pequeños conjuntos de elementos. Dichos elementos pueden ser recombinados para cumplir las necesidades de diferentes comunidades. Estos módulos se definirán en un documento posterior de la W3C.

XHTML es más que una simple reformulación de HTML para ajustarse a XML. Posee además una arquitectura extensible que permite la definición de nuevos tipos de documentos. El W3C prevé que los desarrolladores, los autores de documentos y los proveedores de contenidos utilizarán esta arquitectura para definir nuevos tipos de documentos que se ajusten a sus necesidades. La Modularización de XHTML hace la definición de estos nuevos tipos de documentos relativamente sencilla.

Subconjuntos y extensibilidad
La modularización conlleva diversas ventajas:

  • Provee un mecanismo formal para acotar XHTML.
  • Provee un mecanismo formal para extender XHTML.
  • Simplifica la transformación entre tipos de documento.
  • Promueve la reutilización de módulos en nuevos tipos de documento.

Perfiles de documento
Un perfil de documento especifica la sintaxis y la semántica de un conjunto de documentos. La conformidad con un perfil de documento provee una base para la garantía de interoperabilidad. El perfil de documento especifica los recursos necesarios para procesar los documentos de dicho tipo, es decir, qué formatos de imagen pueden usarse, niveles de escritura de código, soporte de hojas de estilo, etc.

Para diseñadores de productos, esto permite a distintos grupos la definición de su propio perfil estándar. Para los autores, esto permitirá obviar la necesidad de escribir diferentes versiones de documentos para diferentes clientes.

Para grupos especiales tales como químicos, médicos o matemáticos esto permitirá la construcción de un perfil especial usando elementos HTML estándar más un grupo de elementos específicamente diseñados para cubrir las necesidades de los especialistas.

XForms

Los formularios se introdujeron en la especificación HTML en 1993. Desde entonces han venido siendo una parte fundamental de la web. Ahora ya han quedado obsoletos y las necesidades han crecido, además, ahora hay que poder conectar esos formularios con nuevas fuentes de datos.

Objetivos

  • Soporte de navegadores para PDA, televisores y PCs de sobremesa además de impresoras y de escáners.
  • Interfaz de usuario más enriquecida para cubrir las necesidades de negocios, de consumo y de aplicaciones de control de dispositivos.
  • Desacoplamiento de los datos en dos niveles: lógico y representación.
  • Mejorar la internacionalización.
  • Soporte para formularios de datos estructurados.
  • Múltiples formularios por página y páginas por formulario.
  • Capacidad de realizar Suspend y Resume.

¿Cómo funcionan?
Los formularios se dividen en 3 capas:

  • Interfaz de usuario: permite la independencia del navegador que estemos utilizando, ya sea un PDA, un PC de sobremesa, …
  • Lógica de proceso: permite la definición de dependencias entre campos, por ejemplo, para ejecutar totales, no dejar rellenar un campo sin haber rellenado otro previamente. Además permite especificar máscaras para los campos del formulario: fechas, monedas, DNI, …
  • Modelo de datos: permite especificar, si por ejemplo tenemos un formulario de pedidos, que tendremos datos pertenecientes al pedido y uno o varios detalles de pedido que tendrán sus propios datos.

Como resultado, el formulario envía al servidor un documento XML con los datos que han sido rellenados o, en su defecto, con los valores definidos por defecto en su DTD.

WebGrafía

URL Descripción
http://www.w3.org/ Página principal del W3 Consortium
http://www.w3.org/TR/xhtml1 Recomendación XHTML
http://www.w3.org/TR/xhtml-modularization Modularización de XHTML
http://www.w3.org/TR/xhtml-building Cómo construir módulos XHTML
http://www.w3.org/TR/xhtml-forms-req Requerimientos de XForms
http://www.w3.org/TR/REC-DOM-Level-1 Recomendación DOM
http://www.w3.org/TR/REC-xml Recomendación XML
http://www.w3.org/TR/html401 Recomendación HTML 4.01
http://www.w3.org/MarkUp/Forms/Sample/acme.html Ejemplo de XForms (funciona en IE4+)
http://www.w3.org/People/Raggett/tidy Convierte páginas HTML a XHML 1.0

Download


Archivo Tamaño Descripción
xhtml-doc.zip 30Kb Formato DOC de este manual
xhtml-ppt.zip 11Kb Presentación de este manual en transparencias

Copyright

Copyright © 2000-2001 José Miguel Sanz. Todos los derechos reservados.
Los nombres de productos y/o marcas enunciados en esta web pueden
ser marcas comerciales o marcas comerciales registradas de sus
propietarios respectivos.

Deja un comentario