Preguntas frecuentes sobre html/xhtml

La documentación y las aplicaciones de ejemplo de Flask utilizan HTML5. Puedes notar que en muchas situaciones, cuando las etiquetas finales son opcionales no se usan, para que el HTML sea más limpio y más rápido de cargar. Debido a que hay mucha confusión sobre HTML y XHTML entre los desarrolladores, este documento intenta responder a algunas de las principales preguntas.

Historia de XHTML

Durante un tiempo, parecía que el HTML iba a ser sustituido por el XHTML. Sin embargo, apenas hay sitios web en Internet que sean realmente XHTML (que es HTML procesado con reglas XML). Hay un par de razones importantes para que esto sea así. Una de ellas es la falta de soporte de XHTML en Internet Explorer. La especificación XHTML establece que el XHTML debe servirse con el tipo MIME application/xhtml+xml, pero Internet Explorer se niega a leer archivos con ese tipo MIME. Aunque es relativamente fácil configurar los servidores web para que sirvan XHTML correctamente, poca gente lo hace. Esto se debe probablemente a que el uso adecuado de XHTML puede ser bastante doloroso.

Una de las causas más importantes del dolor es el draconiano (estricto y despiadado) manejo de errores de XML. Cuando se encuentra un error de análisis de XML, el navegador debe mostrar al usuario un feo mensaje de error, en lugar de intentar recuperarse del error y mostrar lo que pueda. La mayor parte de la generación de (X)HTML en la web se basa en motores de plantillas no XML (como Jinja, el utilizado en Flask) que no protegen de la creación accidental de XHTML no válido. Hay motores de plantillas basados en XML, como Kid y el popular Genshi, pero a menudo vienen con una mayor sobrecarga de tiempo de ejecución y no son tan sencillos de usar porque tienen que obedecer las reglas XML.

La mayoría de los usuarios, sin embargo, asumían que estaban utilizando correctamente el XHTML. Escribían un doctype XHTML en la parte superior del documento y autocerraban todas las etiquetas necesarias (<br> se convierte en <br/> o <br></br> en XHTML). Sin embargo, incluso si el documento se valida correctamente como XHTML, lo que realmente determina el procesamiento de XHTML/HTML en los navegadores es el tipo MIME, que como se ha dicho antes, a menudo no está configurado correctamente. Así que el XHTML válido estaba siendo tratado como HTML inválido.

XHTML también ha cambiado la forma de utilizar JavaScript. Para trabajar correctamente con XHTML, los programadores tienen que utilizar la interfaz DOM con espacio de nombres con el espacio de nombres XHTML para consultar los elementos HTML.

Historia de HTML5

El desarrollo de la especificación HTML5 se inició en 2004 con el nombre de «Web Applications 1.0» por parte del «Web Hypertext Application Technology Working Group», o WHATWG (formado por los principales proveedores de navegadores, Apple, Mozilla y Opera) con el objetivo de escribir una especificación HTML nueva y mejorada, basada en el comportamiento de los navegadores existentes en lugar de especificaciones poco realistas y retrocompatibles.

Por ejemplo, en HTML4 <title/Hello/ teóricamente se analiza exactamente igual que <title>Hello</title>. Sin embargo, como la gente utilizaba etiquetas similares a las de XHTML, como <link />, los proveedores de navegadores implementaron la sintaxis de XHTML sobre la sintaxis definida por la especificación.

En 2007, la especificación fue adoptada como base de una nueva especificación HTML bajo el paraguas del W3C, conocida como HTML5. En la actualidad, parece que el XHTML está perdiendo tracción, ya que el grupo de trabajo XHTML 2 se ha disuelto y el HTML5 está siendo implementado por todos los principales proveedores de navegadores.

HTML frente a XHTML

La siguiente tabla ofrece un rápido resumen de las características disponibles en HTML 4.01, XHTML 1.1 y HTML5. (No se incluye XHTML 1.0, ya que fue sustituido por XHTML 1.1 y el apenas utilizado XHTML5).

HTML4.01

XHTML1.1

HTML5

<tag/valor/ == <tag>valor</tag>

Sí 1

No

No

<br/> soportado

No

Sí

Sí 2

<script/> soportado

No

Sí

No

debe servirse como text/html

Sí

No 3

Sí

debe servirse como application/xhtml+xml

No

Sí

No

tratamiento estricto de los errores

No

Sí

