Elementos de Encabezado HTML
Los encabezados HTML (<h1> - <h6>) estructuran el contenido de un documento. Ayudan a organizar el texto lógicamente y a resaltar partes clave como títulos, subtítulos y encabezados de sección.
Apariencia Visual de los Encabezados
El siguiente ejemplo muestra cómo aparecen los elementos de encabezado HTML en diferentes tamaños y estilos. <h1> es el más grande y <h6> el más pequeño.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Jerarquía y Estructura
Los encabezados deben utilizarse en orden jerárquico. <h1> representa el tema principal de la página, mientras que <h2>-<h6> representan subsecciones. Evita saltarte niveles (por ejemplo, <h1> seguido de <h4>), ya que rompe la estructura lógica.
Importancia Semántica
Los encabezados no son solo para el estilo: los motores de búsqueda, lectores de pantalla y otras herramientas los usan para interpretar el contenido. Una jerarquía bien estructurada mejora el SEO.
Ejemplo de Contenido Estructurado
Este ejemplo demuestra una estructura simple de contenido de página web utilizando diferentes niveles de encabezado.
Consejos para Usar Encabezados
- Usa solo un <h1> por página.
- Sigue una jerarquía lógica: no te saltes niveles de encabezado.
- No uses encabezados solo para estilizar: úsalos solo cuando el contenido realmente lo requiera.
- Asegúrate de que cada <h2> tenga al menos un subtítulo o contenido debajo.
Tarea: ¡Crea un encabezado <h1> con el texto 'Main Title'!
<!DOCTYPE html>
<html>
<head>
<title>Headings</title>
</head>
<body>
</body>
</html>Vista previa
Accesibilidad y SEO
El uso bien estructurado de encabezados ayuda no solo a los lectores sino también a la tecnología. Por ejemplo, los lectores de pantalla los usan para crear listas de navegación y los motores de búsqueda prefieren contenido lógicamente estructurado.
Seleccionar idioma
Establecer tema
© 2025 ReadyTools. Todos los derechos reservados.