Declaración <!DOCTYPE html>: propósito y sintaxis
La declaración <!DOCTYPE html> informa al navegador qué estándar de HTML debe emplear para interpretar la página. No es una etiqueta HTML, sino una instrucción para el procesador de etiquetas. Su sintaxis:
- <!DOCTYPE html>: la forma mínima y única para HTML5.
- Debe colocarse en la primera línea del documento, sin espacios ni caracteres antes.
Ventajas principales:
- Activa el modo estándar en todos los navegadores modernos.
- Mejora la compatibilidad futura, ya que HTML5 unifica y simplifica la declaración.
Modo de compatibilidad en navegadores
Los navegadores manejan dos modos de renderizado:
- Modo estándar (Standards Mode): sigue fielmente las especificaciones de HTML y CSS.
- Modo compatibilidad/quirks: emula comportamientos antiguos para páginas sin doctype o con doctypes mal formados.
Cómo se activa cada uno:
| Declaración | Modo resultante |
|---|---|
<!DOCTYPE html> |
Modo estándar (modern browsers) |
| Sin doctype o mal formado | Modo quirks |
| Doctype antiguo (HTML4 Strict, Transitional, etc.) | Puede activar modo casi-estándar (almost standards mode) o quirks según navegador |
En modo quirks, los navegadores reproducen errores históricos (cálculo de caja, interpretaciones de márgenes, etc.), lo que dificulta el mantenimiento.
Evolución histórica de los Doctypes
La evolución de las declaraciones DOCTYPE refleja la transición de SGML a XML y finalmente a HTML5:
| Versión | Doctype típico | Comentarios |
|---|---|---|
| HTML 2.0 | <!DOCTYPE HTML PUBLIC '-//IETF//DTD HTML 2.0//EN'> |
SGML-based, muy estricto. |
| HTML 3.2 | <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 3.2 Final//EN'> |
Incluye tablas, applets, etc. |
| HTML 4.01 Strict | <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'> |
Desaparece presentational attributes. |
| HTML 4.01 Transitional | <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3.org/TR/html4/loose.dtd'> |
Permite atributos obsoletos. |
| XHTML 1.0 Strict | <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'> |
Basado en XML, case-sensitive. |
| HTML5 | <!DOCTYPE html> |
Sintaxis corta, omni-compatible, sin URL. |
Ejemplos de Doctypes y sus efectos
Cada ejemplo desencadena un modo de renderizado distinto. Obsérvalo en las herramientas de desarrollo:
Ejemplo de HTML5 (modo estándar):
Ejemplo de HTML4.01 Strict (casi-estándar):
Ejemplo de HTML4.01 Transitional (puede disparar quirks en algunos navegadores antiguos):
Sin declaración Doctype (modo quirks):
Buenas prácticas y consejos
- Siempre incluir
<!DOCTYPE html>al inicio del documento. - Evitar doctypes antiguos o mal formados para no caer en quirks.
- Comprobar en múltiples navegadores y usar herramientas de validación W3C.
- Entender que la simplicidad de HTML5 facilita el diseño responsive y la accesibilidad.
Con esta base, garantizas un comportamiento coherente, un desarrollo más limpio y un código preparado para el futuro.
Deja una respuesta
Lo siento, debes estar conectado para publicar un comentario.