Por qué no aparecen las estrellas de los rich snippets

Cuando se muestran en los resultados de búsqueda, las estrellas de los rich snippets suelen aumentar de forma notable el porcentaje de clics desde Google. Sin embargo, conseguir que esas atractivas estrellitas amarillas aparezcan en los resultados de búsqueda ha resultado ser todo un reto para muchos dominios. De hecho, un estudio de Raven Tools de octubre de 2015 señala que el 80 % de los sitios no tiene marcado SchemaSe abre en una ventana nueva.

En los últimos años, el equipo de SEO de Bazaarvoice ha trabajado con cientos de dominios para identificar y resolver los problemas que impiden que Google muestre las estrellas de los rich snippets. Los problemas no son difíciles de entender, pero encontrar el problema concreto a veces puede ser un reto.

Definiciones clave que debes conocer:

• Nodo HTML – en el código HTML, un nodo es la palabra que define una etiqueta HTML de apertura, una etiqueta HTML de cierre y todos los elementos que hay entre ambas. Por ejemplo, el siguiente es un nodo de párrafo HTML completo con el id foo: <p id="foo">This sentence is part of the node.</p>

• Nodos HTML anidados: los nodos HTML pueden colocarse unos dentro de otros. Por ejemplo, el siguiente es un nodo de párrafo HTML completo en el que una palabra se pone en negrita con un nodo de negrita: <p id="foo">This sentence is <b>part</b> of the node.</p>

• Itemscope – se puede añadir un atributo itemscope de schema.org a un nodo HTML para identificar el tema que se tratará dentro del nodo.

• Type Itemscopes – unos pocos itemscopes son especiales y solemos referirnos a ellos como type itemscopes. Estos itemscopes se usan para identificar los temas principales de un sitio web. Product, LocalBusiness, Store, Recipe, Hotel, Article y WebPage son algunos de los Type Itemscopes más habituales en los que las reseñas son relevantes.

• Itemprop – se puede añadir un atributo itemprop de schema.org a un nodo HTML para identificar el tipo concreto de datos dentro del itemscope. A menudo resulta útil pensar en los itemprops como una etiqueta oculta.En la siguiente frase, el itemprop author se añade a un nodo en negrita: <p id="foo">This sentence was written by <b itemprop="author">Newman</b>

Problema n.º 1: Falta de anidamiento

El problema más común que encontramos es no anidar correctamente los elementos de marcado de schema.org. La premisa básica del anidamiento es que el código HTML debe identificar cuándo la página web empieza y deja de tratar un tema determinado.

Los clientes de Bazaarvoice deben usar WebPage como el tipo itemscope más externo en todas las páginas excepto la página de inicio. WebSite es el tipo itemscope adecuado para la página de inicio de un dominio. Recomendamos incluir estos atributos en el nodo body, como se ve en el ejemplo siguiente.

En los casos en que una página tiene una entidad principal, lo cual suele ocurrir en las páginas de detalle (Product, Recipe, Hotel, LocalBusiness, Store, etc.), el itemprop mainEntity debe añadirse junto con el itemscope del tipo de la entidad principal. (consulta la línea 2 en el buen ejemplo de abajo)

Es aceptable que las páginas tengan varios itemscopes de distintos tipos, lo que sería adecuado para las páginas de listado y de cuadrícula, así como para las páginas de detalle con recomendaciones de producto. Si no hay una entidad principal en la página, no incluyas un itemprop mainEntity.

Todos los atributos relacionados con cada entidad (cada nodo HTML de tipo itemscope) deben estar anidados dentro del nodo HTML. Es muy habitual que los nodos HTML se cierren de forma prematura. (consulta la línea 4 en el ejemplo incorrecto y la línea 8 en el ejemplo correcto, más abajo)

Anidar correctamente el código de este modo le indica a Google que todo el contenido dentro del tipo itemscope, como el precio, la disponibilidad, las valoraciones, las reseñas y otros elementos CGC, está relacionado con esa entidad. Entonces Google sabe que debe mostrar las estrellas de un producto en la búsqueda.

También conviene referirse a cada entidad con un nombre idéntico en toda la página. Por ejemplo, si el itemprop name se define como «yellow scarf» y los itemprops itemReviewed se definen como «yellow fringed scarf», Google podría creer que la página contiene datos sobre dos productos.

También conviene asegurarse de que el nombre del producto indicado en la parte superior e inferior de la página coincida exactamente. Usar el término «bufanda amarilla» en la parte superior de la página y «bufanda amarilla con flecos» en la parte inferior confundirá a Googlebot.

Problema n.º 2: Etiquetas HTML sin cerrar

Cuando escribas código HTML, cada nodo HTML debe abrirse y cerrarse: el carácter de barra diagonal (/) indica el cierre de un nodo HTML. Los siguientes ejemplos muestran un nodo típico que utiliza etiquetas de apertura y de cierre independientes.

