Caroselli

Un carosello è un risultato multimediale simile a un elenco che gli utenti possono scorrere sui dispositivi mobili. Il carosello visualizza più schede dello stesso sito (noto anche come carosello host). Per attivare un carosello per il tuo sito, aggiungi i dati strutturati Carousel in combinazione con uno dei seguenti tipi di contenuti supportati:

Ecco come possono apparire i caroselli nella Ricerca Google quando aggiungi il markup Carousel in combinazione con un tipo di contenuti supportato:

Esempi di carosello host di ricette, carosello host di corsi e carosello host
      di film in Ricerca Google

Aggiungere dati strutturati

I dati strutturati sono un formato standardizzato per fornire informazioni su una pagina e classificarne i contenuti. Se non li hai mai utilizzati, leggi ulteriori informazioni su come funzionano i dati strutturati.

Ecco una panoramica su come aggiungere dati strutturati al tuo sito:

  1. Decidi quale pagina conterrà i dati strutturati Carousel. Le opzioni disponibili sono due:
    • Pagina di riepilogo e diverse pagine dei dettagli: la pagina di riepilogo contiene una breve descrizione di ogni elemento dell'elenco e ogni descrizione rimanda a una pagina dei dettagli separata, incentrata interamente su un elemento. Ad esempio, una pagina di riepilogo che elenca le migliori ricette di biscotti in cui ogni descrizione rimanda alla ricetta completa.
    • Un'unica pagina elenco: una singola pagina contenente tutte le informazioni dell'elenco, incluso il testo completo di ogni elemento. Ad esempio, un elenco dei film più popolari del 2020, tutti contenuti in un'unica pagina.
  2. Aggiungi le proprietà obbligatorie. Per informazioni su dove inserire i dati strutturati nella pagina, guarda il video "JSON-LD structured data: Where to insert on the page".
  3. Aggiungi le proprietà obbligatorie e consigliate per il tipo di contenuti specifico di cui tratta Carousel:
  4. Segui le linee guida.

Pagina di riepilogo e diverse pagine dei dettagli

La pagina di riepilogo contiene una breve descrizione di ciascun elemento dell'elenco. Ogni descrizione indirizza a una pagina dei dettagli separata, focalizzata interamente su un elemento.

Pagina di riepilogo

