Estructura del documento

<head>: metadatos no visibles

<head> es el primer hijo de <html>. Contiene metadatos: información sobre el documento que no aparece en la página visible.

El único elemento obligatorio dentro de <head> es <title>: el texto que aparece en la pestaña del navegador y en los resultados de búsqueda.

<head>
  <title>Recetas de cocina</title>
</head>

Además del título, en <head> van otros elementos que conviene incluir en todo documento:

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Recetas de cocina</title>
  <link rel="stylesheet" href="estilos.css" />
</head>
  • <meta charset="UTF-8" /> — codificación de caracteres; sin esto las tildes y las eñes pueden romperse. Detalle en CAT-11.
  • <meta name="viewport" content="width=device-width, initial-scale=1.0" /> — configura el ancho para pantallas móviles. Detalle en CAT-11.
  • <link rel="stylesheet" href="estilos.css"> — vincula una hoja de estilos CSS al documento. Detalle en CAT-12.

Lo importante: lo que va en <head> no se muestra en la página. Si ponés texto directamente en <head>, no aparece (o aparece de forma inesperada).


En la siguiente lección vas a ver <body>, donde vive todo el contenido visible.

Sandbox libre — probá lo que aprendiste:

Preview

En la referencia