En mayo de 2016, Google presentó el nuevo formato de salida para los datos es­tru­c­tu­ra­dos de una web en los re­su­l­ta­dos de búsqueda. De la misma forma que los exitosos rich snippets y acorde al contenido de cada proyecto web, estas permiten re­pre­se­n­tar vi­sua­l­me­n­te y hacer más atra­c­ti­vas las SERP de Google. Este nuevo formato de Google también se basa en schema.org, por lo que es necesario marcar o etiquetar se­má­n­ti­ca­me­n­te los datos. A di­fe­re­n­cia de los snippets, las rich cards buscan pri­n­ci­pa­l­me­n­te generar un impacto positivo en la ex­pe­rie­n­cia de los usuarios de di­s­po­si­ti­vos móviles. Para este propósito, como en las Ac­ce­le­ra­ted Mobile Pages (AMP), las rich cards aparecen en un carrusel de datos que permite al usuario de­s­pla­zar­se a través de ellas. El carrusel de datos puede incluir varias cards de una sola web. Ini­cia­l­me­n­te, este nuevo formato de re­pre­se­n­ta­ción de los re­su­l­ta­dos de búsqueda se limita a las ca­te­go­rías de recetas y películas y solo se muestra para búsquedas móviles rea­li­za­das desde Google.com. Sin embargo, es de esperar que Google im­ple­me­n­te sus rich cards en di­fe­re­n­tes versiones e idiomas, así como para di­fe­re­n­tes tipos de contenido. Este formato parece haber sido creado para la pre­se­n­ta­ción de productos, por lo que resulta de gran im­po­r­ta­n­cia que los ope­ra­do­res de comercio ele­c­tró­ni­co se informen al respecto. Adi­cio­na­l­me­n­te, este podría uti­li­zar­se para la co­me­r­cia­li­za­ción de hoteles, re­s­tau­ra­n­tes, eventos o artistas.

¿En qué se di­fe­re­n­cian los rich snippets de las rich cards?

Desde la im­ple­me­n­ta­ción de sus re­su­l­ta­dos de búsqueda en 1998, Google ha procurado mejorar la calidad de sus SERP co­n­s­ta­n­te­me­n­te. En primer lugar, el gigante de los motores de búsqueda ha op­ti­mi­za­do la manera como se colocan las ofertas web en la pantalla de re­su­l­ta­dos, por lo que las es­tra­te­gias de op­ti­mi­za­ción para motores de búsqueda se han co­n­ve­r­ti­do rá­pi­da­me­n­te en una de las pri­n­ci­pa­les he­rra­mie­n­tas para dar a conocer proyectos online. Sin embargo, en los últimos años, la im­po­r­ta­n­cia del ajuste óptico de los re­su­l­ta­dos de búsqueda ha ido aumentado cada vez más. Por ejemplo, con las campañas internas de anuncios de AdWords se añadió un factor adicional a los re­su­l­ta­dos que, además, era evi­de­n­te­me­n­te di­fe­re­n­cia­ble de las búsquedas orgánicas. Hoy en día, los we­b­ma­s­te­rs no solo tienen la opo­r­tu­ni­dad de atraer la atención de los usuarios con un buen po­si­cio­na­mie­n­to en los re­su­l­ta­dos de búsqueda, sino que también le hacen frente a sus clientes po­te­n­cia­les con una vi­sua­li­za­ción atractiva y de carácter in­fo­r­ma­ti­vo.

Consejo

¿Quieres saber si es fácil para los motores de búsqueda encontrar tu página web? ¡Haz un análisis web gratis ahora!

Análisis Web

Al anunciar la im­ple­me­n­ta­ción de sus rich cards, Google incluyó la siguiente imagen en su blog, re­su­mie­n­do así la tra­n­s­fo­r­ma­ción óptica de los re­su­l­ta­dos de búsqueda:

Imagen: Diferencias entre las rich cards y los rich snippets de Google
Google (https://we­b­ma­s­te­rs.goo­gle­blog.com/2016/05/in­tro­du­ci­ng-rich-cards.html

La ilu­s­tra­ción muestra cómo las rich cards se di­fe­re­n­cian de los snippets. En cuanto a su es­tru­c­tu­ra, las rich cards son similares a los Product Listing Ads que Google introdujo hace unos años y que también muestran re­su­l­ta­dos en la parte superior de las búsquedas móviles. Sin embargo, en contraste con estos, las rich cards son parte de la búsqueda orgánica. Los rich snippets se muestran, por defecto, mezclados unos con otros y aún está por verse cómo se co­m­bi­na­rán los nuevos re­su­l­ta­dos de búsqueda con los di­fe­re­n­tes anuncios de pago en un futuro, y si se definirán je­ra­r­quías claras.

Adi­cio­na­l­me­n­te, en este formato de salida la atención se centra es­pe­cia­l­me­n­te en la imagen pre­se­n­ta­da. De la misma forma que con los snippets, las rich cards incluyen in­fo­r­ma­ción adicional, como por ejemplo:

  • la duración de la película o el tiempo de cocción de la receta,
  • la in­fo­r­ma­ción sobre los actores o sobre las calorías
  • o la va­lo­ra­ción de los usuarios

Además, ambos formatos de salida incluyen un enlace a la página web que presenta el contenido. Debido al espacio reducido y a la prioridad dada a la imagen, en las rich cards des­apa­re­ce la llamada De­s­cri­p­tion.

La tercera ca­ra­c­te­rí­s­ti­ca di­s­ti­n­ti­va es que Google solo muestra las rich cards para re­su­l­ta­dos de búsqueda móviles. Quienes realicen búsquedas desde or­de­na­do­res de es­cri­to­rio seguirán viendo los tra­di­cio­na­les rich snippets. Sin embargo, aún no está claro si Google va a mantener dicha se­pa­ra­ción de manera pe­r­ma­ne­n­te.

Rich cards de Google: cómo marcar los datos

Los rich snippets y las rich cards tienen una cosa en común: ambos formatos requieren que como ad­mi­ni­s­tra­dor web utilices datos es­tru­c­tu­ra­dos para marcar el contenido de tu web, de tal forma que el crawler de Google pueda de­te­c­tar­lo y cla­si­fi­car­lo ade­cua­da­me­n­te. Si decides no realizar el marcado, tu web seguirá apa­re­cie­n­do úni­ca­me­n­te en los re­su­l­ta­dos de búsqueda or­di­na­rios. En caso de que tu proyecto online ya cuente con un set de datos es­tru­c­tu­ra­dos para apro­ve­char las po­si­bi­li­da­des de los snippets, muy se­gu­ra­me­n­te no tendrás problemas para aco­s­tu­m­brar­te a este nuevo formato de Google. Como de costumbre, Google re­co­mie­n­da utilizar JSON-LD para el marcado de datos. En la pla­ta­fo­r­ma Google De­ve­lo­pe­rs en­co­n­tra­rás una lista de los di­fe­re­n­tes tipos de contenido, de las pri­n­ci­pa­les funciones y rich cards di­s­po­ni­bles. Adi­cio­na­l­me­n­te, puedes acceder a una página in­fo­r­ma­ti­va que te indicará las pro­pie­da­des de un marcado de datos adecuado. Así, por ejemplo, según Google, el script JSON-LD para una receta debe incluir la siguiente in­fo­r­ma­ción:  

Propiedad Valor (de acuerdo a schema.org) De­s­cri­p­ción Re­le­va­n­cia
name Text Nombre del plato necesario
image URL o Ima­geO­b­je­ct Imagen del plato necesario
author Person Autor de la receta re­co­me­n­da­do
da­te­Pu­bli­shed Date Fecha en la que se publicó la receta –en formato ISO 8061 re­co­me­n­da­do
de­s­cri­p­tion Text Corta de­s­cri­p­ción de la receta re­co­me­n­da­do
ag­gre­ga­te­Ra­ti­ng Ag­gre­ga­te­Ra­ti­ng Va­lo­ra­ción media de los usuarios re­co­me­n­da­do
review Review Opiniones sobre el plato re­co­me­n­da­do
prepTime Duration Duración de la pre­pa­ra­ción; puede ser definida en tiempo mínimo o máximo; indicado en formato ISO 8061 re­co­me­n­da­do; utilizar siempre en co­m­bi­na­ción con cookTime o totalTime
cookTime Duration Duración del tiempo de cocción re­co­me­n­da­do; utilizar siempre en co­m­bi­na­ción con prepTime o totalTime
totalTime Duration Tiempo total de pre­pa­ra­ción y cocción del plato; indicado en formato ISO 8061 re­co­me­n­da­do; puedes er combinado con prepTime o cookTime
re­ci­pe­Yie­ld Text Cantidad de porciones re­su­l­ta­n­tes en la receta re­co­me­n­da­do
re­ci­peI­n­gre­die­nt Text In­gre­die­n­tes uti­li­za­dos en la receta re­co­me­n­da­do
re­ci­peI­n­s­tru­c­tio­ns Text In­s­tru­c­cio­nes para la receta re­co­me­n­da­do
nutrition.calories Energy Calorías de la receta re­co­me­n­da­do

Recuerda definir schema.org como vo­ca­bu­la­rio su­b­ya­ce­n­te (@context) y es­pe­ci­fi­car el tipo de contenido de la receta (@type). El script completo se verá de la siguiente manera: 

<script type="application/ld+json">    
{
    "@context": "http://schema.org/",
    "@type": "Recipe",
    "name": "Receta de pizza mozzarella",
    "image": "https://pixabay.com/photo-711662/",
    "author": {
        "@type": "Person",
        "name": "User"
    },
    "datePublished": "2016-08-05",
    "description": "Deliciosa receta de pizza mozzarella hecha con ingredientes frescos y sin complicaciones.",
    "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "5",
        "reviewCount": "52"
    },
    "prepTime": "PT20M",
    "totalTime": "PT60M",
    "recipeYield": "1 Persona",
    "nutrition": {
        "@type": "NutritionInformation",
        "calories": "900 cal"
    },
    "recipeIngredient": [
        "Ingredientes"
    ],
    "recipeInstructions": "Instrucciones"
}
</script>

