1.1 Estructura de una página

Una página HTML es un archivo de texto con extensión .html formado por etiquetas (tags) que se escriben entre < y >. Casi todas se abren y se cierran:

<etiqueta atributo="valor">contenido</etiqueta>

• Elemento: la etiqueta de apertura, su contenido y la de cierre.
• Atributo: información extra dentro de la etiqueta de apertura (href, src, alt, id, class…).
• Algunos elementos no tienen contenido y no se cierran: <br>, <img>, <input>, <hr>.

El esqueleto mínimo

Parte	Para qué sirve
<!DOCTYPE html>	Indica que es HTML5
<html lang="es">	Raíz del documento; lang declara el idioma
<head>	Información sobre la página (no se ve): título, codificación, enlaces a CSS y JS
<meta charset="utf-8">	Para que se vean bien las tildes y la ñ
<title>	El título de la pestaña del navegador
<body>	Todo lo que se ve en la página

Cómo trabajar

Escribe el código en VS Code, guárdalo como index.html y ábrelo en el navegador (doble clic). Tras cada cambio, guarda y pulsa F5 para recargar.

Comentarios y sangría

<!-- Esto es un comentario: el navegador lo ignora -->

Sangra (indenta) los elementos anidados: es más fácil de leer y de depurar.

Los tres archivos de una web

Una web real separa estructura, estilo y comportamiento:

index.html   <- HTML (contenido)
estilos.css  <- CSS (aspecto)
script.js    <- JavaScript (comportamiento)

Se enlazan desde el HTML:

<head>
  <link rel="stylesheet" href="estilos.css">
</head>
<body>
  ...
  <script src="script.js"></script>   <!-- justo antes de cerrar </body> -->
</body>

El <script> va al final del body para que el HTML ya exista cuando el JavaScript lo busque. La alternativa moderna es ponerlo en el <head> con el atributo defer (<script src="script.js" defer></script>): el navegador lo descarga mientras lee el HTML y lo ejecuta cuando la página está lista.