Vistas las diferencias funcionales entre ambos estándares, describiremos algunas características sintácticas y estructurales que también los diferencian.
Un documento xhtml debe tener una estructura jerárquica en árbol que parte del elemento raíz (html) del que descienden los demás elementos. Estos deben estar anidados y cerrados correctamente.
Hemos repetido esta característica varias veces en distintos contextos por que en la práctica genera muchos errores de validación, en parte debidos a la excesiva flexibilidad a la que nos había acostumbrado html.
Es importante recordar que hacemos documentos basados en xml, con un vocabulario extensible pero una estructura inflexible, y aunque los navegadores nos perdonen un error gramatical, el validador no lo hará. Ya no es suficiente que un documento se muestre bien en los navegadores, ahora también debe ser válido, y por lo tanto bien formado.
Un documento se considera bien formado si se ajusta sintáctica y gramaticalmente a las reglas de xml. Es decir, si sus elementos están correctamente escritos, anidados y cerrados.
Debemos prestar especial atención al orden en que se cierran sus etiquetas, debiendo cerrarse siempre en orden inverso al de apertura, y sin saltarse ninguna de ellas.
Anidación correcta
<a>
<b>
<c> </c>
</b>
</a>
Anidación incorrecta
<a>
<b>
<c> </c>
</a>
</b>
Observando esquemáticamente el body del ejemplo1, distinguimos la disposición jerárquica de los elementos, y el orden correcto en el cierre de las etiquetas.
<body>
<div>
<h1></h1>
<ul>
<li></li>
<li><span></span></li>
<li></li>
</ul>
</div>
</body>