La pagina di riepilogo definisce un ItemList, dove ogni ListItem ha solo tre proprietà: @type (impostato su "ListItem"), position (la posizione nell'elenco) e url (l'URL di una pagina con i dettagli completi dell'elemento).

Ecco un esempio di come si presenta la pagina di riepilogo:


<html>
  <head>
    <title>Best cookie recipes</title>
    <script type="application/ld+json">
    {
      "@context":"https://schema.org",
      "@type":"ItemList",
      "itemListElement":[
        {
          "@type":"ListItem",
          "position":1,
          "url":"http://example.com/peanut-butter-cookies.html"
        },
        {
          "@type":"ListItem",
          "position":2,
          "url":"http://example.com/triple-chocolate-chunk.html"
        },
        {
          "@type":"ListItem",
          "position":3,
          "url":"http://example.com/snickerdoodles.html"
        }
      ]
    }
    </script>
  </head>
  <body>
    <p>
      Here are the best cookie recipes of all time.
    </p>
    <h2>
      Peanut Butter Cookies
    </h2>
    <p>
      This <a href="https://example.com/peanut-butter-cookies.html">Peanut Butter Cookie recipe</a> is the tastiest one you'll find.
    </p>
    <h2>
      Triple Chocolate Chunk Cookies
    </h2>
    <p>
      This <a href="https://example.com/triple-chocolate-chunk.html">Triple Chocolate Chunk Cookies recipe</a> is the tastiest one you'll find.
    </p>
    <h2>
      Snickerdoodles
    </h2>
    <p>
      This <a href="https://example.com/snickerdoodles.html">Snickerdoodles recipe</a> is the tastiest one you'll find.
    </p>
  </body>
</html>

Pagina dei dettagli

La pagina dei dettagli definisce il tipo di dati strutturati specifico di cui tratta Carousel. Ad esempio, se la pagina di riepilogo riguarda le migliori ricette di biscotti, ogni pagina dei dettagli conterrebbe dati strutturati Recipe per una ricetta specifica.

Ecco un esempio di come appaiono le pagine dei dettagli:

Biscotti al burro di arachidi


<html>
  <head>
    <title>Peanut Butter Cookies</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Peanut Butter Cookies",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
      ],
      "author": {
        "@type": "Person",
        "name": "Wendy Darling"
      },
      "datePublished": "2018-03-10",
      "description": "This Peanut Butter Cookie recipe is everyone's favorite",
      "prepTime": "PT10M",
      "cookTime": "PT25M",
      "totalTime": "PT35M",
      "recipeCuisine": "French",
      "recipeCategory": "Cookies",
      "keywords": "peanut butter, cookies",
      "recipeYield": "24",
      "nutrition": {
        "@type": "NutritionInformation",
        "calories": "120 calories"
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "5",
        "ratingCount": "18"
      },
      "recipeIngredient": [
        "2 cups of peanut butter",
        "1/3 cup of sugar"
      ],
      "recipeInstructions": [
        {
          "@type": "HowToStep",
          "text": "Mix together the peanut butter and sugar."
        },
        {
          "@type": "HowToStep",
          "text": "Roll cookie dough into small balls and place on a cookie sheet."
        },
        {
          "@type": "HowToStep",
          "text": "Bake for 25 minutes."
        }
      ],
      "video": {
        "@type": "VideoObject",
        "name": "How to Peanut Butter Cookies",
        "description": "This is how you make peanut butter cookies.",
        "thumbnailUrl": [
          "https://example.com/photos/1x1/photo.jpg",
          "https://example.com/photos/4x3/photo.jpg",
          "https://example.com/photos/16x9/photo.jpg"
         ],
        "contentUrl": "http://www.example.com/video123.mp4",
        "embedUrl": "http://www.example.com/videoplayer?video=123",
        "uploadDate": "2018-02-05T08:00:00+08:00",
        "duration": "PT1M33S",
        "interactionStatistic": {
          "@type": "InteractionCounter",
          "interactionType": { "@type": "http://schema.org/WatchAction" },
          "userInteractionCount": 2347
        },
        "expires": "2019-02-05T08:00:00+08:00"
       }
    }
    </script>
  </head>
  <body>
    <p>
      Here's how to make peanut butter cookies.
    </p>
    <ol>
      <li>Mix together the peanut butter and sugar.</li>
      <li>Roll cookie dough into small balls and place on a cookie sheet.</li>
      <li>Bake for 25 minutes.</li>
    </ol>
  </body>
</html>

Biscotti con gocce di cioccolato


