Buscar
Cerrar este cuadro de búsqueda.

La verdad sobre cómo tener un SEO On Page perfecto con múltiples H1 por página

Lua Louro

Lua Louro

Trabajar el SEO on page puede llegar a ser algo mucho más complejo de lo que mucha gente se piensa.

Muchas veces damos por sentado conceptos “on page” de toda la vida y hay ocasiones en que esto puede no ser así. En el post de hoy vas a descubrir el motivo de la mano de este magnífico autor invitado 🙂

Este es un post invitado de Nacho Mascort. Blogger en seohacks.es

Cómo utilizar varios H1 en SEO

Introducción

La verdad es que uno no se plantea tener la posibilidad de escribir en un blog con una audiencia como la de Blogger3cero.

Y cuando te dan la oportunidad es como que te acojonas de aquí a Perú pasando por la casilla de salida sin cobrar.

Para más inri, de todos los temas que le propuse a Dean, va y elige el más polémico. ¡Genial!

Esto puede ser todo un viaje así que pon tu tema favorito a todo trapo, coge palomitas y deja que empiece por el principio.

Soy Nacho Mascort y llevo en esta locura del SEO desde 2014 a nivel profesional. Hace años la presentación habitual habría venido seguida de la cantidad de títulos que hay detrás mío junto a todas las posiciones que he llegado a ocupar.

Pero esto ya no es así. Los únicos indicadores fiables sobre lo que se sabe de una persona son: la pasión y los resultados.

 Pasión  tengo hasta para regalar y sino que se lo digan a mis pobres amigos que me tienen prohibido hablar de SEO de lo pesado que llego a ser.

A  nivel de resultados  te diré que gestiono un total de 7 webs de meganicho, algunas con resultados normalillos, otras con las que logré conseguir mis primeros 400.000 usuarios al mes en unos 6 meses, trabajo en una agencia de marketing online de Barcelona llamada Tesubi, soy profesor del máster de SEO de la UPF y hablo de SEO en SEO Hacks.

Ahora que ya me conoces un poquito, creo que es hora de que te cuente lo que no te acabas de creer al leer el título.

La máxima inquebrantable

“No pondrás más de un h1 por página”
– Moisés

Todos la conocemos.
A todos nos lo han dicho alguna vez.
E incluso la hemos predicado con fervor.
Yo también.

Y déjame decirte que en el fondo no es obligatorio.
No es que vaya a contarte el próximo truco de moda black hat de stuffear h1 a mansalva, para nada.

Lo que te vengo a contar es sobre html5. Sí, simple html.

Porque (alerta de spoiler) html5 permite tener múltiples h1.

Pero Matt Cutts dice…

Lo sé. Yo también he visto los vídeos. Es más, para hacerlo más interesante voy a ponerte uno de ellos aquí.

Te veo en breve.

Sé que ahora mismo estás pensando esto: “Ajá, lo sabía”.

Y es necesario contextualizar, es fundamental.

⅓ de las webs de Internet está formado por WordPress. Lo que significa que ⅔ son webs construidas con otros CMS (unos famosos y otros menos) y webs de programación propia.

Siempre que veas cualquier consejo de Google interprétalo teniendo en cuenta eso ya que es importante.

WordPress solventa la mayoría de problemas SEO que tienen otras webs así que cuando Google hace una llamada se refiere a todas las webs, no solo a WordPress.

Los spammers están a la orden del día, Google toma muchas medidas a la hora de actualizar su algoritmo para limpiar los resultados de búsqueda de este tipo de webs y webmasters.

Esto quiere decir que stuffear tu web con múltiples h1 no te va a funcionar si lo que buscas es alterar los resultados de búsqueda.

En cambio, si tener múltiples h1 tiene sentido para el usuario no hay ningún problema y en algunos casos es mucho mejor para la interpretación de la información.

Si aún sigues escéptico respecto al tema, entonces sigue leyendo que ahora verás un caso en el que es mejor usar múltiples h1, te lo prometo.

Pongámonos un poco técnicos

Tampoco mucho.

Imaginemos que tenemos una web de noticias, o una web de una agencia de marketing online o incluso que somos Dean con blogger3cero.

Sigamos imaginando que tenemos una estructura similar a esta en la home:
SEO On PageSEOSEO On Page

He añadido los tres casos para que veáis que se puede aplicar a diferentes tipos de web.

Las dos primeras son estructuras que nos podemos encontrar en cualquier parte, en el caso de blogger3cero he decidido tomarme alguna licencia de más (en un futuro imagina que tiene la home de esta manera en vez de con los últimos posts.)

Estructura de un solo h1

Si nos pusiéramos a analizar el html de las webs para ver la estructura de headings saldría esto:

Múltiples H1

<!-- Estructuras de un solo h1-->

<!--Web de noticias-->
<body>
	<h1>Web de noticias</h1>

		<h2>Política</h2>
			<h3>Noticia 1</h3>
			<h3>Noticia 2</h3>
			<h3>Noticia 3</h3>

		<h2>Tecnología</h2>
			<h3>Noticia 1</h3>
			<h3>Noticia 2</h3>
			<h3>Noticia 3</h3>

		<h2>Cocina</h2>
			<h3>Noticia 1</h3>
			<h3>Noticia 2</h3>
			<h3>Noticia 3</h3>
</body>

