SEO con HTML5 – Bases

Últimamente he leído muchas cabalas de SEO y HTML5 y tras darme cuenta de que todos se copiaban entre sí y que cada uno se quedaba con algunas cosas me empollé un manual e intenté poner en orden las diferentes cosas que veía.

A día de hoy, HTML5 puro es una cuasiutopía, pocos los soportan y hay que poner tantos parches en el código para que se interpreten las cosas de una forma adecuada en todos que es poco operativo. Por otro lado hay tantas posibilidades como flecos y cosas por testar, con lo que todo lo que iré diciendo estos días se basa en gran medida en suposiciones / expectativas. Lo buieno, es que para gran parte de los aspectos se puede llamar a la API de google para que el navegador cargue los componentes necesarios para poder identificar correctamente los contenidos bajo html5 (con lo cual nos indica que Google ya sabe identificarlos y mapearlos)

Como punto general, el html5 orientado al SEO tiene más que ver con la jerarquía y organización semántica y relacional de los contenidos que con ningún caso de ensayo error. Gran parte de las cosas que se buscan tienen que ver con la accesibilidad, organización y jerarquía. Tiene todo el sentido que funcionen muy bien para el SEO en el futuro, pero todo parte de una “proyección”. Es decir, el juego de estilos, la jerarquía, las relaciones tienen peso en SEO cuando se hacen bien, en gran parte por la categorización / organización / jerarquía y dependencia de contenidos relacionados. El html5 da más juego.

Voy a Exponer el índice de los temas por los cuales considero que el html5 será bueno para el SEO e iré publicando sobre cada uno de los temas a medida que obtenga más información / disponga de tiempo (estos días estoy de mudanza)

Porqué debería ser bueno para el SEO:

  • Minimiza el ratio código / texto y en la propia definición de código añade multitud de valores semánticos. (como problema, el hecho de que haya que picar un montón de parches, esta ventaja será desvirtuada durante un tiempo)
  • Estandariza un montón de etiquetas centrando el valor de una forma más optimizada.
  • Dentro de los enlaces puedes añadir varios valores / atributos, de una forma jerarquizada. Prácticamente puedes meter en un enlace cualquier cosa salvo otro <a> y que esté identificada y destacada en su justa medida. (aquí no tengo ni idea de la proporción de pesos)
  • Tiene una analogía con multitud de microformatos para estandarizar los componentes de información.
  • Puedes jerarquizar los contenidos muy bien,  <section>Para agrupaciones e contenidos <article> para contenidos con autonomía y valor por si mismos<aside> para contenidos relacionados en fuentes externas <sumary> para resumenes de contenido y cada uno con su cabecera, estilos. Esto me encanta, reconozco que estamos dándonos de leches con unos colegas diseñadores para ver qué tendríamos que hacer con este punto, pero supongamos, únicamente bajo el punto de vista jerárquico y formal del html5: Un contenido está alojado en una sección (que tiene un h1 como identificación de la sección) dentro de la sección tienes unos artículos, en un orden de jerarquía (el primero, al ser el elemento principal autónomo de una lista TAMBIEN podría ser un h1) y si tienes una portada con diferentes secciónes, podrías tener bajo un estandar jerárquico, de forma legítima una docena de h1. (Es como si el h1 fuera el elemento principal de una lista jerarquizada con múltiples ramificaciones) tienes un <footer> dentro de un artículo para segmentar información externa al contenido propio del artículo, pero relacionada con él (quien lo hizo, compartelo…)

  • En este punto, una cosa importante, tienes un footer, un aside y un header independiente por cada unidad autónoma de contenido. No hablamos de 1 footer, 1 header y aside total en una página, puedes tener muchos…
  • Dispones de una etiqueta hgroup para agrupar contenidos jerarquizados y dar relevancia a uno. (de entrada diría que esto mola, pero tampoco sabría decir cuanto)

Iré publicando información a medida que asegure algunas cosas y rompa otras ;)

If you enjoyed this post, make sure you subscribe to my RSS feed!

32 Responses to “SEO con HTML5 – Bases”

Guillermo Vilarroig said:

Interesante!! esto hace más creativo y divertido el trabajo del SEO. Esto bien usado va a dar mucho juego.
Me parece muy bien que te lo empolles antes de publicar. Mola!!
Gracias.

Guillermo

Mar 9th, 2011 at 8:53 am

Aleyda said:

Hola Javi,

Muy buen resumen y análisis de lo que hay ahora mismo!

Quizás lo que veo con más claro potencial a influir a corto – medio plazo es la parte semántica de la mano de los microdatos, que ahroa mismo solo da visibilidad con los rich snippets … pero que está claro que puede suponer un gran avance para identificar la relevancia del contenido.