Otra po­si­bi­li­dad consiste en recurrir a la he­rra­mie­n­ta de pruebas de datos es­tru­c­tu­ra­dos de Google para comprobar si hay errores en el marcado. Para iniciar la co­m­pro­ba­ción de tus datos solo tienes que in­tro­du­cir el fragmento JSON-LD o la dirección URL de tu proyecto web:

Imagen: Comprobación de errores con la herramienta de pruebas de datos estructurados de Google
La he­rra­mie­n­ta de pruebas de datos es­tru­c­tu­ra­dos de Google permite buscar errores en el marcado, fuente: https://search.google.com/stru­c­tu­red-data/testing-tool

Un clic en “Ejecutar prueba” iniciará el análisis. A co­n­ti­nua­ción, obtendrás un resumen claro del marcado de tus datos:

Imagen: Resumen del marcado de datos con la herramienta de pruebas de Google
Tras realizar el análisis, la he­rra­mie­n­ta mostrará un resumen del marcado de los datos

En el ejemplo, la he­rra­mie­n­ta no encuentra ningún error y pulsando el botón “Vista previa” obtendrás una pequeña pre­vi­sua­li­za­ción de la rich card. Sin embargo, Google indexará esta re­pre­se­n­ta­ción, por lo que el resultado final podría diferir de esta vista previa.

Ir al menú principal