XHTML - Sintaxis
La sintaxis XHTML es muy similar a la sintaxis HTML y casi todos los elementos HTML válidos son válidos también en XHTML. Pero cuando escribe un documento XHTML, debe prestar un poco más de atención para que su documento HTML sea compatible con XHTML.
Estos son los puntos importantes que debe recordar al escribir un nuevo documento XHTML o convertir un documento HTML existente en un documento XHTML:
Escriba una declaración DOCTYPE al comienzo del documento XHTML.
Escriba todas las etiquetas y atributos XHTML solo en minúsculas.
Cierre todas las etiquetas XHTML correctamente.
Anida todas las etiquetas correctamente.
Cite todos los valores de los atributos.
Prohibir la minimización de atributos.
Reemplace la name atributo con el id atributo.
Dejar de lado el language atributo de la etiqueta de script.
Aquí está la explicación detallada de las reglas XHTML anteriores:
Declaración DOCTYPE
Todos los documentos XHTML deben tener una declaración DOCTYPE al principio. Hay tres tipos de declaraciones DOCTYPE, que se describen en detalle en el capítulo XHTML Doctypes. Aquí hay un ejemplo de uso de DOCTYPE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Sensibilidad a mayúsculas y minúsculas
XHTML es un lenguaje de marcado que distingue entre mayúsculas y minúsculas. Todas las etiquetas y atributos XHTML deben escribirse solo en minúsculas.
<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>
<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>En el ejemplo, Href y etiqueta de anclaje A no están en minúsculas, por lo que es incorrecto.
Cerrar las etiquetas
Todas y cada una de las etiquetas XHTML deben tener una etiqueta de cierre equivalente, incluso los elementos vacíos también deben tener etiquetas de cierre. Aquí hay un ejemplo que muestra formas válidas e inválidas de usar etiquetas:
<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.
<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >La siguiente sintaxis muestra la forma correcta de escribir las etiquetas anteriores en XHTML. La diferencia es que, aquí hemos cerrado ambas etiquetas correctamente.
<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>
<!-- This is also valid now -->
<img src="/images/xhtml.gif" />Cotizaciones de atributos
Se deben citar todos los valores de los atributos XHTML. De lo contrario, su documento XHTML se asume como un documento no válido. Aquí está el ejemplo que muestra la sintaxis:
<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />
<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />Minimización de atributos
XHTML no permite la minimización de atributos. Significa que debe indicar explícitamente el atributo y su valor. El siguiente ejemplo muestra la diferencia:
<!-- This is invalid in XHTML -->
<option selected>
<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">Aquí hay una lista de los atributos minimizados en HTML y la forma en que necesita escribirlos en XHTML:
| Estilo HTML | Estilo XHTML |
|---|---|
| compacto | compacto = "compacto" |
| comprobado | comprobado = "comprobado" |
| declarar | declare = "declare" |
| solo lectura | readonly = "readonly" |
| discapacitado | disabled = "discapacitado" |
| seleccionado | selected = "seleccionado" |
| aplazar | aplazar = "aplazar" |
| ismap | ismap = "ismap" |
| nohref | nohref = "nohref" |
| sin sombra | noshade = "noshade" |
| Nowrap | nowrap = "nowrap" |
| múltiple | multiple = "multiple" |
| no redimensionar | noresize = "noresize" |
El atributo id
El atributo id reemplaza al atributo de nombre. En lugar de usar name = "name", XHTML prefiere usar id = "id". El siguiente ejemplo muestra cómo:
<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />
<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />El atributo del idioma
El atributo de idioma de la etiqueta de secuencia de comandos está obsoleto. El siguiente ejemplo muestra esta diferencia:
<!-- This is invalid in XHTML -->
<script language="JavaScript" type="text/JavaScript">
document.write("Hello XHTML!");
</script>
<!-- Correct XHTML way of writing this is as follows -->
<script type="text/JavaScript">
document.write("Hello XHTML!");
</script>Etiquetas anidadas
Debe anidar todas las etiquetas XHTML correctamente. De lo contrario, su documento se asume como un documento XHTML incorrecto. El siguiente ejemplo muestra la sintaxis:
<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>
<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>Prohibiciones de elementos
Los siguientes elementos no pueden tener ningún otro elemento dentro de ellos. Esta prohibición se aplica a todas las profundidades de anidación. Significa, incluye todos los elementos descendentes.
| Elemento | Prohibición |
|---|---|
| <a> | No debe contener otros elementos <a>. |
| <pre> | No debe contener los elementos <img>, <object>, <big>, <small>, <sub> o <sup>. |
| <botón> | No debe contener los elementos <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> o <isindex>. |
| <etiqueta> | No debe contener otros elementos <label>. |
| <formulario> | No debe contener otros elementos <form>. |
Un documento XHTML mínimo
El siguiente ejemplo le muestra un contenido mínimo de un documento XHTML 1.0 -
<?xml version="1.0" encoding="UTF-8"?>
<!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/TR/xhtml1" xml:lang="en" lang="en">
<head>
<title>Every document must have a title</title>
</head>
<body>
...your content goes here...
</body>
</html>