Via del.icio.us descubro esta imágen que transmite de una forma muy acertada todo lo que un buen documento HTML debe contener.

Me gustaría transcribir y traducir este interesante recurso a continuación para todos vosotros:

Doctype declarado correctamente

Parece un galimatías, pero los DOCTYPE son importantes. No sólo hace que tu código sea válido, sinó que dicen a tu navegador detalles de cómo debe renderizar tu página.

Encabezado ordenado

Que conste de título, conjunto de caracteres, enlace a hojas de estilo (incluida la de impresión!) y scripts (enlazados, que NO incluidos).
Los archivos externos (CSS o JavaScript) en carpetas propias (css/ y script/ por ejemplo).

ID para Body

El ponerle una id a la etiqueta body te permite crear propiedades CSS específicas para una página en concreto. Por ejemplo diferenciar los h2 del homepage, con un código similar a #home h2 {}, y así no afectar a ningún otro h2.

Div principal para todo el contenido de la página

El poner un div que contenga todo el contenido nos permite mantener el control del diseño sobre la página en su conjunto. Por ejemplo podemos determinar un ancho fijo de toda la página.

Menú limpio semánticamente

Un menú debe tener este aspecto:

Incluir el contenido repetido

Mucho contenido es común entre página y página. Menús, barras laterales, piés de página, etc. Este tipo de contenido debería ser incluido dinámicamente. Esto puede conseguirse con una simple instrucción de PHP.

Contenido importante primero

Es apropiado que incluyas tus contenidos más importantes al principio, como noticias, eventos, que pueden ser listadas al principio del HTML. Si tu barra lateral es sólo para navegación o cosas menos relevantes incluso, deberías ponerla al final del HTML.

Código tabulado

Si cada sección de código se presenta tabulada como un conjunto, la estructura del código queda mucho más comprensible. Cuando un código está completamente alineado a la izquierda es prácticamente imposible de comprender.

Sin estilo!

Tu HTML debe estar completamente orientado a la estructura y al contenido, no al estilo! Deja que el CSS se encargue de todo lo relacionado con el estilo, y por supuesto olvida la etiqueta font

Contenido, contenido, contenido

Aquí has de insertar todo tu contenido, así que manos a la obra. No olvides separar los distintos párrafos con la etiqueta p. Utiliza listas dónde sea apropiado. Utiliza códigos para los símbolos (& copy; & iacute; etc). No abuses de los hr para el salto de línea.

Etiquetas de cierre

Empezaste con fuerza, ahora acaba con fuerza. No seas perezos@ y cierra todas las etiquetas que lo requieran, incluso si la página se renderiza bien sin ellas!