Curso HTML 1.5 Evolución y versiones de HTML (HTML4, XHTML, HTML5)

Evolución y versiones de HTML

1. Antecedentes y necesidades

HTML nació en 1991 con Tim Berners-Lee para estructurar documentos en la web. A medida que crecían las necesidades de presentación y funcionalidad, surgieron nuevas versiones y enfoques.

2. HTML 4.x

Publicada en 1997 por el W3C, HTML 4.0 introdujo:

Separación de contenido y presentación mediante hojas de estilo (CSS).
Soporte para tablas complejas y formularios avanzados.
Múltiples DTD (Strict, Transitional, Frameset).

2.1 Tipos de DTD en HTML 4.01

DTD	Característica
Strict	Sin elementos obsoletos ni presentacionales.
Transitional	Permite etiquetas presentacionales (como `<font>`).
Frameset	Soporta marcos (frames).

2.2 Ejemplo de HTML 4.01 Transitional





  Ejemplo HTML 4.01 Transitional


  
  Texto con estilo en HTML 4

3. XHTML

A finales de los 90, el W3C propuso XHTML para unir HTML y XML. Sus características:

Se basa en sintaxis XML: todas las etiquetas deben cerrarse, atributos con comillas, elementos anidados correctamente.
Múltiples versiones (XHTML 1.0 Strict, Transitional, Frameset; XHTML 1.1).
Requiere servir con el tipo MIME adecuado (application/xhtml+xml) para validar como XML real.

3.1 Reglas de sintaxis en XHTML

Elementos vacíos se cierran: <br />, <img src='...' alt='...' />.
Atributos siempre entre comillas: id='miElemento'.
Minúsculas para nombres de etiquetas y atributos.

3.2 Ejemplo de XHTML 1.0 Strict

Ejemplo XHTML 1.0 Strict

Encabezado en XHTML

Este párrafo cumple las reglas de XHTML. Elemento vacío:

4. HTML5

Publicada en 2014, HTML5 se centra en:

Semántica: etiquetas <header>, <footer>, <article>, <section>, <nav>.
Multimedia nativo: <video>, <audio>, <canvas>.
APIs de plataforma: geolocalización, LocalStorage, Web Workers, Offline, Drag & Drop.
Modelo de parsing tolerante, sin DTD tradicional, con un doctype simplificado.

4.1 Doctype y meta charset en HTML5

4.2 Ejemplo de página HTML5 con elementos semánticos y multimedia




  
  Ejemplo HTML5


  
    Mi Sitio Web
    
      
        Inicio
        Servicios
        Contacto
      
    
  

  
    
      Bienvenida
      Texto introductorio de la página.
    
  

  
    Video y Audio
    
    
  

  
    Canvas
    
    
  

  
    © 2024 Mi Sitio Web

5. Comparativa y recomendaciones

HTML 4.01: aún en uso en sistemas legados, pero con presentacional y DTD complejos.
XHTML: más estricto, útil si se procesa como XML, pero puede generar problemas de compatibilidad.
HTML5: enfoque práctico, alta compatibilidad, elementos semánticos y APIs modernas.

Para proyectos nuevos se recomienda HTML5 por su flexibilidad, facilidad de uso y amplia adopción.