HTML Básico

Inicio / Tema / HTML Básico / Encabezado en HTML y Metadatos

Encabezado en HTML y Metadatos

La Sección `<head>`

La sección <head> de un documento HTML contiene información sobre la página que no se muestra directamente en el contenido visual, pero que es fundamental para el funcionamiento y el posicionamiento en buscadores. Aquí se incluyen elementos como el título, los metadatos y los enlaces a recursos externos.

html

"Este ejemplo de encabezado incluye un título. Aunque el contenido del head no se muestra en la página, el título sí aparece en la pestaña del navegador."

Etiquetas Meta (`<meta>`)

Las etiquetas <meta> proporcionan metadatos sobre la página, como el conjunto de caracteres y la descripción de la página. Son esenciales para la accesibilidad y optimización en motores de búsqueda.

html

"Este código usa dos metaetiquetas. La primera especifica el conjunto de caracteres como UTF-8, y la segunda añade una descripción para optimización en buscadores."

Etiqueta de Título (`<title>`)

La etiqueta <title> establece el título que aparece en la pestaña del navegador y se usa por motores de búsqueda para identificar la página. Cada documento HTML debe tener un solo título.

html

"La etiqueta title contiene el texto que se mostrará en la pestaña del navegador. En este caso, se muestra como Página de Ejemplo."

Enlace a Recursos Externos (CSS, JavaScript)

Podemos enlazar hojas de estilo y scripts externos dentro de la sección <head>. Esto nos permite agregar estilos y funcionalidades a nuestra página HTML.

html

"Aquí enlazamos una hoja de estilos CSS con el atributo link y un archivo JavaScript con la etiqueta script. El atributo defer asegura que el script se ejecute después de que el HTML se cargue."

Favicon

El favicon es el pequeño icono que aparece en la pestaña del navegador junto al título de la página. Añadir un favicon ayuda a mejorar la identidad de tu sitio web.

html

"Para añadir un favicon, usamos la etiqueta link con rel igual a icon, apuntando a un archivo de imagen pequeño. Este icono aparecerá en la pestaña del navegador."

Cierre del Capítulo

Ahora tienes una comprensión básica de la estructura de la sección <head> y de cómo los metadatos contribuyen al funcionamiento y visibilidad de una página HTML. En el próximo capítulo, exploraremos la importancia de las etiquetas semánticas y cómo ayudan a mejorar la accesibilidad y la estructura del contenido.

Volver al capítulo anterior

Marcar como leìdo y continuar

Pregúntame lo que sea