Carruseles de datos estructurados (beta)

Google utiliza datos estructurados para comprender el contenido de las páginas y mostrarlo de forma atractiva en los resultados de búsqueda, lo que se conoce como resultados enriquecidos. Esta guía se centra en un nuevo resultado enriquecido de carrusel que está en versión beta. Se trata de un resultado enriquecido de tipo lista en la que los usuarios pueden desplazarse horizontalmente para ver más entidades de un sitio determinado (también se conoce como "carrusel de host"). Cada mosaico del carrusel puede contener información de tu sitio sobre el precio, la valoración y las imágenes de las entidades de la página.

Para poder optar a este resultado enriquecido en su versión beta, añade datos estructurados ItemList junto con al menos uno de los siguientes elementos de datos estructurados admitidos:

A continuación, se muestra el aspecto que pueden tener los carruseles en la Búsqueda de Google si se añaden etiquetas de ItemList junto con un tipo de contenido compatible:

Nuevo resultado enriquecido de carrusel

Añade datos estructurados

Los datos estructurados son un formato estandarizado con el que se puede proporcionar información sobre una página y clasificar su contenido. Consulta cómo funcionan los datos estructurados si aún no te has familiarizado con ellos.

A continuación, se muestra una descripción general de cómo añadir datos estructurados a tu sitio.

  1. Añade etiquetas a una sola página (también conocida como lista única todo en uno) que contenga toda la información de la lista, incluido el texto completo de cada elemento. Por ejemplo, una lista con los principales hoteles de una ubicación, todos en una sola página. Puedes combinar y hacer coincidir diferentes tipos de entidades (por ejemplo, hoteles y restaurantes) si es necesario en tu caso. Por ejemplo, si tienes una página que incluye eventos y empresas locales.
  2. Añade las propiedades obligatorias. Consulta más información sobre dónde insertar datos estructurados en una página en función del formato que estés utilizando.
  3. Añade las propiedades obligatorias y recomendadas para el tipo de contenido específico del carrusel:

    En función de tu caso, puedes elegir el tipo más adecuado. Por ejemplo, si tienes una lista de hoteles y alquileres vacacionales en tu página, usa los tipos Hotel y VacationRental. Aunque es ideal usar el tipo que mejor se adapte a tu situación, puedes elegir uno más genérico (por ejemplo, LocalBusiness).

  4. Sigue las directrices.
  5. Valida tu código con la prueba de resultados enriquecidos.
  6. Crea varias páginas que incluyan tus datos estructurados y comprueba cómo las ve Google con la herramienta de inspección de URLs. Asegúrate de que Google pueda acceder a tu página y de que no esté bloqueada por un archivo robots.txt, por la etiqueta noindex ni por requisitos de inicio de sesión. Si la página se ve bien, puedes solicitar que Google vuelva a rastrear tus URLs.
  7. Para que Google siempre tenga la versión actualizada de tus páginas, te recomendamos que envíes un sitemap. Puedes automatizar este envío con la API Sitemap de Search Console.

Directrices

Para que tu página pueda aparecer en resultados enriquecidos de carrusel, debes seguir las Directrices básicas de la Búsqueda y las directrices generales de datos estructurados. Además, se aplican las siguientes directrices a los resultados enriquecidos de carrusel:

  • Se permite el uso de tipos genéricos. Sin embargo, para usar las propiedades recomendadas, debes usar los tipos correspondientes. Por ejemplo, para usar amenityFeature, usa el tipo LodgingBusiness.
  • Se permite el uso de campos adicionales, pero es posible que no aparezcan en el resultado enriquecido.

Ejemplos

