Introducción a HTML5

Ejemplos de HTML5 en cada capítulo

Ejemplo

<!DOCTYPE html>
<html>
<body>
<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 Tu navegador no admite la etiqueta de video.
</video>
</body>
</html>

Prueba tú mismo

Haz clic en "Prueba tú mismo" para ver cómo se ejecuta este ejemplo.

¿Qué es HTML5?

HTML5 es el estándar más reciente de HTML.

HTML5 está diseñado específicamente para albergar contenido web rico y sin necesidad de complementos adicionales.

HTML5 tiene nuevos elementos semánticos, gráficos y de multimedia.

Los nuevos elementos y las nuevas API que ofrece HTML5 simplifican la construcción de aplicaciones web.

HTML5 es multiplataforma y está diseñado para ejecutarse en diferentes tipos de hardware (PC, tabletas, teléfonos, televisores, etc.).

Nota:En los siguientes capítulos, aprenderás cómo ayudar a los navegadores de versiones antiguas a manejar HTML5.

¿Qué hay de nuevo en HTML5?

La declaración nueva del tipo de documento (DOCTYPE) de HTML5 es muy simple:

<!DOCTYPE html>
La declaración nueva de la codificación de caracteres (charset) es también muy simple:
<meta charset="UTF-8">

Ejemplo de HTML5:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Título del documento</title>
</head>
<body>
Contenido del documento......
</body>
</html>

Nota:El código de caracteres predeterminado de HTML5 es UTF-8.

HTML5 - Nueva gramática de atributos

HTML5 estándar permite 4 diferentes gramáticas de atributos.

Este ejemplo muestra diferentes sintaxis utilizadas en la etiqueta <input>:

Tipo Ejemplo
Vacío <input type="text" value="Bill Gates" disabled>
Sin cita <input type="text" value=Bill Gates>
Cita doble <input type="text" value="Bill Gates">
Cita simple <input type="text" value='Bill Gates'>

En el estándar HTML5, según la necesidad de las propiedades, se pueden usar todos los 4 tipos de sintaxis.

Nuevas características de HTML5

Algunas de las características más interesantes de HTML5:

  • Nuevos elementos semánticos, como <header>, <footer>, <article> y <section>.
  • Nuevos controles de formulario, como números, fechas, horas, calendarios y deslizadores.
  • Soporte de imágenes potente (mediante <canvas> y <svg>)
  • Soporte multimedia potente (mediante <video> y <audio>)
  • Nuevas API potentes, como el almacenamiento local en lugar de cookies.

Elementos Eliminados de HTML5

Los siguientes elementos de HTML 4.01 han sido eliminados de HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>