Rich Cards

Las Rich Cards son una opción de visualización de contenido específico en la búsqueda de Google para móviles. Un webmaster puede elegir este tipo de presentación marcando el contenido como recetas y películas con el formato JSON-LD. El contenido se mostrará en un formato visual que mejora la experiencia e interacción del usuario móvil. Las rich cards pueden ser vistas como una evolución de rich snippets y construir sobre el vocabulario de Schema.org. Por lo tanto, son un marcado semántico que da a los usuarios móviles una primera impresión visual del contenido.

Información general

Con frecuencia, Google está probando nuevas variaciones de visualización en su búsqueda. En el contexto de la búsqueda móvil y el creciente número de usuarios de dispositivos móviles, las rich cards son un desarrollo que complementa la reorientación de Google. El lema es “el móvil primero”. Trabajando con Páginas Móviles Aceleradas (AMP), las formas de visualización de las rich cards pueden ser ampliadas. Actualmente se muestran en un formato de carrusel de Facebook. El formato visual enriquecido se puede controlar fácilmente desplazándose y deslizando para que las imágenes y el contenido se puedan ver fácilmente en los dispositivos móviles. Las rich cards se introducen con un enfoque en la experiencia del usuario móvil que puede mejorarse con tecnología como AMP u optimización móvil[1].

Los webmasters y los propietarios de sitios tienen la oportunidad de ofrecer su contenido de nuevas maneras con las rich cards y promover a ciertos grupos target debido al formato de visualización modificado. Por ejemplo, a grupos objetivo más jóvenes que muestran una gran afinidad por los dispositivos móviles. Hasta 2016, el margen de beneficio adecuado sólo estaba disponible para recetas y películas y sólo para la versión en inglés de Google. Las herramientas de desarrollo habituales, como la documentación detallada para datos estructurados, una conexión a una API y una herramienta de pruebas de datos estructurados, están disponibles para la integración de rich cards[2]. Esto es para apoyar a los webmasters y operadores con la implementación. También incluye la integración de la supervisión del rendimiento.

Operación

Las rich cards se integran utilizando una notación JavaScript que utiliza el formato recomendado JSON-LD para poder procesarlas automáticamente después de la marcación a través de datos enlazados y mostrarlas en las listas de resultados de Google para móviles[3].

<script type="application/ld+json">The rich cards code is written here.</script>

En una receta, por ejemplo, los metadatos siguen el contexto de Schema.org para especificar el vocabulario utilizado, así como información sobre derechos de autor, descripciones y reseñas. El comienzo de una rich card puede tener el siguiente aspecto:

<script type="application/ld+json">{
  "@context": "http://schema.org/",
  "@type": "Recipe",
  "name": "Perfect Apple Pie",
  "author": "Gin Blanco",
  "image": "http://images.edge-generalmills.com/56459281-6fe6-4d9d-984f-385c9488d824.jpg",
  "description": "A classic apple pie takes a shortcut with easy Pillsbury® unroll-fill refrigerated pie crust.",
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.5",
    "reviewCount": "276",
    "bestRating": "5",
    "worstRating": "1"
  },</script>

Una coma separa los bloques de código y los campos de datos y atributos del grupo de corchetes. Posteriormente, se pueden utilizar muchos campos y atributos diferentes, incluyendo, por ejemplo, información nutricional (nutrition), ingredientes (recipeIngredient) y una guía (recipeInstructions). Después de la coma, otros campos de datos son posibles:

"prepTime": "PT30M",
  "totalTime": "PT3H",
  "recipeYield": "8",
  "nutrition": {
    "@type": "NutritionInformation",
    "servingSize": "1 medium slice",
    "calories": "230 calories",
    "fatContent": "1 g",
    "carbohydrateContent": "43 g",
    "cholesterolContent": "0 mg",
    "fiberContent": "1 g",
    "proteinContent": "1 g",
    "saturatedFatContent": "2 ½ g",
    "servingSize": "1 Serving",
    "sodiumContent": "200 mg",
    "sugarContent": "27 g",
    "transFatContent": "0 g"
  },
  "recipeIngredient": [
    "1 box Pillsbury™ refrigerated pie crusts, softened as directed on box",
    "6 cups thinly sliced, peeled apples (6 medium)",
    "3/4 cup sugar",
    "2 tablespoons all-purpose flour",
    "3/4 teaspoon ground cinnamon",
    "1/4 teaspoon salt",
    "1/8 teaspoon ground nutmeg",
    "1 tablespoon lemon juice"
  ],
  "recipeInstructions": [
    "First step",
    "Second step",
    "Third step"
   ]
}</script>

Otros campos y propiedades están disponibles para marcar rich cards para películas.

Relevancia práctica

• Google recomienda a los webmasters que exploren los posibles campos de datos y atributos que se pueden marcar utilizando el formato JSON-LD y que son compatibles con Google.
• Se puede ver una vista previa en la herramienta de pruebas de datos estructurados una vez que se ha referenciado una URL que utiliza código fuente JSON-LD. Es posible representar rich cards desde una URL o desde diferentes URLs en formato carrusel.
• Puede averiguar si un archivo de rich cards es válido con la herramienta de prueba de datos estructurados. Representa la rich cards de tal manera que se emiten todos los campos de datos y marcas de revisión seleccionados y se muestran todos los avisos y errores. La validez es un prerrequisito para que las rich cards se muestren en los SERPs.
• Puede obtener información sobre las rich cards y cómo se indexan en la Consola de Búsqueda de Google. Si hay algún error, se enlazan directamente con la herramienta de pruebas, por lo que se pueden corregir.
• Además, Google recomienda que cree un sitemap para todo el contenido marcado. De esta manera, pueden ser indexados más fácilmente por Google[4].

Los valores de rendimiento para las diferentes rich cards se deben proporcionar en la pestaña Resultados enriquecidos de la Consola de búsqueda, por ejemplo, la tasa de clics y las impresiones. Cómo impactan las rich card en el rendimiento de los dispositivos móviles, se puede ver en estos informes[5].

Relevancia para el SEO

Las rich cards son otro paso hacia una web semántica. Debido al hecho de que se basan en rich snippets, los formatos anteriores no son redundantes y todavía se pueden utilizar. Esta es una ventaja significativa de los formatos JSON-LD que son compatibles con los formatos RDFa, por ejemplo. Para los proveedores de ciertos tipos de contenido, las rich cards son una forma de atraer la atención del cliente potencial a través de los SERPs móviles. Actualmente, los sitios web de recetas, instrucciones para cocinar y hornear, y los sitios de reseñas de películas tienen esta opción. Se espera que surjan más formatos de contenido en un futuro no muy lejano. Google mismo sugiere que el entorno técnico seguirá evolucionando para las rich cards.

References

[1] [2] [3] [4] [5]