A continuación, se muestra una estructura general del carrusel. El orden especificado en las etiquetas es el que se usará para ordenar los mosaicos en el resultado enriquecido del carrusel.

  <html>
    <head>
      <title>Top 5 Restaurants in Italy</title>
      <script type="application/ld+json">
        {
        "@context": "https://schema.org",
        "@type": "ItemList",
          "itemListElement": [
            {
              "@type": "ListItem",
                "position": 1,
                "item": {
                  "@type": "Restaurant",
                  "name": "Trattoria Luigi",
                  "image": [
                    "https://example.com/photos/1x1/photo.jpg",
                    "https://example.com/photos/4x3/photo.jpg",
                    "https://example.com/photos/16x9/photo.jpg"
                  ],
                  "priceRange": "$$$",
                  "servesCuisine": "Italian",
                  "aggregateRating": {
                    "@type": "AggregateRating",
                    "ratingValue": 4.5,
                    "reviewCount": 250
                  },
                "url": "https://www.example.com/trattoria-luigi"
              }
            },
            {
              "@type": "ListItem",
                "position": 2,
                "item": {
                  "@type": "Restaurant",
                  "name": "La Pergola",
                  "image": [
                    "https://example.com/photos/1x1/photo.jpg",
                    "https://example.com/photos/4x3/photo.jpg",
                    "https://example.com/photos/16x9/photo.jpg"
                  ],
                  "priceRange": "$$$",
                  "servesCuisine": "Italian",
                  "aggregateRating": {
                    "@type": "AggregateRating",
                    "ratingValue": 4.9,
                    "reviewCount": 1150
                  },
                "url": "https://www.example.com/la-pergola"
              }
            },
            {
              "@type": "ListItem",
              "position": 3,
              "item": {
                "@type": "Restaurant",
                "name": "Pasta e Basta",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "priceRange": "$$$",
                "servesCuisine": "Italian",
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.2,
                  "reviewCount": 690
                },
              "url": "https://www.example.com/pasta-e-basta"
              }
            }
          ]
        }
      </script>
    </head>
    <body>
    </body>
  </html>
  

Definiciones de tipos de datos estructurados

Debes incluir las propiedades obligatorias para que tu contenido pueda mostrarse como un resultado enriquecido. Si quieres, puedes especificar también las propiedades recomendadas para proporcionar más información sobre tu contenido y, así, ofrecer una mejor experiencia de usuario.

ItemList

ItemList es el elemento que contiene todos los elementos de la lista. Todas las URLs de los elementos de la lista deben dirigir a diferentes páginas del mismo dominio.

Puedes consultar la definición completa de ItemList en schema.org/ItemList.

Propiedades obligatorias
itemListElement

ListItem

Es una lista de elementos. Para especificar una lista, define un valor ItemList que contenga al menos tres elementos itemListElement.item.

itemListElement.item

Subtipo de LocalBusiness, Product o Event

Indica un elemento concreto de una lista. Rellena este objeto con:

Ejemplo: Si se trata de un hotel, proporciona las propiedades priceRange y amenityFeature.

itemListElement.position

Integer

Indica la posición del elemento en el carrusel. Se trata de un número que tomará como referencia el 1.

Propiedades comunes de los elementos de lista (LocalBusiness, Product, o Event)

Todos los tipos de elementos de carrusel tienen en común las siguientes propiedades.

Propiedades obligatorias
image

Valores URL o ImageObject repetidos

Una o varias imágenes de la entidad o del artículo (por ejemplo, una imagen del hotel). No incluyas logotipos en esta propiedad de imagen.

Directrices de imágenes adicionales:

  • Cada página debe contener al menos una imagen (con o sin etiquetas). Google elegirá la mejor imagen para mostrarla en los resultados de búsqueda teniendo en cuenta su relación de aspecto y su resolución.
  • Las URLs de imagen deben poder rastrearse e indexarse. Comprueba que Google pueda acceder a tus URLs mediante la herramienta de inspección de URLs.
  • Las imágenes deben ser representativas del contenido etiquetado.
  • Las imágenes deben estar en un formato de archivo compatible con Google Imágenes.
  • Para obtener los mejores resultados, recomendamos proporcionar varias imágenes de alta resolución (mínimo de 50.000 píxeles al multiplicar la anchura y la altura) con las siguientes relaciones de aspecto: 16x9, 4x3 y 1x1.

Por ejemplo:

"image": [
  "https://example.com/photos/1x1/photo.jpg",
  "https://example.com/photos/4x3/photo.jpg",
  "https://example.com/photos/16x9/photo.jpg"
]
name

Text

El nombre de la cadena de la entidad o del elemento. Por ejemplo, el nombre de un hotel o una ficha de vacaciones. item.name aparece como título de un elemento concreto del carrusel. Se ignora el formato HTML.

url

URL

La URL canónica de la página de detalles del elemento (por ejemplo, el hotel o la ficha de vacaciones que aparece en esa página). Todas las URLs que aparecen en la lista deben ser únicas, pero tienen que pertenecer al mismo dominio o al mismo subdominio o superdominio que la página actual.

