W3docs

XHTML

XHTML reformuló HTML 4 como XML estricto. Aprende sus reglas, doctypes y xmlns, y por qué HTML5 lo ha reemplazado en gran medida.

XHTML (Extensible HyperText Markup Language) es una reformulación de HTML 4.01 del año 2000 como una aplicación estricta de XML, publicada por el World Wide Web Consortium (W3C). Tiene el mismo vocabulario de etiquetas que HTML, pero aplica las reglas de buena formación de XML: cada etiqueta debe estar cerrada, en minúsculas y correctamente anidada.

Para proyectos nuevos, prefiere HTML5. XHTML 1.0 ha sido superado en gran medida por HTML5, que mantiene la disciplina de buena formación como un estilo políglotico opcional mientras es mucho más flexible y rico en funcionalidades. Esta página es mejor entendida como antecedente de un estándar heredado que aún puedes encontrar en bases de código antiguas.

El objetivo original era hacer los documentos más estrictos y predecibles, de modo que pudieran ser analizados por cualquier procesador XML estándar y reutilizados en una variedad de dispositivos y herramientas. Debido a que las reglas son inflexibles, una sola etiqueta de cierre faltante podía impedir que todo el documento se renderizara cuando se servía como XML real.

Reglas de buena formación

La diferencia fundamental entre HTML y XHTML es que XHTML debe ser XML bien formado. A continuación se presentan las reglas, cada una mostrada como incorrecto vs. correcto.

Estructura del documento y doctype

Cada documento XHTML debe comenzar con un <!DOCTYPE> de XHTML y contener los elementos <html>, <head>, <title> y <body>. El elemento <html> también debe declarar el espacio de nombres XML con el atributo xmlns.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    Content of the page
  </body>
</html>

El atributo xmlns

xmlns="http://www.w3.org/1999/xhtml" es la declaración de espacio de nombres XML. Le indica a un analizador XML que los elementos del documento pertenecen al vocabulario XHTML y no a otro lenguaje XML. Es obligatorio en el elemento raíz <html> de todo documento XHTML. La URL es un identificador, no un enlace que el navegador recupera.

Variantes de doctype de XHTML

XHTML 1.0 define tres DOCTYPEs, cada uno apuntando a un DTD diferente. El ejemplo anterior utiliza Transitional, la opción más común.

  • Strict — marcado limpio, sin presentación. Los elementos y atributos de presentación obsoletos (como font o bgcolor) no están permitidos; el estilo se deja a CSS.
  • Transitional — permite las características de presentación obsoletas para compatibilidad con contenido antiguo.
  • Frameset — como Transitional, pero permite documentos <frameset> que dividen la ventana en marcos.

Cerrar todos los elementos

En HTML algunas etiquetas de cierre pueden omitirse, pero en XHTML cada elemento debe estar cerrado. Los elementos vacíos que no tienen contenido (como br, hr, img) se cierran a sí mismos con una barra inclinada al final.

<!-- Wrong (HTML-style, not closed) -->
A break: <br>
An image: <img src="smile.gif" alt="Always smile">

<!-- Right (self-closed for XHTML) -->
A break: <br />
An image: <img src="smile.gif" alt="Always smile" />

Usar nombres de etiquetas y atributos en minúsculas

XML distingue entre mayúsculas y minúsculas, por lo que <P> y <p> son etiquetas diferentes. XHTML exige que todos los nombres de elementos y atributos estén en minúsculas.

<!-- Wrong -->
<BODY>
  <P>Some paragraph</P>
</BODY>

<!-- Right -->
<body>
  <p>Some paragraph</p>
</body>

Poner entre comillas todos los valores de atributos

Todos los valores de los atributos deben estar entre comillas, incluso los numéricos.

<!-- Wrong -->
<table width=100%>

<!-- Right -->
<table width="100%">

Anidar elementos correctamente

Las etiquetas superpuestas están prohibidas; los elementos internos deben cerrarse antes que su elemento padre externo.

<!-- Wrong (overlapping) -->
<strong><em>This text is bold and italic</strong></em>

<!-- Right (properly nested) -->
<strong><em>This text is bold and italic</em></strong>

Sin minimización de atributos

En HTML, los atributos boolean pueden estar solos (checked). XHTML prohíbe esta forma abreviada: cada atributo necesita un valor, y para los boolean el valor repite el nombre.

<!-- Wrong (minimized) -->
<input type="checkbox" name="flower" value="rose" checked />

<!-- Right -->
<input type="checkbox" name="flower" value="rose" checked="checked" />

Preferir id sobre name

En XHTML el atributo name está obsoleto en elementos como los anclajes, por lo que se recomienda el atributo id para identificar elementos en su lugar.

Ventajas de XHTML

  • Todas las etiquetas deben estar cerradas y correctamente anidadas, lo que mantiene el marcado consistente y más fácil de leer.
  • Al ser XML bien formado, los documentos podían ser procesados de manera fiable por herramientas XML genéricas y transportados a entornos especializados como lectores Braille y otro software de asistencia.
  • Fomenta una separación limpia entre estructura y presentación, trabajando junto a CSS para el estilo.

XHTML vs HTML

Algunas diferencias clave entre los dos:

  • Estándar subyacente. HTML es una aplicación de SGML; XHTML es una aplicación de XML.
  • Linaje. HTML desciende de SGML; XHTML se deriva tanto de XML como de HTML 4.
  • Historia. HTML se originó con Tim Berners-Lee a principios de los años 90 (Wikipedia); XHTML 1.0 se convirtió en una Recomendación del W3C en 2000 (Wikipedia).
  • Análisis sintáctico. HTML utiliza un analizador permisivo y tolerante a errores; XHTML servido como XML requiere un analizador XML estricto que rechaza documentos malformados.

XHTML vs HTML5

  • Distinción de mayúsculas y minúsculas. XHTML distingue entre mayúsculas y minúsculas; HTML5 (como el HTML clásico) no lo hace.
  • Doctype. Los doctypes de XHTML son largos y hacen referencia a un DTD; HTML5 usa el corto <!DOCTYPE html>.
  • Tipo MIME. HTML5 se sirve como text/html; el análisis estricto de XHTML requiere application/xhtml+xml.
  • Tolerancia. HTML5 se recupera con facilidad de muchos errores de marcado, mientras que XHTML los rechaza.
  • Estado. HTML5 es el estándar moderno para todos los dispositivos; XHTML 1.0 se considera ahora un estándar heredado.

Práctica

Práctica
¿Cuáles son algunas características de XHTML (Extensible Hypertext Markup Language)?
¿Cuáles son algunas características de XHTML (Extensible Hypertext Markup Language)?
Práctica
¿Qué atributo debe aparecer en el elemento html raíz de cada documento XHTML para declarar el espacio de nombres XML?
¿Qué atributo debe aparecer en el elemento html raíz de cada documento XHTML para declarar el espacio de nombres XML?
Was this page helpful?