2.5. Sintaxis de las etiquetas XHTML

El lenguaje HTML original era muy permisivo en su sintaxis, por lo que era posible escribir sus etiquetas y atributos de muchas formas diferentes. Las etiquetas por ejemplo podían escribirse en mayúsculas, en minúsculas e incluso combinando mayúsculas y minúsculas. El valor de los atributos de las etiquetas se podían indicar con y sin comillas ("). Además, el orden en el que se abrían y cerraban las etiquetas no era importante.

La flexibilidad de HTML puede parecer un aspecto positivo, pero el resultado final son páginas con un código HTML desordenado, difícil de mantener y muy poco profesional. Afortunadamente, XHTML soluciona estos problemas añadiendo ciertas normas en la forma de escribir las etiquetas y atributos.

A continuación se muestran las cinco restricciones básicas que introduce XHTML respecto a HTML en la sintaxis de sus etiquetas:

1) Las etiquetas se tienen que cerrar de acuerdo a como se abren:

Ejemplo correcto en XHTML:

<p>Este es un párrafo con <a>un enlace</a></p>

Ejemplo incorrecto en XHTML (pero correcto en HTML):

<p>Este es un párrafo con <a>un enlace</p></a>

2) Los nombres de las etiquetas y atributos siempre se escriben en minúsculas:

Ejemplo correcto en XHTML:

<p>Este es un párrafo con <a href="http://www.google.com">un enlace</a></p>

Ejemplo incorrecto en XHTML (pero correcto en HTML):

<P>Este es un párrafo con <A HREF="http://www.google.com">un enlace</A></P>

3) El valor de los atributos siempre se encierra con comillas:

Ejemplo correcto en XHTML:

<p>Este es un párrafo con <a href="http://www.google.com">un enlace</a></p>

Ejemplo incorrecto en XHTML (pero correcto en HTML):

<p>Este es un párrafo con <a href=http://www.google.com>un enlace</a></p>

4) Los atributos no se pueden comprimir:

Ejemplo correcto en XHTML:

<dl compact="compact">...</dl>

Ejemplo incorrecto en XHTML (pero correcto en HTML):

<dl compact>...</dl>

Este tipo de atributos en los que el nombre coincide con su valor no son muy habituales.

5) Todas las etiquetas deben cerrarse siempre:

La mayoría de etiquetas HTML encierran un contenido de texto entre la etiqueta de apertura y la etiqueta de cierre. Sin embargo, algunas etiquetas especiales llamadas "etiquetas vacías" no necesitan encerrar ningún texto.

La etiqueta <br> por ejemplo, se utiliza para indicar el comienzo de una nueva línea, tal y como se verá más adelante. Por sus características, la etiqueta <br> nunca encierra ningún contenido de texto.

Como el estándar XHTML obliga a cerrar todas las etiquetas abiertas, siempre que se incluya la etiqueta <br> se debería cerrar de forma seguida: <br></br>. Para que el código resulte más cómodo de escribir, XHTML permite en estos casos escribir de forma abreviada una etiqueta que se abre y se cierra de forma consecutiva.

En lugar de abrir y cerrar de forma consecutiva la etiqueta (<br></br>) se puede utilizar la sintaxis <br/> para indicar que es una etiqueta vacía que se abre y se cierra en ese mismo punto. En la forma compacta es habitual equivocarse con la posición del carácter /.

Ejemplo correcto en XHTML:

<br/>

Ejemplo incorrecto en XHTML (pero correcto en HTML):

<br>

Además de estas cinco restricciones básicas, XHTML incluye otros cambios más avanzados respecto a HTML:

1. Antes de acceder al valor de un atributo, se eliminan todos los espacios en blanco que se encuentran antes y después del valor. Además, se eliminan todos los espacios en blanco sobrantes dentro del valor de un atributo. En otras palabras, si en el interior de un atributo se incluyen varios espacios en blanco seguidos, se eliminan todos salvo un único espacio en blanco utilizado para separar las diferentes palabras.
2. Como se explicará más adelante al hablar de la etiqueta <script>, el código JavaScript debe encerrarse entre unas etiquetas especiales (<![CDATA[ y ]]>) para evitar que el navegador interprete de forma errónea caracteres como & y <.
3. Las páginas XHTML deben prescindir del atributo name para identificar de forma única a los elementos. En su lugar, siempre debe utilizarse el atributo id. De hecho, en la versión 1.0 del estándar XHTML, el atributo name se ha declarado obsoleto para las etiquetas a, applet, form, frame, iframe, img y map.