Propiedades recomendadas
aggregateRating.bestRating

Number

Indica el valor más alto permitido en este sistema de puntuación (por ejemplo, 5 / 10). Si se omite bestRating, se supone que es 5.

aggregateRating.ratingCount

Number

Indica el número total de valoraciones del artículo en tu sitio web.

aggregateRating.ratingValue

Number o Text

Indica la puntuación de la calidad del artículo en formato numérico, ya sea un número, una fracción o un porcentaje (como 4, 60% o 6 / 10). Google entiende la escala de fracciones y porcentajes, ya que la escala aparece en la propia fracción o en el porcentaje. La escala predeterminada de los números es de cinco puntos, donde 1 es el valor más bajo y 5 el más alto. Si quieres emplear otra escala, utiliza bestRating y worstRating.

En el caso de los números decimales, usa un punto en lugar de una coma para especificar el valor (por ejemplo, 4.4 en lugar de 4,4). En microdatos y RDFa, puedes usar atributos content para anular el contenido visible. De esta forma, puedes mostrar a los usuarios la convención de estilo que quieras y, al mismo tiempo, cumplir el requisito de puntos para datos estructurados. Ejemplo:

<span itemprop="ratingValue" content="4.4">4,4</span> stars

Definiciones adicionales de propiedades específicas de cada tipo

LocalBusiness (y subtipos)

Además de las propiedades ListItem, Google admite las siguientes propiedades LocalBusiness (incluidos sus subtipos) en los resultados enriquecidos de carrusel. Anida estas propiedades en itemListElement.item.

Propiedades recomendadas
amenityFeature

LocationFeatureSpecification

Solo para LodgingBusiness: una característica de los servicios del alojamiento (por ejemplo, una característica o un servicio).

"amenityFeature": {
  "@type": "LocationFeatureSpecification",
  "name" : "beachAccess",
  "value": true
}
priceRange

Text

El intervalo de precios relativo de una empresa, normalmente especificado por un número normalizado de símbolos de moneda. Indica el intervalo de precios en uno de los siguientes formatos:

  • Nivel de precios: por ejemplo, "$" o "$$", "$$$".
  • Rango: por ejemplo, "$-$$"

Este campo debe tener menos de 12 caracteres. Si tiene más, Google no incluirá ningún intervalo de precios junto a la empresa.

servesCuisine

Text

Solo para restaurantes: indica el tipo de cocina que se sirve en el restaurante.

Product

Además de las propiedades ListItem, Google admite las siguientes propiedades Product para los resultados enriquecidos de carrusel. Anida estas propiedades en itemListElement.item.

Propiedades recomendadas
offers

Offer o AggregateOffer

Indica valores Offer o AggregateOffer anidados para vender el producto. Incluye las propiedades recomendadas para Offer o AggregateOffer (según lo que corresponda a tu contenido.).

Si utilizas Offer, incluidas las siguientes propiedades:

  • offers.price
  • offers.priceCurrency

Si utilizas AggregateOffer, incluidas las siguientes propiedades:

  • offers.highPrice
  • offers.lowPrice
  • offers.priceCurrency
offers.highPrice

Number

Indica el precio más elevado de todas las ofertas disponibles. Si especificas un único precio con price, no es necesario que incluyas las propiedades highPrice y lowPrice.

offers.lowPrice

Number

Indica el precio más bajo de todas las ofertas disponibles. Si especificas un único precio con price, no es necesario que incluyas las propiedades highPrice y lowPrice.

offers.price

Number

El precio de oferta de un producto o de un componente de precio cuando se vincula a PriceSpecification y sus subtipos. Si especificas un intervalo de precios con lowPrice y highPrice, no incluyas la propiedad price.

offers.priceCurrency

Text

Indica la moneda en la que está el precio de un producto, en formato de tres letras ISO 4217. Si no se proporciona ninguna moneda, Google toma USD de forma predeterminada.

Event

Además de las propiedades ListItem, Google admite las siguientes propiedades Event para los resultados enriquecidos de carrusel. Anida estas propiedades en itemListElement.item.

Propiedades recomendadas
offers

Offer o AggregateOffer

Indica valores Offer o AggregateOffer anidados para vender el evento. Incluye las propiedades recomendadas para Offer o AggregateOffer (según lo que corresponda a tu contenido.).