<!--Agencia de Marketing Online-->
<body>
	<h1>Agencia de Marketing Online</h1>

		<h2>Servicios</h2>
			<h3>SEO</h3>
			<h3>SEM</h3>
			<h3>SMO</h3>

		<h2>Blog</h2>
			<h3>Artículo 1</h3>
			<h3>Artículo 2</h3>
			<h3>Artículo 3</h3>
</body>

<!--Blogger3cero-->
<body>
	<h1>Blogger3cero</h1>

		<h2>Adsensei</h2>
			<h3>Artículo 1</h3>
			<h3>Artículo 2</h3>
			
		<h2>Mis plugins</h2>
			<h3>Adsensei B30</h3>

		<h2>Curso SEO</h2>
			<h3>Clase 1</h3>
			<h3>Clase 2</h3>
			<h3>Clase 3</h3>
			
</body>

Las tres estructuras de encabezados están bastante bien organizadas y tienen una jerarquía de la información correcta pero hay un pequeño problema.

 No todo tiene la misma importancia. 

Tal y como está estructurada la información estamos generando el siguiente esquema en los tres casos:

Marca o Nombre genérico
H2 Secciones de cada web
H3 Título de cada elemento de la sección

Pese a ser totalmente correcta hay un serie de problemas.

  • La etiqueta h1 generaliza todo el contenido de la página diluyendo la relevancia.
  • No es posible diferenciar las secciones o los artículos como un elemento independiente.
  • No se puede diferenciar qué sección de la web tiene más importancia ya que todas están unidas por la misma estructura.
  • Cuando hagas clic en un artículo o en una sección y entres en su respectiva página lo más seguro es que pase de ser un h2 – h3 a un h1 de su respectiva página. Esto se aprecia en la mayoría de blogs. En la home, el título está bajo un encabezado de nivel inferior o bajo un div y al entrar en el artículo pasa a ser un h1.
  • Si mi marca saliera en h1 en cada página de mi web estoy condicionado a que el resto de títulos sean encabezados de nivel inferior.

Estructura de múltiples h1 con html 5

Veamos ahora como html5 nos permite arreglar o mejorar todos los problemas que he mencionado anteriormente.

Vamos a ver cómo se vería la estructura de cada uno de los sitios anteriores empleando las etiquetas de html5 que permiten usar múltiples h1 por página.

SEO on page

<!-- Estructuras de múltiples h1-->

<!--Web de noticias-->
<body>
	<header>
		<h1>Web de noticias</h1>
	</header>
	<section>

		<header>
		<h1>Política</h1>
		</header>

			<article>
			<h1>Noticia 1</h1>
			</article>

			<article>
			<h1>Noticia 2</h1>
			</article>

			<article>
			<h1>Noticia 3</h1>
			</article>

	</section>

	<section>

		<header>
		<h1>Tecnología</h1>
		</header>

			<article>
			<h1>Noticia 1</h1>
			</article>

			<article>
			<h1>Noticia 2</h1>
			</article>

			<article>
			<h1>Noticia 3</h1>
			</article>
			
	</section>

	<section>

		<header>
		<h1>Cocina</h1>
		</header>

			<article>
			<h1>Noticia 1</h1>
			</article>

			<article>
			<h1>Noticia 2</h1>
			</article>

			<article>
			<h1>Noticia 3</h1>
			</article>
			
	</section>
</body>

<!--Agencia de Marketing Online-->
<body>
	<header>
		<h1>Agencia de Marketing Online</h1>
	</header>
	<section>

		<header>
		<h1>Servicios</h1>
		</header>

			<article>
			<h1>SEO</h1>
			</article>

			<article>
			<h1>SEM</h1>
			</article>

			<article>
			<h1>SMO</h1>
			</article>

	</section>

	<section>

		<header>
		<h1>Blog</h1>
		</header>

			<article>
			<h1>Artículo 1</h1>
			</article>

			<article>
			<h1>Artículo 2</h1>
			</article>

			<article>
			<h1>Artículo 3</h1>
			</article>
			
	</section>
</body>

<!--Blogger3cero-->
<body>
	<header>
		<h1>Blogger3cero</h1>
	</header>
	<section>

		<header>
		<h1>Adsensei</h1>
		</header>

			<article>
			<h1>Artículo 1</h1>
			</article>

			<article>
			<h1>Artículo 2</h1>
			</article>

	</section>

	<section>

		<header>
		<h1>Mis Plugins</h1>
		</header>

			<article>
			<h1>Adsensei B30</h1>
			</article>

	</section>

	<section>

		<header>
		<h1>Clases SEO</h1>
		</header>

			<article>
			<h1>Clase 1</h1>
			</article>

			<article>
			<h1>Clase 2</h1>
			</article>

			<article>
			<h1>Clase 3</h1>
			</article>
			
	</section>
</body>

Puede parecer un poco abrumador así que no te preocupes que iremos por partes.

Aunque veas mucho más código que en el anterior caso, has de ser consciente que solo he introducido estas etiquetas html: ‹header›, ‹section› y ‹article›.

¿Cómo es posible que esas etiquetas permitan usar múltiples h1?
 Porque son etiquetas que permiten contener secciones dentro de sí mismas. 

Estas etiquetas permiten diferenciar que existen distintas secciones de la web en un mismo documento.

Cabeceras

Nuestra web de noticias tiene una sección de política en la que hay tres noticias y esa sección no tiene nada que ver con la de tecnología, ¿verdad?

