El doctype y su uso en HTML5

doctype en HTML5

¿Qué es el DocType?

Cuando escribimos nuestro documento HTML, lo primero que tenemos que escribir es el doctype. El doctype es la declaración de tipo de documento. En otras palabras, el doctype nos sirve para indicar que nuestro documento está escrito siguiendo la estructura determinada por un DTD concreto.

Sintaxis del DocType

Para explicar la sintáxis utilizaremos el doctype de un documento HTML 4.01 STRICT.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>...</head>
    <body>...</body>
</html>

La primera línea es la declaración de nuestro DOCTYPE y lo podemos dividir en varias partes:

<!DOCTYPE [Elemento de primer nivel] [Disponibilidad] "[+/-]//[Organizacion]//[Tipo] [Nombre]//[Idioma]" "[URL]">
  • DOCTYPE: Indicamos que estamos ante la declaración del DOCTYPE
  • Elemento de primer nivel: Tenemos que escribir el elemento de nivel superior declarado en el DTD. En nuestro caso es html
  • Disponibilidad: Indicamos la disponibilidad del identificador. En nuestro caso tenemos PUBLIC porque se utilizará un identificador público, aunque también existe SYSTEM (cuando se utiliza un identificador de sistema) o URL (cuando el identificador es local o URL).
  • +/- Según la organización se utilizará + o -, en el caso de la W3C se utiliza –
  • Organización: La organización que ha creado el DTD que vamos a utilizar. En nuestro caso es la W3C
  • Tipo: El tipo de documento que estamos incluyendo, o sea, DTD.
  • Nombre: El nombre del DTD. En nuestro ejemplo HTML 4.01
  • Idioma: El idioma en el que está escrito el DTD, normalmente es EN (inglés)
  • URL: La URL del DTD. Si accedemos a http://www.w3.org/TR/html4/strict.dtd nos descargaremos el fichero strict.dtd que podremos abrir con cualquier editor de texto. En él se define la estructura de marcado del documento

La W3C tiene definidos un gran número de DTD, que son resumidos en su listado de declaraciones de doctype

¿Qué es el DTD que utilizamos en el Doctype?

Un DTD es la definición del tipo de documento. Por un lado tenemos el doctype que es la forma de declarar el tipo de documento, en el que hemos puesto la URL para acceder al DTD, o sea, al fichero en el cual se define la estructura del tipo de documento.

Así que, el DTD es dónde se define la estructura que debe tener el documento y utilizamos el doctype para informar qué DTD usamos.

El DTD es muy habitual en los lenguajes de marcado. Cualquiera puede crear un DTD, aunque cuando trabajamos con tecnologías públicas y muy extendidas como es el caso del HTML, XHTML, XML, etc. existen agrupaciones que se dedican a definir los estándares de los lenguajes. Es por eso que existe la W3C y sus diferentes DTD publicados, que utilizamos a modo de estándar tanto los programadores como los encargados de crear los navegadores.

Los “problemas” del doctype

Aunque la teoría nos dice que si creamos un documento (x)HTML utilizando un doctype y lo cumplimos nuestro documento se tendría que ver bien en todos los navegadores, la realidad es muy distinta.

Del mismo modo que nosotros tenemos que encargarnos, al hacer un documento web, de incluir el doctype correcto y escribir nuestro código respetando el DTD escogido; los navegadores web tienen que implementar la interpretación tanto del doctype como de los DTD. A pesar de ello, la realidad es que normalmente no es problema del navegador, sino que es un erro nuestro, ya sea por desconocimiento, por prisas, etc.

Afortunadamente los navegadores modernos han avanzado de forma excepcional en este punto, por eso es muy importante tener siempre la última versión de nuestro navegador favorito… y si no es posible (no puedes tener Internet Explorer 10 en windows XP ni en Vista si mal no recuerdo) lo ideal es cambiar a un navegador que sí nos permita utilizar su última versión en nuestro sistema operativo.

Otro de los problemas del doctype ha sido solucionado con HTML5. Realmente no es un problema del doctype, si no que lo es nuestro… como pasa prácticamente siempre.

La realidad es que la mayoría de las personas que maquetan páginas web no conocen qué es el doctype (si estás leyendo esto, ya no formas parte de ese grupo ;)) o no lo tienen realmente claro… saben que hay una línea de código que hay que pegar antes del la apertura del HTML para que el documento sea válido, pero ni saben qué significa, ni conocen cómo deben escribir el código HTML en función de la línea del doctype que se ha pegado.

Este problema tiene especial importancia cuando se trabajan con CMS, ya que el CMS o el theme usado incluye un doctype por sí mismos y si a la hora de programar/maquetar no conocemos el doctype utilizado es muy probable que cometamos errores. Para evitar este problema, basta con mirar el doctype que se utiliza y procura seguir las indicaciones de su DTD 😉

El doctype en HTML5

HTML5 ha venido para darnos mayor flexibilidad y para llevar al desarrollo web a un nivel impensable antes de HTML5. Además, también ha venido para facilitarnos la vida incluso con las cosas más pequeñas y la declaración del doctype no podría ser una excepción:

<!DOCTYPE html>

Simple, simple y simple. Ni identificador de sistema, ni público, ni URL, ni nada… exquisita sencillez!

Lo importante del doctype en HTML5

9 pensamientos en “El doctype y su uso en HTML5

  1. Realmente buen artículo, me aclaró todas las dudas que tenía al respecto del doctype y que en clase no nos decían, creo que ocurre lo de uno de los errores que algunas personas no saben para que es… Gracias!

  2. Pingback: ¿Estás aprendiendo html? Lo que debes saber sobre DOCTYPE

  3. Pingback: Doctype: resumen sobre el mínimo que debes saber

  4. Pingback: Doctype: resumen sobre lo mínimo que debes saber

Deja un comentario