Encabezados HTML

Los encabezado HTML son títulos o subtítulos que puedes utilizar para mostrar en una página web.

Ejm

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Encabezados HTML

Los encabezados HTML están definidos por las etiquetas <h1> a <h6>. <h1> define el más importante encabezado, mientras que <h6> define el menos importante.

Ejm

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

Nota: Los navegadores agregan automáticamente algunos espacios en blanco (un margen) antes y después de un encabezado.

Los encabezado son importantes

Los motores de búsqueda utilizan los encabezados para indexar la estructura y el contenido de nuestras páginas web. Los usuarios a menudo hojean una página por sus encabezados. Es importante utilizar encabezados para mostrar la estructura del documento.

Los encabezados <h1> deben usarse para los encabezados principales, seguidos de los encabezados <h2>, luego los <h3> menos importantes, y así sucesivamente.

Nota: Usa encabezados HTML solo para encabezados. No uses encabezados para hacer el texto GRANDE o en negrita.

Encabezados más grandes

Cada encabezado HTML tiene un tamaño predeterminado. Sin embargo, puedes especificar el tamaño de cualquier encabezado con el atributo style, utilizando la propiedad CSS font-size.

Ejm

<h1 style="font-size:60px;">Heading 1</h1>

Reglas horizontales HTML

La etiqueta <hr> define un salto temático en una página HTML, y con frecuencia se muestra como una regla horizontal.

El elemento <hr> se usa para separar el contenido (o definir un cambio) en una página HTML.

Ejm

<h1>Esto es una cabecera H1</h1>
<p>Esto es cualquier texto.</p>
<hr>
<h2>Esto es una cabecera H2</h2>
<p>Este es cualquier otro texto.</p>
<hr>

El elemento <head>

El elemento HTML <head> es un contenedor para metadatos. Los metadatos HTML son datos acerca del documento HTML, los cuales no se muestran.

El elemento <head> es colocado entre las etiquetas <html> y <body>.

Ejm

<!DOCTYPE html>
<html>

<head>
  <title>My First HTML</title>
  <meta charset="UTF-8">
</head>

<body>
.
.
.

Nota: Los metadatos generalmente definen el título del documento, el conjunto de caracteres, los estilos, los scripts y otra información meta.

Cómo ver el código fuente HTML

¿Alguna vez has visto una página web y te has preguntado “¡Hola! ¿Cómo hicieron eso?”

Ver código fuente HTML:

Haz clic derecho en una página HTML y selecciona “Ver código fuente de la página” (en Chrome) o “Ver código fuente” (en Edge), o similar en otros navegadores. Esto abrirá una ventana que contiene el código fuente HTML de la página.

Inspeccionar un elemento HTML:

Haz clic derecho en un elemento (o un área en blanco) y elige “Inspeccionar” o “Inspeccionar elemento” para ver de qué elementos están compuestos (verás tanto el HTML como el CSS). También puedes editar el HTML o CSS sobre la marcha en el panel Elementos o Estilos que se abre.

Referencia de etiqueta HTML

Etiqueta Descripción
<html> Define la raíz de un elemento HTML
<body> Define el cuerpo del documento
<head> Un contenedor para todos los elementos del <head> (título, scripts, estilos, meta información…)
<h1> a <h6> Define encabezados HTML
<hr> Define un cambio temático en el contenido.