En la página de Política, ¿verdad que “Política” es la Top Kw empleada como h1? Pues gracias a estas etiquetas podemos trasladar la estructura de la subpágina a una página superior para que se mantengan los mismos encabezados.

Si no empleáramos estas etiquetas “Política” sería un h1 en webdenoticias.com/politica y en la home sería un h2.

En este caso hemos empleado la home pero lo mismo pasaría en las categorías en sí.

H1 en SEO On Page

¿Verdad que el titular está en H1 en el propio artículo? Pues gracias a estas etiquetas en la sección de política también seguirá siéndolo.

De esta manera “trasladamos” la misma estructura de una página a otra ya que diferenciamos que son secciones diferentes unas de otras.

⭐ Etiqueta ‹header›

Uno de los primeros elementos que debes haber observado al ver el ejemplo de los múltiples h1 es que dentro de cada sección había una etiqueta llamada header que contenía el título de esa sección.

La etiqueta ‹header› es la única de las que te voy a presentar hoy que no permite diferenciar secciones diferentes. Es donde se suele encontrar el encabezado principal de esa sección y también sirve para añadir elementos introductorios o incluso la típica tabla de contenidos que también va genial para el SEO.

Aquí tienes la definición del W3C sobre el ‹header›

“The header element represents introductory content for its nearest ancestor sectioning content or sectioning root element. A header typically contains a group of introductory or navigational aids.”

⭐ Etiqueta ‹section› y ‹article›

El W3C define ‹section› como:

“The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content. Each section should be identified, typically by including a heading (h1-h6 element) as a child of the section element.”

Lo que viene a decir es que podemos usar ‹section› para diferenciar diferentes secciones genéricas de una misma temática.

Como hemos visto en los casos anteriores, lo que he hecho ha sido seleccionar las principales categorías de cada web y emplear esta etiqueta para diferenciarlas una de otra.

La etiqueta ‹article› es definida como:

“The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g., in syndication.”

Ambas son muy parecidas ya que permiten contener en sí mismas otras secciones.

Y estas dos etiquetas no son las únicas que permiten tener múltiples h1, también podríamos usar ‹aside› y ‹nav›.

En el ejemplo he usado ‹article› para poner los artículos de cada una de las webs. Y eso tiene un cierto motivo que ahora te contaré, no es porque artículo y article se parezcan.

Una de las preguntas que te puedes estar preguntando es cuándo es más correcto usar ‹article› o ‹section› ya que las dos etiquetas hacen prácticamente lo mismo.

Volviendo a citar al W3C:

“A section forms part of something else. An article is its own thing.”

Es decir, ‹section› sirve para diferenciar apartados que forman parte de algo más y ‹article› muere en sí mismo.

Lo entiendo de la siguiente manera:

Una categoría es algo dinámico en el que se van añadiendo contenidos y otros elementos, es el conjunto de un todo. En cambio, un artículo solo es un artículo y ya está, puede ser actualizado pero no tiene otros elementos dinámicos.

De ahí que haya usado ‹section› para las categorías y ‹article› para los posts. Si bien es verdad, en el segundo ejemplo he diferenciado los servicios con ‹article›, y eso es porque no hay una norma estricta sobre el uso de estas etiquetas.

También tengo que decirte que en el fondo depende de ti y de la estructura de la información de tu sitio web.

Aparte de las etiquetas que te he comentado hay muchas otras que permiten mejorar tu SEO On Page, si estás interesado en saber que permiten hacer te dejo aquí las aplicaciones prácticas de cada una.

Veamos un caso práctico que lo haya aplicado

Esta muy bien toda esta teoría pero, ¿de verdad se usa?

La respuesta es: Sí.

Es dificil que lo veas aplicado en un WordPress porque la mayoría de plantillas vienen con la típica estructura de un solo h1.

El ejemplo que te quiero enseñar es la web de uno de los grandes medios de comunicación de España: La Vanguardia.

No era casualidad que el primer ejemplo de web fuera una de noticias.

Quiero que hagamos un simple ejercicio.

Lo que quiero que hagas es que entres en la web, haz clic con el botón derecho del ratón y pulsa en “ver código fuente”.

Una vez veas todo el código quiero que hagas una búsqueda del número de headings 1 que aparecen.

  • Con Windows: Ctrl + F
  • Con Mac: Cmd + F

H1

¿Qué? ¿154?
En realidad 77 porque hay uno de apertura y otro de cierre pero sí, 77 encabezados h1.

Eso es porque La Vanguardia emplea las etiquetas citadas anteriormente. La estructura que emplea la home es muy parecida a la del primer ejemplo. La home contiene las categorías principales en secciones diferentes y estas a su vez contienen artículos.

Entonces, ¿cuál he de usar?

Depende.

Esa es la verdad, depende de varios factores. Factor técnico, recursos, tiempo, interés… Como todo, esto no es la panacea, ni mucho menos.

Cada una de las mejoras que puedas aplicar a nivel on page sumará un pequeño porcentaje en tu Panda score.

Lo que siempre debes recordar es que “El todo es más que la suma de las partes”.

Recursos

Nacho Mascort

Suscríbete al Blog

Cada vez que publique un artículo o contenido chulo de SEO te avisaré por email

Lua Louro