<html>
  <head>
    <title>Triple Chocolate Chunk Cookies</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Triple Chocolate Chunk Cookies",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
      ],
      "author": {
        "@type": "Person",
        "name": "Wendy Darling"
      },
      "datePublished": "2018-03-10",
      "description": "This Triple Chocolate Chunk Cookie recipe is everyone's favorite",
      "prepTime": "PT10M",
      "cookTime": "PT25M",
      "totalTime": "PT35M",
      "recipeCuisine": "French",
      "recipeCategory": "Cookies",
      "keywords": "chocolate, cookies",
      "recipeYield": "24",
      "nutrition": {
        "@type": "NutritionInformation",
        "calories": "120 calories"
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "5",
        "ratingCount": "18"
      },
      "recipeIngredient": [
        "2 cups of melted chocolate",
        "1/3 cup of sugar"
      ],
      "recipeInstructions": [
        {
          "@type": "HowToStep",
          "text": "Mix together the chocolate and sugar."
        },
        {
          "@type": "HowToStep",
          "text": "Roll cookie dough into small balls and place on a cookie sheet."
        },
        {
          "@type": "HowToStep",
          "text": "Bake for 25 minutes."
        }
      ],
      "video": {
        "@type": "VideoObject",
        "name": "How to Triple Chocolate Chunk Cookies",
        "description": "This is how you make peanut butter cookies.",
        "thumbnailUrl": [
          "https://example.com/photos/1x1/photo.jpg",
          "https://example.com/photos/4x3/photo.jpg",
          "https://example.com/photos/16x9/photo.jpg"
         ],
        "contentUrl": "http://www.example.com/video123.mp4",
        "embedUrl": "http://www.example.com/videoplayer?video=123",
        "uploadDate": "2018-02-05T08:00:00+08:00",
        "duration": "PT1M33S",
        "interactionStatistic": {
          "@type": "InteractionCounter",
          "interactionType": { "@type": "http://schema.org/WatchAction" },
          "userInteractionCount": 2347
        },
        "expires": "2019-02-05T08:00:00+08:00"
       }
    }
    </script>
  </head>
  <body>
    <p>
      Here's how to make Triple Chocolate Chunk Cookies.
    </p>
    <ol>
      <li>Mix together the chocolate and sugar.</li>
      <li>Roll cookie dough into small balls and place on a cookie sheet.</li>
      <li>Bake for 25 minutes.</li>
    </ol>
  </body>
</html>

Biscotti alla cannella


<html>
  <head>
    <title>Snickerdoodles</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Recipe",
      "name": "Snickerdoodles",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
      ],
      "author": {
        "@type": "Person",
        "name": "Wendy Darling"
      },
      "datePublished": "2018-03-10",
      "description": "This Snickerdoodles recipe is everyone's favorite",
      "prepTime": "PT10M",
      "cookTime": "PT25M",
      "totalTime": "PT35M",
      "recipeCuisine": "French",
      "recipeCategory": "Cookies",
      "keywords": "cinnamon sugar, cookies",
      "recipeYield": "24",
      "nutrition": {
        "@type": "NutritionInformation",
        "calories": "120 calories"
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "5",
        "ratingCount": "18"
      },
      "recipeIngredient": [
        "2 cups of cinnamon",
        "1/3 cup of sugar"
      ],
      "recipeInstructions": [
        {
          "@type": "HowToStep",
          "text": "Mix together the cinnamon and sugar."
        },
        {
          "@type": "HowToStep",
          "text": "Roll cookie dough into small balls and place on a cookie sheet."
        },
        {
          "@type": "HowToStep",
          "text": "Bake for 25 minutes."
        }
      ],
      "video": {
        "@type": "VideoObject",
        "name": "How to Snickerdoodles",
        "description": "This is how you make snickerdoodles.",
        "thumbnailUrl": [
          "https://example.com/photos/1x1/photo.jpg",
          "https://example.com/photos/4x3/photo.jpg",
          "https://example.com/photos/16x9/photo.jpg"
         ],
        "contentUrl": "http://www.example.com/video123.mp4",
        "embedUrl": "http://www.example.com/videoplayer?video=123",
        "uploadDate": "2018-02-05T08:00:00+08:00",
        "duration": "PT1M33S",
        "interactionStatistic": {
          "@type": "InteractionCounter",
          "interactionType": { "@type": "http://schema.org/WatchAction" },
          "userInteractionCount": 2347
        },
        "expires": "2019-02-05T08:00:00+08:00"
       }
    }
    </script>
  </head>
  <body>
    <p>
      Here's how to make snickerdoodles.
    </p>
    <ol>
      <li>Mix together the cinnamon and sugar.</li>
      <li>Roll cookie dough into small balls and place on a cookie sheet.</li>
      <li>Bake for 25 minutes.</li>
    </ol>
  </body>
</html>

Un'unica pagina elenco

Un'unica pagina elenco ospita tutte le informazioni del carosello, incluso il testo completo di ogni elemento. Ad esempio, un elenco dei film più popolari del 2020, tutti contenuti in un'unica pagina. Questa pagina non rimanda ad altre pagine dei dettagli.