Mal: <div>Este es un nodo sin cerrar

Bien: <div>This is a closed node</div>

Algunos elementos HTML (<img>, <meta>, etc.) no usan una etiqueta de cierre independiente. En estos casos se usa una única etiqueta que contiene la barra diagonal de cierre.

Mal: <img src="image.gif">

Bien: <img src="image.gif" />

Si las etiquetas HTML no se cierran, el intérprete de datos estructurados de Google puede tener dificultades para entender la jerarquía y, por tanto, malinterpretar el anidamiento mencionado en el problema n.º 1.

Problema n.º 3: Varios itemprops aggregateRating

Como se ha explicado anteriormente, cada entidad debe definirse mediante un itemscope de tipo. Sin embargo, solo debe haber un itemprop aggregateRating por cada itemscope de tipo. Aunque la visualización incluya una valoración agregada en varios lugares, el marcado solo debe etiquetarse con un itemprop aggregateRating una vez por itemscope de tipo. Varios itemprops aggregateRating confundirán a Google y no se mostrarán estrellas.

Problema n.º 4: Falta el itemprop aggregateRating

A veces la valoración que muestran los rich snippets no coincide con la valoración media de las reseñas de tu página web; esto da una pista importante sobre lo que puede estar fallando. Si no hay ningún itemprop aggregateRating, Google buscará entonces el primer itemprop review y mostrará la valoración de una sola persona, no la valoración media de todos los autores de reseñas.

Problema n.º 5: Tipos de datos estructurados mezclados

El vocabulario de Schema.org se puede usar con muchas codificaciones distintas, incluidas RDFa, Microdata y JSON-LD. Bazaarvoice recomienda y admite Microdata. En cualquier caso, solo se puede usar uno de estos tipos de datos estructurados en una misma página web. Mezclar JSON-LD y Microdata en la misma página impedirá que los rich snippets se muestren correctamente.

Problema n.º 6: Entidad principal no definida

Google buscará un aggregateRating del primer itemscope de tipo que encuentre en el DOM (Document Object Model). Si una página contiene varios itemscopes de tipo, asegúrate de que la entidad principal esté etiquetada con el itemscope mainEntity, como se indica en el n.º 1 anterior.

Problema n.º 7: Uso de schema.org/Organization

Organization también es un itemscope de tipo Type. Sin embargo, no hemos encontrado ningún caso en el que Google muestre estrellas de rich snippet para Organization. Hemos visto muchos casos en los que el itemscope de Organization se colocó en la cabecera, alrededor de información organizativa general como números de teléfono y datos de contacto. En todos los casos en que nuestro equipo de SEO ha encontrado el itemscope de tipo Organization en páginas de producto, ha impedido que se muestren las estrellas de rich snippet. En cualquier página en la que quieras que aparezcan rich snippets en los resultados de búsqueda, no incluyas el itemscope de Organization.

Problema n.º 8: Falta contenido de reseñas de respaldo

Google ha mostrado estrellas de rich snippet en algunos casos en los que no había reseñas en la misma página. Sin embargo, la visualización de estrellas en este caso es, como mucho, esporádica, ya que Google puede interpretar la ausencia de texto de reseñas en una página como una pista de que el aggregateRating podría ser un dato falso. Te recomendamos incluir siempre 8 reseñas en la misma página en la que muestres un aggregateRating.

Problema n.º 9: Autenticidad del contenido cuestionable

Si Google no confía en un dominio, o en el contenido que hay dentro de él, es poco probable que las estrellas de los rich snippets se muestren en los resultados de búsqueda. Normalmente es un problema para los dominios más nuevos que aún no tienen buena reputación. El CGC de Bazaarvoice incluye valiosas pistas de autenticidad, como los nombres de pantalla de los autores y la fecha de creación del contenido, lo que mejora la reputación. Estas señalan que la actividad social que ocurre en tu dominio es legítima y mejoran tu reputación.

Problema n.º 10: Marcado de código incoherente entre el lado del servidor e Inspect Element

Esta es un área en la que el sector todavía se está adaptando a los cambios anunciados por Google en octubre de 2014. Desde entonces, Googlebot rastrea tanto JavaScript como los elementos de página del lado del servidor. Hablaremos de estos cambios con cierto detalle a continuación, pero al solucionar problemas con los rich snippets, ten en cuenta que es muy importante auditar tanto la versión del código del lado del servidor, la de “Ver código fuente”, como la versión HTML renderizada que se encuentra con “Inspeccionar elemento”, para asegurarte de que ambas versiones contienen el contenido y el marcado previstos. Veremos en detalle más adelante cómo realizar esta doble auditoría.

Si las versiones del código que se ven en cada herramienta son incoherentes, Google también puede mostrar de forma incoherente las estrellas de los rich snippets. Para obtener resultados óptimos, ambas versiones deben cumplir todos los principios de esta publicación.