Lua Louro

  • Bruno Ramos dice:

    Jojojo qué ganas tenía de leer esto en B30.
    Totalmente de acuerdo con Nacho, varios h1 es posible y más que recomendable para tener una arquitectura web SEO on page friendly a más no poder.
    Tengo un nicho en el que funciona a las mil maravillas, sobre todo en las categorías, donde el h1 del header cambia a h2 y el de la categoría pasa a h1, haciendo más relevante el listado de post.
    Bravo!

    • Nacho Mascort dice:

      Hola Bruno!

      Muchas gracias por tu comentario 😀

      Muy buena el cambio de headers en función de la relevancia que le quieras dar a la página.

      Vi algo similar con submenús y funcionaba bastante bien.

      Un saludo

    • Dean Romero dice:

      ¡Toma ya!

      Primera fiera aportando su opinión sobre el asunto,

      Para mi lo que dice Bruno va a misa, para los que no le conozcáis es un webmaster con mogollón de páginas super SEO optimizadas y bien rankeadas dando pasta con Adsense,

      Mago, un placer tenerte por aquí siempre

  • Chris dice:

    Muy bueno, incluso mejor que cuando me lo contaste por primera vez y eso que ya me sorprendió!

    • Nacho Mascort dice:

      Hombre Chris!

      muchísimas gracias por tu comentario 🙂

      La verdad es que html5 es muy potente y no solo se puede usar para los headings…

      Jojojo hay mucho que explotar.

      Un saludo

  • Muy interesante!!! Es fácil que con el día a día se nos olvide lo importante que es mantenernos actualizados. ¿Crees que esta estructura llegará pronto a las plantillas de WordPress?

    • Nacho Mascort dice:

      Buenas Francisco,

      Muchas gracias por tu comentario 🙂

      Se de algunas plantillas que permiten exprimir el jugo de html5 pero que hagan exactamente lo de los múltiples h1 si que no te sabría decir. Creo que Génesis es “html5-friendly” así que si quieres empezar a mirar por ahí ya me cuentas jaja

      Un saludo,

    • Dean Romero dice:

      Yo dudo que sea a corto plazo,

      Genesis tiene de todo, es amigable hasta cierto punto, tiene muchísima mierda también en muchos casos,

      ¿Lo mejor? Qué te hagan una maldita plantilla a medida, no es una opción “tan rara” como muchos se creen, hablaré de ello a mi regreso

  • Blanca dice:

    Hola Dean, Nacho !!!

    Dean me llegó justo a tiempo el post, me estaba quebrando la cabeza por que no puedo ganarle de posición a mi competencia, el maneja múltiples h1 tal como lo indican ahí y está posicionado en el mejor lugar, creí que estaba mal y estaba ahí por otra cosa, lo probaré sin duda alguna jujuuu 😀 espero ya ganarle.

    Muy buen post Nacho 😉
    Muchas gracias a los 2 n.n

    saludos!

    • Nacho Mascort dice:

      Blanca, muchas gracias por tu comentario 🙂

      Has de probarlo y nos cuentas que tal!

      También te digo que pese a que este post sea sobre SEO On Page, donde este un enlace potente que se quite lo demás (al menos por ahora).

      Un saludo

    • Dean Romero dice:

      Tremendo entonces 🙂

      Lo mejor en SEO (de toda la vida de dios) es y ha sido probar, dale caña y me cuentas si quieres

  • Art Body+ dice:

    Lo mejor de este blog es que siempre encuentras artículos que aportan al conocimiento, ese es el sello distintivo y lo que hace que seamos fieles seguidores y nos guste interactuar. Genial el enfoque y resultados de este trabajo de los H1. Son unos cracks. Ya anoto para los proyectos que ameriten su aplicación.

    • Nacho Mascort dice:

      Muchísimas gracias Art Body+!

      Estos comentarios siempre ayudan mucho y motivan que dan gusto 🙂

      Un saludo,

    • Dean Romero dice:

      Toma ya!

      Lector feliz, punto por ahí,

      No sé si viene a raíz de lo que manifesté el otro día sobre comentarios críticos y algún que otro “hater” o es coincidencia pero mucha gente me está dando su apoyo incondicional estos días, me hacéis muy feliz de verdad,

      No obstante esperar un poco y veréis … 🙂

  • Mapachito dice:

    :O :O :O alucinadita me hallo.

    Recientemente he tenido que migrar mi blog principal a wordpress por webs ( coj—– ) y echo mucho de menos no saber modificar la plantilla SEO a golpe de HTML, pues va todo por plug ins y php.

    Dejo esta entrada marcada para ver si cuando disponga de tiempo y me anime a crear un blogspot nuevo para hacerle perrerías y experimentar, pruebo esto si es que lo permite.

    • Nacho Mascort dice:

      Jaja gracias por tu comentario 🙂

      Cuando hagas pruebas cuéntanos el resultado!

      La verdad es que wordpress es muy cómodo y si te animas a tocar php puedes hacer de todo.

      Un saludo

    • Dean Romero dice:

      Esa Mapache!!!

      Qué tal tía?! encantado de verte por aquí,

      Si te cuesta hacerlo pilla a un programador, yo trabajo con uno muy bueno ahora, es lo mejor que he hecho en mucho tiempo

      Un abrazo y espero que estés bien

  • Karen dice:

    Interesante, eso quiere decir que nos podemos crear una home con varios H1, para que le den más relevancia a la parte interna de nuestro sitio, y con esto también dentro de cada categoría cambiar los H2 por H1 en cada título de artículos que están dentro de una categoría.

    Muchas gracias por la info. Un saludo!

    • Nacho Mascort dice:

      Gracias Karen,

      Siempre que uses html5 y tenga sentido, puedes emplear varios h1, es lo bueno de este lenguaje para estructurar información 🙂

      Un saludo

    • Dean Romero dice:

      De todos modos emplearlo con cuidado, como bien dice Nacho: “siempre que tenga sentido” (tratamiento de conceptos diferentes en una misma URL) y sin poner patas arriba el etiquetado html de las demás partes de la web

  • Andres Porras dice:

    Buen aporte.
    Esto es lo lindo del html5, lo cual permite trabajar por secciones independientes y dar relevancia a cada contenido.

    • Nacho Mascort dice:

      Sin duda Andres,

      html5 es una gozada y permite tener una web muy clara para cualquiera que acceda, ya sean humanos o bots.

      Gracias!

  • Jarem dice:

    Excelente contenido como siempre, no me esperaba menos de B30, ojalá ya pronto se empiecen a utilizar estas técnicas en las plantillas wordpress.

  • Marcos dice:

    Buenas Nacho, genial, muy bien explicado todo, me has enganchado xDD!

    Tengo una pregunta. Entiendo que se puedan usar varios H1, pero ¿a nivel práctico tiene alguna repercusión positiva o beneficio en el SEO realmente?

    Gracias!

    • Dean Romero dice:

      Marcos, ¿ya estás con el café amigo mío? 🙂 jeje!

      Cuando responda Nacho te doy mi punto de vista

    • Nacho Mascort dice:

      Hola Marcos!

      Muchas gracias por tus palabras 🙂

      A nivel práctico, por supuesto.

      Piensa en el ejemplo de tener tu marca como h1 en cada página de tu web. Con el “paradigma” actual estaría condenado a no poder aumentar tu relevancia temática ya que todos tus títulos serían h2.

      Ejemplos como ese hay bastantes y ya te digo que lo bueno de html5 es que es un lenguaje de estructura de información semántico muy versátil por lo que le facilitas a los bots la lectura y el entendimiento de tu web y eso siempre tiene puntos positivos a nivel de SEO.

      Un saludo

      • Marcos dice:

        Genial, lo probaré en la plantilla que estoy creando a ver qué tal. Gracias tío, muy buen post y muy interesante.

        Dean, queremos saber tu opinión xD

        • Dean Romero dice:

          En modo resumen que hoy voy fatal de tiempo! jeje,

          Creo que cuando tiene sentido separar conceptos completamente distintos pero dentro de una misma página / URL si puede tener sentido,

          Algo que creo que favorecería a que además Google entendiera mejor cada uno de esos H1s podría ser por ejemplo linkar de forma interna desde artículos de esa misma web a los diferentes H1s y esto se podría hacer tal vez con algún plugin tipo table of content plus (que te da una URL para cada título o subtítulo) o sino a través de una pequeña programación a medida,

          Investigaré sobre ello

  • Boox dice:

    Pensaba que más de un H1 se valoraba mal y te penalizaban mucho…

    Interesante articulo, con muy buen contenido!

    • Nacho Mascort dice:

      Hola Boox!

      Muchas gracias por tus comentarios.

      Siempre que tenga sentido y emplees html5 no tienes porque preocuparte 😀

      Un saludo

      • Boox dice:

        Gracias nuevamente por tu respuesta, investigaré aun un poco más porque me parece una información interesante y que desconocía por completo, soy más de estructurarlo por jerarquía pero puede ser una alternativa a casos concretos y que me convengan.

        Gracias y un saludo!

  • Diana Cruz dice:

    Que bien me ha venido este artículo. Mi blog es un wordpress y tiene la estructura de múltiples h1 y la verdad es que estaba muy preocupada ya que siempre he leído que solo se podría tener un h1.

    ¡Parece que me puedo quedar tranquila :-)!

    • Nacho Mascort dice:

      Hola Diana!

      Muchas gracias por tu comentario 🙂

      Recuerda que la estructura de múltiples h1 es correcta siempre y cuando estés empleando html5 junto las etiquetas correctas que menciono en el artículo sino no.

      Un saludo

  • Estoy de acuerdo con el post, HTML5, bien configurado permite incluir varios titulos h1.

    Pero, no entiendo por que has comentado que Google dice que no hay que usar más de 1 por página. En el video de Matt no hay que interpretar nada, ni pensar en WordPress o CMS, es que esas declaraciones son del año 2009, un mundo dominado por HTML 4.0.

    • Nacho Mascort dice:

      Hola Gaizka!

      He explicado lo de un solo h1 ya que es lo que siempre se ha dicho y se estableció como la gran verdad. Ha sido, simplemente, una manera de explicarlo para los más reticentes al cambio o más old school jaja

      Un saludo

  • Carlos dice:

    Muy buen artículo. Me ha parecido realmente interesante, pero tengo una pregunta.

    Yo utilizo wordpress con Genesis y tengo activada la compatibilidad con markdown (me ayuda a escribir rápido). Entonces si el framework es compatible con html5, con marcar los h1 que quiera ¿es suficiente? ¿No hace falta editar a mano el código?

    Muchas gracias y un saludo

    • Nacho Mascort dice:

      Hola Carlos!

      La verdad es que deberías entender tu web como una misma unidad por lo que no creo que te sirva lo que comentas.

      Tampoco es un theme que conozca muy bien pero como ha dicho Dean más arriba lo mejor es hacer un theme personalizado para estos casos.

      Un saludo

  • Juanito dice:

    Excelente post, cada vez me fijo más en el seo on page ya que cada punto extra en él te quita backlinks que realizar que normalmente es la tarea más aburrida.

  • Sergio dice:

    Muy interesante Nacho:

    Uno de esos temas que sigue generando ríos de tinta (digital)…
    Me encanta esta parte técnica y sumergirme en las “tripas”, el código de la página web.

    Un saludo y muy buen trabajo.

  • serjunco dice:

    Interesante el saber ciertas cosas como esto. Pequeñas perlas de conocimiento.
    Como se puede saber si los themes wps lo implementan? (Por curiosidad q yo de codigo mal) 😉

    • Nacho Mascort dice:

      Hola Serjunco!

      En estos temas siempre te recomendaría a un programador experto en estos temas.

      Sobretodo porque a nivel de código verías PHP

      Un saludo

      • serjunco dice:

        Nacho, ni me lo planteo yo.
        Lo que quería preguntar es que en los themes para distinguir unos de otros si lo marcaria de alguna forma. Para alguien que no sabe por ejemplo si decantarse por un theme tal o theme pascual que sea un factor a avaluar.
        Si lo has visto o sabes de "compañías" que ya lo implementen en WP.

        Muchas gracias

        • Nacho Mascort dice:

          Buenas Serjunco,

          La única manera de ver la diferencia es mirar código, no queda otra.
          Deberías fijarte en la documentación adjunta de los themes, debería de decir algo ahí.

          También podrías ver la demo y mirar en código si tiene etiquetas de html5 como las mencionadas anteriormente.

          Un saludo,

  • Magnífico artículo!!

    Siempre había visto la restricción de “una etiqueta H1 por página” un poco antinatural, porque era ponerlo a efectos prácticos casi al mismo nivel que el TITLE de la página; es decir, que se le atribuyen al H1 aspectos propios del TITLE.

    Pero los encabezados son eso, encabezados, y si una página web es suficientemente variada y rica, tiene total sentido que tenga varios H1 (más los correspondientes subencabezados). Aunque, claro, para eso dicha página debe tener cierta extensión, no un página “estándar” de 300 palabras.

    Una aplicación práctica directa (y relativamente fácil de implementar) es cuando una página tiene varias secciones claramente diferenciadas (como puede ser la portada de un sitio web), tocando la plantilla del theme en pocos sitios.

    Un saludo.

    • Nacho Mascort dice:

      Muchas gracias por tu comentario Antonio!

      Es tal como dices,un solo h1 no ayudaba para estructurar información que debería estar al mismo nivel jerarquico.

      Un saludo

  • Hola Nacho, enhorabuena por el artículo está genial. Estoy totalmente de acuerdo en lo que cuentas. Me gusta la forma que tienes de desarrollar el post. Un saludo campeón.

    • Nacho Mascort dice:

      Hola Juanma!

      Muchas gracias por tu comentario, este tipo de respuesta anima a seguir mejorando sin parar .

      Un saludo 🙂

  • Roger Berga dice:

    Nachooooo Excelente artículo. La verdad es que el html 5 tiene miles de funciones y como dices queda mucho para explorar y con posts así nos ahorramos horas de investigación así que muchisimas gracias.

    Veo que mucha gente te comenta la facilidad con la que redactas y estoy totalmente de acuerdo con ellos, te explicas muy y muy bien.

    Saludoooos!

    • Nacho Mascort dice:

      Hombre Roger, tu por aquí 🙂

      Muchas gracias por tu comentario, se aprecia muchísimo.

      Tienes toda la razón html5 es un mundo que explotar y descubrir.

      Un saludo,

  • yehiro dice:

    Hola Dean y Nacho. Excelente, justo estaba analizando esto en varias webs y no tengo mucho conocimiento en código, estoy aprendiendo hasta ahora, pero se lo básico de las etiquetas y lo que implican para el S.E.O y y casi todos los blogs que visito miro el código y jajaja me volvía loco las dierencias y con esta entrada me has aclarado ya mejor todo. muchas gracias 😀 Un saludo a ambos.

    • Nacho Mascort dice:

      Hola Jehiro,

      Muchas gracias por tu comentario 🙂

      Me alegra saber que este post te ha ayudado. Sigue analizando webs que poco a poco irás viendo que funciona y que no en cada uno de ellas.

      Un saludo

  • Un artículo genial.
    Tendré que mirar mi plantilla de Genesis, a ver como va en esto de los h1.
    Un abrazo.

  • Dean Romero dice:

    Oye Nacho, he visto que eres muy bestia en grupos de Skype que hay por ahí, ¿tendremos que hablar más tú y yo alguna vez no? 😉

    Un abrazo fiera

  • Aroa dice:

    Madre mía estoy por tirarme por la ventana con esto de los H1 Jajajaja y ahora voy y me encuentro con este genial post al buscar respuestas en Google. Lo primero enhorabuena por el post. Pero a ver llevo toda la semana trabajando en cambios en mi página web armamecurvyblog y al revisar detectó de que llevo casi un año cometiendo el error de novTa de duplicar mis H1 porque mi tema ya me pone el título de la entrada como H1 y yo lo ponía igualmente a mano. Además de mi blog personal llevo tres blogs más en diferentes nichos y en dos de ellos detectó el mismo problema,menos en el tercero que ese tema pone el título como h3 por lo tanto no lo estaba duplicando. Llevo toda la semana buscando información para solventar esto y ahora leo este post!! Y ya no sé qué hacer!! Porque en las auditorías que hago en woorank me penaliza los h1 duplicados y me lo penaliza. En el caso de blog que es que yo misma diseño ya que los otros son de clientes,entonces ahora que he invertido tiempo en mejorar aspectos tan importantes como la velocidad de carga, y código no quiero pifiarla por este punto. Y más teniendo en cuenta que no se porque Google me ha mandado para la segunda página con la long tail que mejor tenía posicionada en el blog que es “blogs de tallas grandes” hasta hace un par de días llevaba meses manteniéndome en la misma posición balanceando entre la séptima y la novena. Y esto bastante jodida porque no sé que es lo que me ha penalizado o si estar cambiando diseño en la página me ha podido afectar que no creo. Por tanto mi duda es que hago con mis H1 duplicados los dejo,los quito….muchas gracias por vuestra ayuda y por gracias A Dean y sus geniales autores invitados descubrir blogs de calidad!!! Un saludo

    • Nacho Mascort dice:

      Hola Aroa,

      Muchas gracias por tu comentario 🙂

      Vamos a ir por partes jaja

      1- Comprueba que tu web emplea las etiquetas que menciono arriba. Lo puedes comprobar mirando el código fuente de tu página. Si por defecto están, comprueba que siguen una estructura similar a la que se menciona en el post. En el apartado recursos puedes ver la documentación oficial. Esto denotaría que tu web puede tener varios H1.

      2- Dicho lo anterior, parece que lo que te ocurre es que se te generan dos H1 en el mismo post. Si es así, entonces si habría duplicidad.

      3- Si no estás muy acostumbrada a tocar código te recomiendo que emplees un sólo H1 por página. De esta manera evitarás problemas con posibles duplicidades.

      4- La caída del blog puede deberse a varios temas. Si no paras de modificar elementos On Page tal vez modificaste algo que estaba funcionando… Parece que hace poco hubo actualización del Algoritmo por lo que tal vez caíste debido a ello…

      Espero que estos consejos te hayan ayudado, para cualquier cosas aquí estamos.

      Un saludo

      • aroa dice:

        Muchas gracias Nacho!! Teniendo en cuenta que prefiero no tocar código voy a eliminar los h1 duplicados ya que en mi caso y con mi experiencia en código más me vale no querer hacer cosas para las que aun no estoy preparada. Mil gracias por contestarme y por tu amabilidad.
        Respecto a la caída del blog voy a darle una vuelta a este post incluyendo información enlaces, es decir, lo voy a actualizar y mejorar para volver a rankear mínimo en la primera página.

        Un saludo y muy buen día

  • Nacho dice:

    De Nacho a Nacho, genial post.

    Me ha gustado mucho porque engancha desde el principio hasta el final, poniendo sobre la palestra un tema importante y poco hablado y dando explicaciones detalladas y bien expuestas.
    Es totalmente cierto que los themes de WP vienen con la estructura que comentas, sobre todo los utilizados para blogs o themes de noticias. Habrá que probar a tocar algo de lo que comentas a ver cómo responde.

    Un saludo

    • Nacho Mascort dice:

      Muchas gracias Nacho!

      Cuéntanos a ver si encuentras algunas plantillas más HTML5-friendly y lo que toques haber que resultados te da.

      Un saludo,

  • ElAprendiz dice:

    Me encanta, con cada tema que leo quedo encantado, realmente!
    Tengo una duda, Dean. Qué opinas de esta herramienta SEO?
    http://www.siteseoinfo.com/
    No es precisa pero me indicó que no tenía metadatos mi sitio web y es verdad…
    Para google son importantes actualmente estos metadatos?
    Disculpa mi ignorancia… Saludos

  • Hola fieras

    Leí el artículo cuando salió y me decidí a probar con páginas de nicho, en Wordpres. Suelo escribir los artículos en html a pelo y luego los copio directamente.

    La verdad es que no me lo monté bien y no escogí las keywords. Fui probando al tuntún en vez de coger keywords de dificultad similar, para poder comparar.

    Tengo páginas con varios h1 que van subiendo igual que tengo páginas típicas que también lo hace. Así que lo único que puedo asegurar es que usándolo dentro mismo del editor de WordPress funciona, por lo menos, igual de bien que como estructura web.

    Además, lo que sí he comprobado es que me posiciona, además de la keyword principal, palabras relacionadas (p. ej. “proteínas” como palabra principal y posiciona también para “aminoácidos” y “enlaces peptídicos”, que son h1 con texto currado y otraas h relacionadas con el término).

    Ahora empiezo otro proyecto y voy a tener en cuenta la dificultad para comparar por igual.

    Dean, si sabes tienes algo en mente para WordPress con esta estructura, no te lo guardes, que más de uno y de una pagamos temas peores.

    Un abrazo!!!

  • Todas las herramientas que hacen una auditoría SEO dicen que tener muchos h1 es malo, ojo, malo, no que penalice, pero estoy de acuerdo con el artículo de Nacho.
    Por ejemplo, en mi web, la página de inicio al tener un listado de posts Seoquake me dice que tiene un montón de H1, claro, cada título, pero no veo nada afectada mi web la verdad.
    Ahora es el momento de probarlo dentro de un solo artículo a ver que tal.

    Un saludo!

  • locutor dice:

    consulta:
    me aparecen 3 H1, en el home
    h1… con un titulo (esta bien)
    y luego 2 h1, vacios ¿como puedo eliminar esos 2 H1 vacios?
    porque me generan mal posicionamiento
    muchas gracias!!!

  • Paulo dice:

    Esta muy interesante el articulo y todo lo que explica Nacho Mascort en el…

    Sin embargo, no puedo dejar pasar el hecho de que no aplique esta formula en https://www.mariposas.wiki/

    En esa web no utiliza articles ni sections, y por supuesto tan solo ocupa una etiqueta h1.

    Mi pregunta es por que?

    Es contradictorio ver eso despues de leer este articulo. Sobre todo teniendo en cuenta que mariposas.wiki esta super bien posicionada, y su estructura onpage está basada en un árbol de divs.

    Es preferible dejar que Google interprete como mejor le parezca las jerarquías en base al árbol de divs que propone Nacho en mariposas.wiki?

  • Juan dice:

    Hola!!!
    Genial post, había pasado de largo el HTML 5 cuando veo que es de lo que se veía venir…

    Manejamos varias web, una de ellas en su portada tiene este esquema:

    h1: Servicios Ofrecidos
    h2: Reparación Televisores , Reparación Máquinas de Coser, Reparación Cafeteras etc… así hasta con 10 h2.
    Como sabrán cada reparación será distinta y se podría realizar perfectamente este esquema de html5, pero mi DUDA:

    ¿Es posible hacerlo de forma correcta en una página con WordPress, donde se usan editores Visual Composer para crear las páginas y subpáginas?

    Lo veo posible… ¿cómo? -> Añadiendo a mano en vez de h1, h2, p, las etiquetas de html5,

    en sí quedaría así:

    Web de Reparacion servicios…

    Reparación Televisores

    Televisores Samsung

    Televisores Sony

    Televisores LG

    Reparación Máquinas de Coser

    Máquinas coser alfa

    Máquinas coser bernina

    Máquinas coser pfaff

    etc………………….

    Puedo hacer ese esquema, MANUALMENTE en WordPress…. usa el editor visual Visual Composer que crea su código de etiquetas personalizado…. pero creo que se podría añadir un esquema manual no?

    Esa duda para Web con WordPress que hoy en día más de uno tendrá esa duda luego de leer este post, siempre me parecio un poco mal diseñado y claro con HTML5 encontre la solución, ahora quiero saber:
    1. Afecta a la web (tiene ya buen posicionamiento en x keys)
    2. Para web en html antiguas, puedo hacer este cambio de estructura en las páginas INTERNAS, una a una???. Si mi sitio tiene 99 páginas, puedo empezar por la HOME editar las etiquetas a HTML5, al día siguiente la otra, y asi sucesivamente con las que me interesan,, el resto dejarlas en html del antiguo???
    3. Para Web WordPress, se puede hacer a mano como este ejemplo que escribí?
    4. Al comprobar con herramientas de etiquetado etc,,, omito este apartado de h1 duplicados etc, ya que será de este cambio.

    Espero puedan colaborarme con esto, de ser posible el punto 2, lo inicio ya mismo!!.
    Si es posible el punto 3, también inicio!!! Siempre teniendo en cuenta el punto 1 y 4 no de fallos.

    Gracias por su ayuda!

    • Juan dice:

      PD:
      El código se ha implementado y me ha borrado las etiquetas… las dejo nuevamente pero sin forma de etiqueta.

      en sí quedaría así:

      el body…..—–

      el header abre…..

      h1 abre…. Web de Reparacion servicios… cierra h1

      el header cierra…..

      section ABRe…..

      el header abre…..

      h1 abre….Reparación Televisores ….cierra h1

      el header cierra…..

      artiicle abre….

      h1 abre…. Televisores Samsung ….cierra h1

      artiicle cierra….

      artiicle abre….
      h1 abre…. Televisores Sony….cierra h1

      artiicle cierra….

      article abre….

      h1 abre…. Televisores LG….cierra h1

      artiicle cierra….

      cierra section

      abre section 2 …….

      el header abre…..

      h1 abre….Reparación Máquinas de Coser ….cierra h1

      el header cierra…..

      artiicle abre….

      h1 abre…. Máquinas Alfa….cierra h1

      artiicle cierra….

      artiicle abre….
      h1 abre…. Máquinas Bernina….cierra h1

      artiicle cierra….

      article abre….

      h1 abre…. Máquinas Pfaff….cierra h1

      artiicle cierra….

      cierra section

      Gracias por su ayuda!

  • Hola Dean

    Me parece que esta es una parte del Seo que hay que mejorarla delegandola en un programador

    Después de todo hay que jerarquizar todos esos H1

    Saludos

  • Excelente articulo, me fue de mucha utilidad, muchas gracias! un fuerte abrazo!

  • >
    Scroll al inicio
    grupo
    100-nichos

    Únete a mi comunidad y obtén gratis mi ebook

    100 nichos potencialmente rentables de Adsense y Amazon a atacar en 2024