Ecco un esempio di un'unica pagina elenco:


<html>
  <head>
    <title>The Best Movies from the Oscars - 2018</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "ItemList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "position": "1",
          "item": {
            "@type": "Movie",
            "url": "https://example.com/2019-best-picture-noms#a-star-is-born",
            "name": "A Star Is Born",
            "image": "https://example.com/photos/6x9/photo.jpg",
            "dateCreated": "2018-10-05",
            "director": {
                "@type": "Person",
                "name": "Bradley Cooper"
              },
            "review": {
              "@type": "Review",
              "reviewRating": {
                "@type": "Rating",
                "ratingValue": "5"
              },
              "author": {
                "@type": "Person",
                "name": "John D."
              },
              "reviewBody": "Heartbreaking, inpsiring, moving. Bradley Cooper is a triple threat."
              },
              "aggregateRating": {
                "@type": "AggregateRating",
                "ratingValue": "90",
                "bestRating": "100",
                "ratingCount": "19141"
              }
            }
          },
        {
          "@type": "ListItem",
          "position": "2",
          "item": {
            "@type": "Movie",
            "name": "Bohemian Rhapsody",
            "url": "https://example.com/2019-best-picture-noms#bohemian-rhapsody",
            "image": "https://example.com/photos/6x9/photo.jpg",
            "dateCreated": "2018-11-02",
            "director": {
                "@type": "Person",
                "name": "Bryan Singer"
              },
            "review": {
              "@type": "Review",
              "reviewRating": {
                "@type": "Rating",
                "ratingValue": "3"
              },
              "author": {
                "@type": "Person",
                "name": "Vin S."
              },
              "reviewBody": "Rami Malek's performance is overrated, at best."
              },
              "aggregateRating": {
                "@type": "AggregateRating",
                "ratingValue": "61",
                "bestRating": "100",
                "ratingCount": "21985"
              }
            }
          },
        {
          "@type": "ListItem",
          "position": "3",
          "item": {
            "@type": "Movie",
            "name": "Black Panther",
            "url": "https://example.com/2019-best-picture-noms#black-panther",
            "image": "https://example.com/photos/6x9/photo.jpg",
            "dateCreated": "2018-02-16",
            "director": {
                "@type": "Person",
                "name": "Ryan Coogler"
              },
            "review": {
              "@type": "Review",
              "reviewRating": {
                "@type": "Rating",
                "ratingValue": "2"
              },
              "author": {
                "@type": "Person",
                "name": "Trevor R."
              },
              "reviewBody": "I didn't like the lighting and CGI in this movie."
              },
              "aggregateRating": {
                "@type": "AggregateRating",
                "ratingValue": "96",
                "bestRating": "100",
                "ratingCount": "88211"
              }
            }
          }
      ]
    }
    </script>
  </head>
  <body>
  </body>
</html>

Linee guida

Oltre alle linee guida generali sui dati strutturati, ai dati strutturati Carousel si applicano le seguenti linee guida:

  • Tutti gli elementi nell'elenco devono essere dello stesso tipo. Ad esempio, se un elenco contiene ricette, includi solo elementi Recipe. Non mettere insieme tipi diversi.
  • Assicurati che i dati strutturati Carousel siano completi e contengano tutti gli elementi elencati nella pagina.
  • Il testo visibile all'utente deve essere simile alle informazioni contenute nei dati strutturati sulla pagina.
  • Gli elementi mostrati in formato elenco verranno mostrati nell'ordine specificato dalla proprietà position.