No

SVG en línea

No

Sí

Sí

MathML en línea

No

Sí

Sí

etiqueta <video>

No

No

Sí

etiqueta <audio>

No

No

Sí

Nuevas etiquetas semánticas como <article>

No

No

Sí

1

Se trata de una oscura característica heredada del SGML. Por lo general, los navegadores no la soportan, por las razones detalladas anteriormente.

2

Esto es para la compatibilidad con el código del servidor que genera XHTML para etiquetas como <br>. No debe utilizarse en código nuevo.

3

XHTML 1.0 es el último estándar XHTML que permite ser servido como text/html por razones de retrocompatibilidad.

¿Qué significa «estricto»?

HTML5 tiene reglas de análisis estrictamente definidas, pero también especifica exactamente cómo debe reaccionar un navegador ante los errores de análisis, a diferencia de XHTML, que simplemente establece que el análisis debe abortarse. Algunas personas se sienten confundidas por una sintaxis aparentemente no válida que sigue generando los resultados esperados (por ejemplo, la falta de etiquetas finales o valores de atributos no citados).

Algunos de ellos funcionan debido al manejo indulgente de errores que la mayoría de los navegadores utilizan cuando encuentran un error de marcado, otros están realmente especificados. Las siguientes construcciones son opcionales en HTML5 por norma, pero tienen que ser soportadas por los navegadores:

  • Envolver el documento en una etiqueta <html>

  • Envolver los elementos de la cabecera en <head>

  • Cerrar las etiquetas <p>, <li>, <dt>, <dd>, <tr>, <td>, <th>, <tbody>, <thead>, o <tfoot>.

  • Citar atributos, siempre que no contengan espacios en blanco o caracteres especiales (como <, >, ', o ").

  • Exigir que los atributos booleanos tengan un valor.

Esto significa que la siguiente página en HTML5 es perfectamente válida:

<!doctype html>
<title>Hello HTML5</title>
<div class=header>
  <h1>Hello HTML5</h1>
  <p class=tagline>HTML5 is awesome
</div>
<ul class=nav>
  <li><a href=/index>Index</a>
  <li><a href=/downloads>Downloads</a>
  <li><a href=/about>About</a>
</ul>
<div class=body>
  <h2>HTML5 is probably the future</h2>
  <p>
    There might be some other things around but in terms of
    browser vendor support, HTML5 is hard to beat.
  <dl>
    <dt>Key 1
    <dd>Value 1
    <dt>Key 2
    <dd>Value 2
  </dl>
</div>

Nuevas tecnologías en HTML5

HTML5 añade muchas características nuevas que hacen que las aplicaciones web sean más fáciles de escribir y utilizar.

  • Las etiquetas <audio> y <video> permiten incrustar audio y vídeo sin necesidad de complicados complementos como QuickTime o Flash.

  • Elementos semánticos como <article>, <header>, <nav> y <time> que facilitan la comprensión del contenido.

  • La etiqueta <canvas>, que soporta una potente API de dibujo, reduciendo la necesidad de imágenes generadas por el servidor para presentar los datos gráficamente.

  • Nuevos tipos de control de formularios como <input type="date"> que permiten a los agentes de usuario facilitar la introducción y validación de valores.

  • APIs avanzadas de JavaScript como Web Storage, Web Workers, Web Sockets, geolocalización y aplicaciones sin conexión.

También se han añadido muchas otras características. Una buena guía de las nuevas características de HTML5 es el libro de Mark Pilgrim, Sumérgete en HTML5. Sin embargo, no todas son compatibles con los navegadores, así que hay que tener cuidado.

¿Qué hay que utilizar?

Actualmente, la respuesta es HTML5. Hay muy pocas razones para utilizar XHTML teniendo en cuenta los últimos avances en los navegadores web. Para resumir las razones expuestas anteriormente:

  • Internet Explorer no soporta bien el XHTML.

  • Muchas bibliotecas de JavaScript tampoco admiten XHTML, debido a la complicada API de espaciado de nombres que requiere.

  • HTML5 añade varias características nuevas, como las etiquetas semánticas y las tan esperadas etiquetas <audio> y <video>.

  • Cuenta con el soporte de la mayoría de los proveedores de navegadores.

  • Es mucho más fácil de escribir y más compacto.

Para la mayoría de las aplicaciones, es sin duda mejor utilizar HTML5 que XTML.