Si utilizas Offer, incluidas las siguientes propiedades:

  • offers.price
  • offers.priceCurrency

Si utilizas AggregateOffer, incluidas las siguientes propiedades:

  • offers.highPrice
  • offers.lowPrice
  • offers.priceCurrency
offers.highPrice

Number

Indica el precio más elevado de todas las ofertas disponibles. Si especificas un único precio con price, no es necesario que incluyas las propiedades highPrice y lowPrice.

offers.lowPrice

Number

Indica el precio más bajo de todas las ofertas disponibles. Si especificas un único precio con price, no es necesario que incluyas las propiedades highPrice y lowPrice.

offers.price

Number

El precio de las entradas, incluidos los cargos y tarifas de gestión. No te olvides de irlo actualizando a medida que los precios cambien o que las entradas se agoten. Si especificas un intervalo de precios con lowPrice y highPrice, no incluyas la propiedad price.

Si el evento está disponible sin pagos, tarifas ni cargos por servicios, asigna el valor 0 a price.

"offers": {
  "@type": "Offer",
  "price": 0
}
offers.priceCurrency

Text

Indica la moneda en la que está el precio de un evento, en formato de tres letras ISO 4217. Si no se proporciona ninguna moneda, Google toma USD de forma predeterminada.

Ejemplos de situaciones habituales

Ejemplo de Restaurant

A continuación se muestra un ejemplo de un carrusel de restaurantes en JSON-LD.

<html>
    <head>
      <title>Top 5 Restaurants in Paris</title>
      <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "ItemList",
          "itemListElement": [
            {
              "@type": "ListItem",
              "position": 1,
              "item": {
                "@type": "Restaurant",
                "name": "Trattoria Luigi",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "priceRange": "$$$",
                "servesCuisine": "Italian",
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.5,
                  "reviewCount": 250
                },
                "url": "https://www.example.com/restaurant-location-1"
              }
            },
            {
              "@type": "ListItem",
              "position": 2,
              "item": {
                "@type": "Restaurant",
                "name": "La Pergola",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "priceRange": "$$$",
                "servesCuisine": "Italian",
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.9,
                  "reviewCount": 1150
                },
                "url": "https://www.example.com/restaurant-location-2"
              }
            },
            {
              "@type": "ListItem",
              "position": 3,
              "item": {
                "@type": "Restaurant",
                "name": "Pasta e Basta",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "priceRange": "$$$",
                "servesCuisine": "Italian",
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.2,
                  "reviewCount": 690
                },
                "url": "https://www.example.com/restaurant-location-3"
              }
            }
          ]
        }
      </script>
    </head>
    <body>
    </body>
  </html>

Ejemplo de alojamiento (Hotels y VacationRental)

A continuación se muestra un ejemplo de un carrusel de alojamiento en JSON-LD.

<html>
    <head>
      <title>Top 5 Hotels in Paris</title>
      <script type="application/ld+json">
        {
        "@context": "https://schema.org",
        "@type": "ItemList",
            "itemListElement": [
              {
                "@type": "ListItem",
                "position": 1,
                "item": {
                  "@type": "Hotel",
                  "name": "Four Seasons Hotel George V, Paris",
                  "image": [
                    "https://example.com/photos/1x1/photo.jpg",
                    "https://example.com/photos/4x3/photo.jpg",
                    "https://example.com/photos/16x9/photo.jpg"
                  ],
                  "priceRange": "$$$$",
                  "amenityFeature": {
                      "@type": "LocationFeatureSpecification",
                      "name" : "internetType",
                      "value": "Free"
                  },
                  "aggregateRating": {
                    "@type": "AggregateRating",
                    "ratingValue": 4.9,
                    "reviewCount": 50
                  },
                  "url": "https://www.example.com/four-seasons"
                }
              },
              {
                "@type": "ListItem",
                "position": 2,
                "item": {
                  "@type": "VacationRental",
                  "name": "Downtown Condo",
                  "image": [
                    "https://example.com/photos/1x1/photo.jpg",
                    "https://example.com/photos/4x3/photo.jpg",
                    "https://example.com/photos/16x9/photo.jpg"
                  ],
                  "priceRange": "$$",
                  "amenityFeature": {
                    "@type": "LocationFeatureSpecification",
                    "name" : "instantBookable",
                    "value": true
                  },
                  "aggregateRating": {
                    "@type": "AggregateRating",
                    "ratingValue": 4.7,
                    "reviewCount": 827
                  },
                  "url": "https://www.example.com/downtown-condo"
                }
              },
              {
                "@type": "ListItem",
                "position": 3,
                "item": {
                  "@type": "Hotel",
                  "name": "Ritz Paris",
                  "image": [
                    "https://example.com/photos/1x1/photo.jpg",
                    "https://example.com/photos/4x3/photo.jpg",
                    "https://example.com/photos/16x9/photo.jpg"
                  ],
                  "priceRange": "$$$$",
                  "amenityFeature": {
                    "@type": "LocationFeatureSpecification",
                    "name" : "freeBreakfast",
                    "value": true
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.9,
                  "reviewCount": 1290
                },
                "url": "https://www.example.com/ritz-paris"
              }
            }
          ]
        }
      </script>
    </head>
    <body>
    </body>
  </html>

