Etiquetas H1 de WordPress: Solucionar problemas de jerarquía de encabezados
Publicado el |Por Siteskyline
14 min de lectura
Pasaste horas creando la página perfecta de WordPress. El contenido es sólido. Las palabras clave están colocadas. Tu plugin de SEO muestra una marca de verificación verde.
Pero abre las herramientas de desarrollador de tu navegador e inspecciona la estructura de encabezados, y verás algo que puede matar silenciosamente tu tráfico orgánico: una jerarquía de encabezados rota. Dos H1. Un título del sitio envuelto en `
`. Secciones que saltan de H2 directamente a H4. O peor aún, ningún H1.
Esto no es un error de principiante. Es un problema estructural incorporado en cómo interactúan WordPress, los temas, los creadores de páginas y el editor Gutenberg, y la mayoría de los propietarios de sitios nunca saben que está sucediendo.
Esta guía existe para solucionar eso. Ya sea que seas propietario de un sitio WordPress gestionando tu propio contenido, o una agencia construyendo sitios para docenas de clientes, saldrás de aquí sabiendo exactamente cómo auditar, diagnosticar y resolver permanentemente el problema del orden de encabezados en WordPress.
¿Qué es una etiqueta H1 y por qué es importante en WordPress?
Una etiqueta H1 (`
`) es el elemento de encabezado HTML de nivel superior. En HTML semántico, señala a navegadores, motores de búsqueda y tecnologías de asistencia: “Este es el tema principal de esta página.”
Piensa en las etiquetas de encabezado como un esquema de documento:
H1 – Main page title (only one per page)
├── H2 – First major section
│ ├── H3 – Subsection
│ └── H3 – Another subsection
├── H2 – Second major section
│ ├── H3 – Subsection
│ │ └── H4 – Detail within subsection
└── H2 – Third major section
Salta un nivel — saltando de H2 a H4 — y rompes el esquema. Usa dos H1 y creas ambigüedad estructural. Usa etiquetas H3 para estilo visual e introduces encabezados fantasma que confunden a los rastreadores.
En WordPress específicamente, esto se complica rápidamente. A diferencia de una página HTML estática donde escribes cada etiqueta manualmente, WordPress genera el marcado de encabezados de al menos cuatro fuentes diferentes simultáneamente: la plantilla de encabezado del tema, el título de la entrada, el contenido del editor y cualquier módulo de widget o creador de páginas que hayas añadido.
Lo que Google realmente dice sobre las etiquetas H1
En julio de 2026, Gary Illyes de Google abordó esto directamente durante el podcast SEO Office Hours: organizar los encabezados en orden semántico es genuinamente útil para la accesibilidad (especialmente usuarios de lectores de pantalla), pero no impacta significativamente los algoritmos de clasificación de Google. John Mueller también ha declarado que múltiples etiquetas H1 en una página no confunden a los rastreadores y tienen cero impacto directo en el SEO.
Entonces, ¿importa algo de esto?
Sí — pero no por la razón que dicen la mayoría de las guías de SEO.
Las verdaderas razones para preocuparse por la estructura de encabezados en WordPress son:
Cumplimiento de accesibilidad — El criterio de éxito 1.3.1 de WCAG 2.1 requiere que la información y las relaciones sean determinables programáticamente. Las jerarquías de encabezados rotas fallan en esto.
Rastreabilidad y señales de contenido — Si bien Google puede analizar un marcado desordenado, un H1 limpio da la señal más clara posible sobre el tema de la página, lo que importa en casos ambiguos.
Experiencia de usuario y tiempo de permanencia — Los lectores escanean los encabezados. Una jerarquía lógica les ayuda a navegar y permanecer más tiempo — ambas señales indirectas de clasificación.
Limpieza de auditoría técnica — Para las agencias, los problemas de encabezados aparecen en todas las herramientas de auditoría (Screaming Frog, Ahrefs, SEMrush, Rank Math, Yoast). Los informes orientados al cliente se ven mal incluso si el impacto directo en el ranking se debate.
Cómo genera WordPress las etiquetas de encabezado: Las cuatro fuentes de conflicto
Entendiendo por qué La ruptura de la estructura de encabezados de WordPress requiere entender los cuatro lugares de donde genera los encabezados.
Fuente 1: La plantilla de encabezado del tema
La mayoría de los temas de WordPress muestran el título del sitio en el área del encabezado. Los temas antiguos y mal codificados envuelven esto en una etiqueta
— en cada página. Esto significa que cada página de tu sitio comienza con el mismo H1: el nombre de tu marca.
Luego, cuando se renderiza el título de la página o entrada (que debería ser el H1), se convierte en un segundo H1 o se degrada a H2.
Así es como se ve esto en el header.php:
php
// Broken — site title as H1 on every page
<h1><?php bloginfo('name'); ?></h1>
<h2><?php the_title(); ?></h2> // Post title wrongly demoted
Cómo debería verse:
php
// Correct — site title is a link or span, post title is H1
<p class="site-title"><a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a></p>
<h1><?php the_title(); ?></h1>
Este es uno de los problemas de H1 más comunes en WordPress y es completamente invisible a menos que inspecciones el código fuente de la página. Puedes tener un plugin de SEO, una puntuación de legibilidad verde y contenido perfecto — y aun así estar generando H1 duplicados en cada página.
Fuente 2: El editor de bloques Gutenberg
El editor de bloques de WordPress introdujo cambios deliberados en el comportamiento de H1. Por defecto, Gutenberg desenfatiza la opción H1 en el bloque de encabezado: la suposición es que el título de la entrada ya se está renderizando como H1, por lo que los encabezados del área de contenido deberían comenzar en H2.
En la práctica, esto crea dos problemas:
Problema A: Algunos temas no generan el título de la entrada como H1. Si tu tema renderiza el título en un
o
por razones estilísticas, y Gutenberg ha ocultado H1 de las opciones del bloque de encabezado, terminas con cero etiquetas H1 en la página.
Esta es exactamente la situación señalada en un problema de larga data en el repositorio de Gutenberg en GitHub: usuarios solicitando la capacidad de eliminar la opción H1 por completo para configuraciones empresariales y de agencias donde el H1 se controla a nivel de plantilla. El problema resalta una confusión real: el comportamiento predeterminado del editor y la plantilla del tema deben coordinarse explícitamente, pero WordPress no proporciona ninguna verificación automatizada para esto.
Problema B: Los editores de contenido aún pueden seleccionar H1 en el editor de bloques cambiando el nivel de encabezado. Si tu tema ya genera el título de la entrada como H1, un editor que agregue otro bloque H1 dentro del área de contenido crea un duplicado — y no aparece ninguna advertencia.
Fuente 3: Creadores de páginas (Elementor, Divi, Beaver Builder)
Los creadores de páginas son la fuente más grande de caos en la jerarquía de encabezados en WordPress.
He aquí por qué: los creadores de páginas te dan un control visual granular. Puedes arrastrar un elemento de texto a cualquier lugar, darle estilo de cualquier forma y asignar cualquier nivel de encabezado. Esto es poderoso para el diseño. Es desastroso para la estructura.
El problema típico de encabezados del creador de páginas se ve así:
Sección hero: H1 (correcto) ✔
Título de sección de características: H3 (saltó H2, elegido porque "se ve mejor") ✗
Título del área de widgets: H2 (parece un encabezado de sección, pero es solo un título de widget de barra lateral) ✗
Encabezado de testimonio: H4 (sin H3 arriba) ✗
Encabezado de CTA: H2 (de vuelta a un nivel más alto, ahora el esquema es completamente no lineal) ✗
El resultado es una estructura de encabezados que es visualmente coherente pero semánticamente sin sentido. Los lectores de pantalla y los rastreadores que analizan esto obtienen un esquema de contenido que salta como un índice roto.
La documentación de InspectWP identifica este patrón explícitamente: los autores y usuarios de creadores de páginas eligen niveles de encabezado basados en cómo se ven en lugar de su significado lógico — si H3 es el tamaño visual correcto, seleccionan H3, incluso sin un H2 arriba.
Fuente 4: Widgets y componentes del tema
Las áreas de widgets de WordPress (barras laterales, pies de página, módulos de encabezado) a menudo generan sus propios encabezados. Un widget de 'Entradas recientes' podría representarse como H2. Un banner promocional integrado en el tema podría usar H3. Ninguno de estos forma parte del esquema de contenido, pero aparecen en la estructura de encabezados de la página.
Esto crea 'ruido' de encabezados que infla la complejidad aparente del esquema y puede sacar los encabezados de contenido de su posición jerárquica correcta.
Los 5 problemas más comunes de H1 y jerarquía de encabezados en WordPress
Problema 1: El título del sitio está envuelto en H1 en cada página
Cómo se ve: Cada página de tu sitio tiene dos H1: el nombre de tu sitio y el título de tu entrada.
A quién afecta: Sitios que usan temas antiguos, temas premium mal construidos, o cualquier tema donde el desarrollador usó
Opción 2: CSS + aria-label (solución sin código) Si no puedes editar los archivos del tema, usa CSS para restablecer el estilo H1 en el título del sitio:
Nota: esto oculta el visual problema del H1 pero no soluciona el problema estructural. La etiqueta H1 permanece en el marcado.
Opción 3: Cambiar a un tema bien estructurado Los temas que siguen los estándares de codificación de WordPress (Twenty Twenty-Four, Kadence, GeneratePress, Astra) manejan esto correctamente desde el principio. Si tu tema actual tiene este problema y no eres desarrollador, cambiar suele ser la solución más fiable.
Problema 2: Falta H1 en la página de inicio
Cómo se ve: Tu página de inicio tiene cero etiquetas H1. Los plugins de SEO informan 'No se encontró H1'.
A quién afecta: Sitios que usan una imagen de logotipo para la marca (ocultando el título del sitio), sitios que usan una página principal estática sin título visible, o sitios donde la plantilla de página de inicio del tema no llama the_title().
Este es un problema real y recurrente en los foros de soporte de WordPress. La causa suele ser esta secuencia: el título del sitio está configurado para mostrarse en el encabezado, pero el usuario lo oculta (o lo reemplaza con un logotipo), eliminando el único H1 de la página. Dado que la página de inicio a menudo no tiene un 'título de entrada' como lo tiene una entrada de blog, no se genera ningún H1 automático.
Cómo solucionarlo:
Para la página de inicio específicamente: Añade un H1 a tu sección heroica o plantilla de página. Puede ser:
Un encabezado visible ('Nombre de tu empresa | Categoría de servicio') que también funcione como H1
Un H1 oculto visualmente añadido mediante CSS (position: absolute; clip: rect(0 0 0 0);) que proporciona el marcador semántico sin alterar el diseño visual
En Gutenberg: Añade un bloque de Encabezado en la parte superior del contenido de tu página de inicio, configúralo como H1 y hazlo parte de tu mensaje heroico.
Problema 3: Niveles de encabezado omitidos en el contenido
Cómo se ve: La estructura del contenido salta de H2 directamente a H4, o de H1 directamente a H3.
A quién afecta: Cualquier persona que escriba contenido extenso y use encabezados para el estilo visual en lugar de la estructura semántica.
Por qué es importante: Como señala InspectWP, omitir niveles de encabezado ocurre cuando los autores eligen niveles basándose en la apariencia: el H3 se ve bien, por lo que usan H3, independientemente de si un H2 lo precede.
Cómo detectarlo en Gutenberg: Haz clic en el ícono de información (ⓘ) en la barra de herramientas superior del editor de bloques. El panel Esquema del documento muestra cada encabezado en orden y marca los niveles omitidos con una advertencia.
Cómo solucionarlo:
Audita tu estructura de encabezados usando el Esquema del documento antes de publicar
Establece una guía de estilo de contenido para tu equipo: H2 para secciones principales, H3 para subsecciones, H4 para sub-subsecciones: nunca omitas niveles
Usa el análisis de contenido de Yoast SEO o Rank Math; ambos señalan problemas de estructura de encabezados
Problema 4: Múltiples etiquetas H1 de los creadores de páginas
Cómo se ve: Una página construida con Elementor o Divi tiene tres o cuatro etiquetas H1 porque cada sección principal tiene su propio titular 'H1' estilo heroico.
Cómo solucionarlo:
En Elementor: Edita cada widget de encabezado → verifica la configuración de Etiqueta HTML → configura solo el título de página principal como H1 y cambia todos los demás a H2 o H3 según corresponda.
En Divi: Edita los módulos de encabezado → en Avanzado → Etiqueta HTML → cambia al nivel semántico correcto.
En Beaver Builder: Cada módulo de encabezado tiene una configuración de 'Etiqueta de encabezado' en la pestaña Estilo. Audita cada uno.
Problema 5: El problema de visibilidad del H1 en Gutenberg
Cómo se ve: Tu tema no genera el título de la entrada como H1, y Gutenberg ha ocultado la opción H1 en el bloque de Encabezado. Tus páginas no tienen H1.
Cómo solucionarlo:
Para los desarrolladores que gestionan un sitio donde el H1 debe colocarse dentro del área de contenido, puedes restaurar la opción de H1 usando un filtro en el tema de tu functions.php:
php
// Allow H1 in the Heading block
add_filter( 'allowed_block_types_all', function( $allowed_blocks ) {
return $allowed_blocks;
});
Alternativamente, cambia a la vista “Editar como HTML” para el bloque de encabezado y establece manualmente
en el marcado.
Para configuraciones de agencia donde quieras evitar a los editores de añadir H1 (porque la plantilla lo controla), usa el block_editor_settings_all filtro para restringir los niveles de encabezado en el editor.
Cómo auditar la estructura de encabezados de WordPress (paso a paso)
Método 1: Plugin gratuito SkySEOManager
Usa Plugin SkySEOManager analizador SEO incorporado para encontrar todos los problemas relacionados con los titulares.
Te mostrará todos los problemas con tus etiquetas de titulares.
Jerarquía de H1 en WordPress: La lista de verificación para agencias
Si estás creando o manteniendo sitios de WordPress para clientes, la estructura de encabezados debe ser parte de tu proceso de auditoría previa al lanzamiento y continua. Aquí tienes una lista de verificación repetible:
A nivel del tema:
El título del sitio en el encabezado NO está envuelto en
(usa
, o
)
El título de la entrada/página se muestra como
en o en todos los tipos de contenido
La página de inicio tiene exactamente un
— ya sea del título del sitio o de la sección principal
Las páginas de archivo (categoría, etiqueta, autor) tienen un
descriptivo
La página 404 tiene un
A nivel de contenido:
Cada página tiene exactamente un
en el área de contenido (o cero si el tema lo maneja a través del título)
Las secciones principales usan
Las subsecciones usan
anidado dentro de secciones
No se saltan niveles de encabezado
Los encabezados no se usan solo para estilo visual
A nivel de plugin/constructor:
Los elementos de encabezado de Elementor/Divi/Beaver Builder tienen la configuración correcta de etiquetas HTML
Las áreas de widgets no generan etiquetas H1 o H2 accidentales
Las advertencias de H1 del plugin SEO se resuelven en todas las páginas clave
La jerarquía correcta de encabezados de WordPress — Por tipo de página
Un patrón no se ajusta a todos los tipos de página de WordPress. Aquí está la estructura correcta para cada uno:
Entrada de blog / Página de entrada individual
H1: Post Title (output by theme automatically)
H2: First major section
H3: Subsection
H3: Another subsection
H2: Second major section
H3: Subsection
H4: Detail
H2: Third major section
Página de inicio (página principal estática)
H1: Primary value proposition or page headline
H2: Service category or feature group
H3: Individual service or feature
H2: Testimonials or social proof section
H2: Call to action section
Página de producto de WooCommerce
H1: Product name (output by WooCommerce template)
H2: Product description heading
H2: Reviews
H2: Related products
Página de categoría / archivo
H1: Category name (e.g., "WordPress SEO Articles")
H2: Post title within loop (if posts are displayed with headings)
Errores comunes que rompen la estructura de H1 en WordPress
Error 1: Usar etiquetas de encabezado para dar estilo al texto Si quieres texto grande en negrita que no sea un encabezado de sección, no uses H2. Agrega una clase CSS a un
o
y aplícale estilo visualmente. Usar etiquetas de encabezado por estética contamina tu esquema estructural.
Error 2: Permitir que los editores elijan niveles de encabezado a simple vista Sin una guía de estilo de contenido, los editores gravitarán naturalmente hacia niveles de encabezado que ven correcto. Una breve guía interna — “H2 para secciones, H3 para subsecciones, nunca uses H1 en el contenido” — previene la mayoría de problemas.
Error 3: Instalar un tema de WordPress sin verificar la estructura de encabezados No todos los temas premium de WordPress generan un marcado de encabezado correcto. Antes de comprometerte con un tema, inspecciona una publicación de demostración: ¿el título de la publicación se muestra como H1? ¿El título del sitio evita ser H1 en páginas internas?
Error 4: Asumir que su plugin de SEO cubre todo Yoast y Rank Math revisan la entrada que estás editando. No detectan problemas de encabezado introducidos por la plantilla de encabezado de tu tema, los widgets del pie de página o las plantillas de página de archivo. Sigue siendo necesaria una auditoría manual o un rastreo con Screaming Frog.
Error 5: Arreglar la apariencia visual en lugar de la estructura HTML El "arreglo" más común para el problema del H1 del título del sitio es añadir CSS para que se vea más pequeño. Eso oculta el problema visualmente pero deja el marcado roto en su lugar. Arregla la etiqueta HTML, no solo el estilo.
Siteskyline es una plataforma premium de alojamiento web y gestión de SEO dedicada a proporcionar las mejores herramientas de velocidad, seguridad y optimización.
Utilizamos cookies para garantizar que le ofrecemos la mejor experiencia en nuestro sitio web. Si continúa utilizando este sitio, asumiremos que está satisfecho con él.