Estaré atenta a lo que vayas publicando sobre el tema y ya te comentaré si voy identificando algo…

Mar 9th, 2011 at 9:09 am

Carlos Redondo said:

Hola Javi,

Buen resumen, yo tambien estuve mirandolo para poder hablar con propiedad cuando digo que el HTML 5 no ayuda al SEO, y que no se digan tantas tonterias ;)

A ver, va a ser muy bueno cuando salga, pero a dia de hoy es una mera PROPUESTA. Una vez esté aceptado el documento definitivo, y comience a ser estándar nos vendrá muy bien porque nos facilita tanto a nosotros como al buscador el rastreo e interpretación de contenidos.

Pero HTML 5 no ayuda al SEO, HTML5 es HTML4 con microdatos (que no microformatos que son anteriores y ya pueden usarse en html4), y algunas mejoras cara a optimizar el código que se usa al hacer páginas y tagear los diferentes contenidos que integran una pagina.

Como todo, el html va mejorando con el tiempo, pero usarlo hoy dia es como querer cambiar tu coche por uno con motor de hidrogeno…es bueno…si…pero a dia de hoy no te servirá de nada ;)

Un abrazo crack

Mar 9th, 2011 at 9:45 am

vseo said:

Es que es eso Carlos ;)
Hay mucho por definir y testar, suena bonito, pero no tengo ninguna experiencia empírica que diga nada de todo esto y los casos de exito de algunos hablando de esto, bueno, digamos que no tomaron muy bien las referencias y no aislaron los datos (ni leyeron las fechas de las que hablaban) .
Hay que hacer test, romper cosas. El post es teorizar…

Mar 9th, 2011 at 10:21 am

Fernando said:

El pasado Search Congress en Barcelona vinieron a enseñarnos las maravillas de html5 pero lo enfocaron demasiado a los fuegos de artificio que se podían plantear con la web.

Ahora bien, el punto diferencial de este lenguaje es la posibilidad de etiquetados semánticos e independencia algorítmica de las partes en una web, en una simple hoja, pudiendo definir formatos individuales que ayudaría a la catalogizacion del sitio y del contenido para múltiples variables dentro de la misma web. Y esa es la cuestión fundamental que espero que pronto se pongan de acuerdo.

La semántica ayudaría a la indexación y a la catalogizacion, lo que ayudaría a la ordenación y podría ajustar los resultados de cualquier buscador de forma mucho mas eficiente (y, por ende, se supone que menos spámica)

En el rabillo del ojo, sin embargo, sigue estando el poder de extracción de datos en beneficios de tercero y es que si podemos quitar de una web el polvo y la paja, no impediría a nadie (y cuando digo nadie me refiero a la gran G, la empresa mas scrapper de todas) de asimilar TUS contenidos semánticamente activos dentro de SUS páginas y en eso me uno a Aleyda en su aseveración, y es que la relevancia del contenido cuantificable en los microformatos es una forma simplemente sencilla y util de replicar ese contenido indexable.

Para mi es un futuro muy agradable, siempre que se pongan de acuerdo lo antes posible en aprobar un estandar y no salga algún iluminado (llamalo empresa) entre medio que “invente” otro estandar diferente que quiera también que el mundo asimile. Yo confio mucho en este estandar si se convierte en estandar y confio mucho en que nos va a ayudar muchísimo

Mar 9th, 2011 at 10:29 am

vseo said:

Sip, hay mucho de eso.
para el resto de scrappers, un honeypot y listo :)
GUERRA!!!

Mar 9th, 2011 at 10:36 am

Carlos Fabuel said:

Yo en estos momentos si hago algo en html5 lo hago únicamente para dar publicidad …’y somos los más modernos y tenemos nuestra página en html 5′

No tiene sentido sacar páginas en producción real con un código que no reconocen muchos navegadores Y lo que es peor lo reconocen de forma muy diferente.

Eso si, es bueno hacer experimentos con webs pequeñitas.

Con el tema contenidos-scrappers.. si pones tus contenidos en la red ya no son tuyos.. son del que lo lee.. el usuario es lo primero.

Mar 9th, 2011 at 2:09 pm

Jorge Maiden said:

Interesante post compañero!

Os invito a que visiteis esta web si estais empezando a investigar sobre las posibilidades de html5 mozillademos.org/demos/dashboard/demo.html

Por fín html5, poco a poco esta ya implementándose las webs más valientes.

Mar 9th, 2011 at 3:33 pm

Javier Lorente said:

Como te gustan los honeypots!

Mar 9th, 2011 at 4:41 pm

ausaseo said:

El post me ha parecido muy didáctico, sobre todo para los que no conozcan todavía el HTML5, pero está muy claro que hasta que no sea un estándar para todos los navegadores poco uso tendrá, sino más que complicaciones, pero está claro que hay que testear y empezar a jugar con él que al fin es lo que nos gusta. Sobre SEO y HTML5 quizá no vayan mucho de la mano, pero me gusta pensar que si le facilitas las cosas a G ten por descontado que te lo agradecerá.

Mar 10th, 2011 at 6:48 am

skyblue said:

llevan años con la especificación del estándar y lo que queda!!!

ademas para el tema de los codecs de vídeo como no se pongan de acuerdo ya estamos con un estándar que no es estándar…

Mar 10th, 2011 at 11:31 am

Shafie said:

Yo lo que veo es que se abre todo un mundo nuevo para practicas black hat, gracias a las nueva estructura semántica/relacional de los datos.

Y que conste que esto es sólo una suposición…

Mar 16th, 2011 at 4:51 am

tamarita said:

Realmente es un tema muy jugoso, siempre es bueno leer algo asi :D

Mar 16th, 2011 at 12:04 pm

R. Arenas said:

Yo lo veo también muy interesante, y habrá que ver que pruebas se hacen, obviamente todavía es algo muy en verde, pero puede servir mucho para el SEO.

No se si impactará totalmente en los resultados de las SERPS, pero si sirve para informar mejor del contenido a los buscadores y a los usuarios.

Por ejemplo los metadatos de Breadcrumb en HTML5, que ya Google los lee y los muestra debajo de los resultados.

Mar 18th, 2011 at 8:57 am

miguel valero said:

Me parece pronto empezar a implementar en html5 ya que es un estandar que todavia está en desarrollo pero bueno es una opinion, en cuanto al seo derivado, he oído de todo, no sé si se ha dicho pero una de las cosas es que como se identifica claramente el footer no tendrá validez los enlaces “de oficio” que ahí figuren, no sé creo que el seo sobre html será algo que se irá clarificando solo, de todos modos buen artículo gracias!

Mar 26th, 2011 at 11:55 am

mujer said:

Muy buen artículo. Gracias por ayudarme.

Mar 27th, 2011 at 3:27 am

diseño web valencia said:

Está bien comenzar a tener algo de información referente a Seo y HTML 5. Pronto es todavía y habrá que poner en práctica mucha prueba – error

Apr 8th, 2011 at 5:48 am

SEO con HTML5 en Xilon | Xilon SEO said:

[...] en Vseo [...]

Apr 11th, 2011 at 9:02 am

Victor Lopez said:

¿Esto quiere decir que no debemos desarrollar en HTML5 todavía? ¿No nos mejorará en algo los rankings?

Apr 15th, 2011 at 3:08 am

Mi IP said:

Pues parece que la mejora si hay alguna, no sera sustancial Victor. Quizas será cuestion de esperar a ver como acontecen los hechos

May 6th, 2011 at 5:19 am

mejor banco said:

Una interesante introducción a lo que se verá pronto en lo que respecta al SEO con lo nuevo en HTML5, buena información, esperemos encontrar buen material en un futuro próximo y como quien dice no nos agarre fríos.

May 13th, 2011 at 1:52 pm

nombres para bebes said:

Esta escructura esta bien. Pero hay algunas que son originales y también están bien.

May 17th, 2011 at 10:17 am

Cambiar la IP said:

Es muy clara la explicacion. Muchas gracias por postearlo

Jun 1st, 2011 at 11:21 am

diseño web vigo said:

Gracias por la informacion

Jun 8th, 2011 at 2:02 am

Hoteles en Menorca said:

quiero consultarles si HTML se puede aprender solo, vía online, por ejemplo, o es necesario asistir a una academia con profesores?

Jun 10th, 2011 at 6:54 am

que significa mi nombre said:

myçy bueno el post

Jun 13th, 2011 at 9:02 am

chistes buenos said:

este artículo es de 10

Jun 13th, 2011 at 9:03 am

que es el amor said:

vaya vaya interesante

Jun 26th, 2011 at 9:48 am

Que es el amor said:

buen articulo

Aug 3rd, 2011 at 10:29 am

Schema said:

[...] presenta múltiples puntos de unión con otros entornos. La etiqueta de autor y el footer del html5 deberían presentar el mismo contenido / description =  summary… Basicamente, un correcto [...]

Aug 8th, 2011 at 1:19 am

dani said:

Gracias, realmente muy bien explicado

Oct 23rd, 2011 at 12:46 am

Luis Pumaricra Diaz said:

Hola, muy buen post.
De hecho yo tambien acabo de hacer muchos cambios a mi web, para adaptarlo a HTML5 y usar un poco de microformatos tambien.

muchas gracias..

Feb 14th, 2012 at 8:50 am

Leave a Reply

Private