Ejemplo de Qué hacer

A continuación se muestra un ejemplo de un carrusel de Qué hacer en JSON-LD.

<html>
    <head>
      <title>Top 5 Things To Do in Paris</title>
      <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "ItemList",
          "itemListElement": [
            {
              "@type": "ListItem",
              "position": 1,
              "item": {
                "@type": "Event",
                "name": "Paris Seine River Dinner Cruise",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "offers": {
                  "@type": "Offer",
                  "price": 45.00,
                  "priceCurrency": "EUR"
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.2,
                  "reviewCount": 690
                },
                "url": "https://www.example.com/event-location1"
              }
            },
            {
              "@type": "ListItem",
              "position": 2,
              "item": {
                "@type": "LocalBusiness",
                "name": "Notre-Dame Cathedral",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "priceRange": "$",
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.8,
                  "reviewCount": 4220
                },
                "url": "https://www.example.com/localbusiness-location"
              }
            },
            {
              "@type": "ListItem",
              "position": 3,
              "item": {
                "@type": "Event",
                "name": "Eiffel Tower With Host Summit Tour",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "offers": {
                  "@type": "Offer",
                  "price": 59.00,
                  "priceCurrency": "EUR"
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.9,
                  "reviewCount": 652
                },
                "url": "https://www.example.com/event-location2"
              }
            }
          ]
        }
      </script>
    </head>
    <body>
    </body>
  </html>
  

Ejemplo de Product

A continuación se muestra un ejemplo de un carrusel de productos en JSON-LD.

<html>
    <head>
      <title>Top coats of the season</title>
      <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "ItemList",
          "itemListElement": [
            {
              "@type": "ListItem",
              "position": 1,
              "item": {
                "@type": "Product",
                "name": "Puffy Coat Series by Goat Coat",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "offers": {
                  "@type": "AggregateOffer",
                  "lowPrice": 45.00,
                  "highPrice": 60.00,
                  "priceCurrency": "EUR"
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.9,
                  "reviewCount": 50
                },
                "url": "https://www.example.com/puffy-coats"
              }
            },
            {
              "@type": "ListItem",
              "position": 2,
              "item": {
                "@type": "Product",
                "name": "Wool Coat Series by Best Coats Around",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "offers": {
                  "@type": "AggregateOffer",
                  "lowPrice": 189.00,
                  "highPrice": 200.00,
                  "priceCurrency": "EUR"
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.7,
                  "reviewCount": 827
                },
                "url": "https://www.example.com/wool-coats"
              }
            },
            {
              "@type": "ListItem",
              "position": 3,
              "item": {
                "@type": "Product",
                "name": "Antartic Coat by Cold Coats",
                "image": [
                  "https://example.com/photos/1x1/photo.jpg",
                  "https://example.com/photos/4x3/photo.jpg",
                  "https://example.com/photos/16x9/photo.jpg"
                ],
                "offers": {
                  "@type": "Offer",
                  "price": 45.00,
                  "priceCurrency": "EUR"
                },
                "aggregateRating": {
                  "@type": "AggregateRating",
                  "ratingValue": 4.9,
                  "reviewCount": 1290
                },
                "url": "https://www.example.com/antartic-coat"
              }
            }
          ]
        }
      </script>
    </head>
    <body>
    </body>
  </html>
  

Solucionar problemas

Si tienes problemas para implementar o depurar datos estructurados, a continuación se incluyen algunos recursos que pueden serte útiles.