Convalidare ed eseguire il deployment dei dati strutturati

  1. Convalida il codice utilizzando lo strumento di Test dei risultati multimediali. Per una pagina di riepilogo, devi eseguire alcune verifiche:
    • Verifica che itemListElement contenga due o più elementi ListItem.
    • Assicurati che tutti gli elementi ListItem siano dello stesso tipo (ad esempio, riguardino tutti ricette).
    • Convalida ogni URL menzionato nell'elenco utilizzando lo strumento di Test dei risultati multimediali. Ogni pagina dell'elenco deve contenere dati strutturati validi, in base alla documentazione relativa al tipo di contenuti supportati inclusi nell'elenco: Recipe, Course, Restaurant, Movie.
  2. Esegui il deployment di alcune pagine che includono dati strutturati e utilizza lo strumento Controllo URL per verificare come Google vede la pagina. Assicurati che la pagina sia accessibile per Google e che non venga bloccata da file robots.txt, tag noindex o requisiti di accesso. Se la pagina non sembra presentare problemi, puoi chiedere a Google di ripetere la scansione degli URL.
  3. Per tenere Google informata delle future modifiche, ti consigliamo di inviare una Sitemap. Puoi automatizzare questa operazione con l'API Search Console Sitemap.

Definizioni dei tipi di dati strutturati

Per specificare un elenco, definisci un ItemList che contenga almeno due ListItems. Affinché i tuoi contenuti siano idonei per essere visualizzati come risultato multimediale, devi includere le proprietà obbligatorie.

ItemList

ItemList è l'elemento contenitore che include tutti gli elementi nell'elenco. Se utilizzato in una pagina di riepilogo, tutti gli URL nell'elenco devono puntare a pagine diverse dello stesso dominio. Se utilizzato in un'unica pagina elenco, tutti gli URL devono rimandare a un anchor sulla pagina che ospita i dati strutturati dell'elenco.

La definizione completa di ItemList è disponibile all'indirizzo schema.org/ItemList.

Proprietà obbligatorie
itemListElement

ListItem

Elenco di elementi. Tutti gli elementi devono essere dello stesso tipo. Per ulteriori dettagli, consulta ListItem.

ListItem

ListItem contiene i dettagli su un singolo elemento nell'elenco.

  • Se si tratta di una pagina di riepilogo, includi solo le proprietà type, position e url in ListItem.
  • Se si tratta di un'unica pagina elenco, includi tutte le proprietà di schema.org aggiuntive per il tipo di dati descritto. I tipi di dati supportati sono:

La definizione completa di ListItem è disponibile all'indirizzo schema.org/ListItem.

Pagine di riepilogo

Le seguenti proprietà si applicano alle pagine di riepilogo:

Proprietà obbligatorie
position

Integer

La posizione dell'elemento nel carosello. È un numero in base uno.

url

URL

L'URL canonico della pagina dei dettagli elemento. Tutti gli URL nell'elenco devono essere univoci, ma attivi nello stesso dominio (lo stesso dominio, dominio secondario o superdominio della pagina corrente).

Pagine elenco uniche

Le seguenti proprietà si applicano alle pagine elenco uniche:

Proprietà obbligatorie
item

Thing

Una sola cosa in un elenco. Compila questo oggetto con i seguenti valori, oltre a tutte le proprietà del tipo specifico di dati strutturati da descrivere:

  • item.name
  • item.url
  • Qualsiasi altra proprietà obbligatoria per questo tipo di dati, come descritto in schema.org, e le regole descritte in questi documenti per il tipo di contenuti: Esempio: per una ricetta, devi fornire le proprietà prepTime e image.
item.name

Text

Il nome della stringa dell'elemento. item.name viene visualizzato come titolo di un singolo elemento nel carosello. La formattazione HTML viene ignorata.

item.url

URL

L'URL completo e l'anchor della pagina a questo elemento della pagina. L'URL deve essere la pagina corrente e devi includere un anchor HTML (il tag <a> o il valore name o id) nella tua pagina accanto al testo visibile dall'utente. Esempio: https://example.org/recipes/pies#apple_pie.

position

Integer

La posizione dell'elemento nel carosello. È un numero in base uno.

Risolvere i problemi

Se hai difficoltà con l'implementazione dei dati strutturati, ecco alcune risorse che potrebbero esserti utili.