Guida-twitter-cards

Guida alle Twitter Cards: come aggiungerle e creare engagement sul tuo blog

107 Flares Twitter 45 Facebook 15 Google+ 30 Pin It Share 0 LinkedIn 6 Buffer 11 107 Flares ×

Le Twitter cards sono una funzionalità di Twitter per aggiungere multimedialità e arricchire i contenuti condivisi nei tweet.

Come per le immagini e i video, che possono vedersi grazie agli expanded tweet direttamente nella timeline, con le cards puoi ottenere lo stesso effetto su altre tipologie di contenuti.

Vediamo subito un esempio per capire di cosa sto parlando:

Come vedi, il contenuto di un semplice link condiviso può essere visualizzato in anteprima direttamente nel tweet e quindi nella timeline, senza dover lasciare Twitter. In questo modo, un tweet testuale acquista un potere comunicativo decisamente più forte: il titolo, l’immagine, le prime righe di un articolo sono tutti elementi che contribuiscono ad accendere la curiosità di chi ti segue e ad invogliarlo a cliccare sul link per saperne di più. Un’opportunità eccezionale offerta da Twitter per creare coinvolgimento intorno a contenuti che non nascono visuali, come ad esempio i post di un blog.

Come ho fatto ad ottenere questo effetto sul mio blog? Implementando il codice delle Twitter Cards negli articoli!

cards twitter metatag

Com’è fatto il codice delle Twitter Cards

Complicato? Niente affato: in questa piccola guida vediamo subito come  puoi integrare in pochi passaggi quest’ottima funzionalità anche nel tuo blog.

Come aggiungere le Twitter Cards al tuo blog

Twitter dedica un’ampia sezione all’implementazione manuale delle Twitter Cards con tutta la documentazione tecnica. Il principo è molto semplice: aggiungendo i metatag per le cards nel codice html del tuo sito, per ciascun articolo, puoi avere l’anteprima dei tuoi contenuti nei tweet. Sono tantissimi i siti che già li implementano, quelli che ne fanno un uso molto significativo sono le testate giornalistiche, news online e blog del settore. Ad esempio, se hai un blog su WordPress.com lo fa in automatico:

Se hai un tuo blog in WordPress e vuoi optare per la soluzione più semplice, puoi utilizzare dei plugin che implementeranno per te il codice necessario. Vediamone due.

Twitter Cards con WordPress SEO di Yoast

Se utilizzi già il plugin WordPress SEO di Yoast, puoi abilitare le Twitter Cards in pochi click. Basta andare nel pannello di configurazione >sezione social > Twitter e spuntare la casella “Aggiungere i metadati per la scheda di Twitter“:

Configurare WP SEO Yoast Twitter

Configurazione Twitter Cards su WP SEO di Yoast

Questo fa sì che in automatico vengano aggiunti i metatag delle cards.

Twitter Cards in WordPress: altri plugin

Se non utilizzi WordPress SEO e il tuo plugin con cui gestisci i metatag non supporta le Twitter Cards, puoi utilizzare altri plugin gratuiti. Io ti consiglio JM Twitter Cards: questo plugin, compatibile con WP SEO e All in One SEO, ti permette di configurare le Twitter Cards e personalizzarle per ciascun post senza doverle implementare da codice. L’aspetto della configurazione nel dettaglio è interessante perché permette di scegliere la tipologia di card da associare ad ogni articolo: non esiste infatti un solo tipo di card, ma ben 7 a seconda del contenuto a cui vengono associate.

Tipologie di Twitter Cards

La card che abbiamo visto nei due esempi viene chiamata Summary Card, ovvero di riepilogo, e può essere di due tipi: con immagine piccola o con immagine grande, prominente rispetto alla descrizione del post. Le altre tipologie sono: Photo Card, ne sono un esempio i tweet con link a Flickr

 

Gallery Card, con gallerie di immagini, ad esempio sempre da Flickr
Product Card, per gli ecommerce
App Card, per i link dagli store di applicazioni per smartphone
Player Card, per i link di contenuti audio, ad esempio da SoundCloud (con il tasto play!)

 

Dopo questa carrellata, torniamo all’implementazione tecnica.

Come si attivano le Twitter Cards?

Una volta che sono stati inseriti i tag per le cards, il blog non è ancora pronto per mostrare le sue anteprime nei tweet. Serve un ulteriore passaggio: la validazione.

Vai nell’area del Card Validator per sviluppatori cliccando qui

La sezione Try Cards serve per chi vuole generare a mano i codici metatag. A te interessa la sezione “Validate & Apply”.

Card Validator

Twitter Card Validator

Inserisci l’url del sito da validare, una volta confermato potrai richiedere l’attivazione delle card:

Approvazione Twitter Cards

Approvazione Twitter Cards


Fatto? Sì, dopo pochissimo tempo riceverai via mail la conferma di attivazione delle Twitter Cards. A questo punto puoi testare subito il funzionamento, condividendo un link del tuo blog.

Quando hai fatto perché non me lo fai sapere nei commenti? Grazie ;)

Twitter Cards, impatto culturale

Come abbiamo visto all’inizio, le card aggiungono la potenza della multimedialità e la ricchezza visuale a contenuti che non nascono immediatamente con questa prerogativa.

Ciò dal punto di vista del coinvolgimento del lettore ha un impatto notevole: attirare l’attenzione con contenuti di significato, seppur nello spazio di un tweet, arresta il flusso continuo e attiva un collegamento tra il tuo messaggio e chi legge.

Sta poi al contenuto vero e proprio e agli elementi della card il compito di essere interessanti e ben fatti al punto da catturare l’azione del click. Se il click avviene, missione compiuta: un nuovo lettore è stato conquistato!

La potenza delle cards come modello di design web sta decisamente spopolando: la tendenza che vede favorire tutto ciò che è visivo contamina gli altri campi e li porta a riprodurre quei formati. Così anche il quotidiano online oltre la qualità del contenuto, comincia a preoccuparsi di come questo viene visualizzato, ad esempio su Twitter perché generi un buon engagement.

Ma Twitter non è l’unico ad aver adottato questo modello. C’è Google Now, ad esempio, oppure Pinterest che nasce basato sulle card, Facebook con i suoi blocchi nel diario (avete notato i progressi sulla visualizzazione dei link condivisi?) oppure iOS7 (non chiedetemi di più su quest’ultimo perché non mi sono mai avvicinata agli aggeggi della mela).

Nessuno però ha realmente inventato qualcosa di nuovo: da sempre usiamo le card! Abbiamo carte di credito, biglietti da visita, inviamo biglietti d’auguri e abbiamo giocato sicuramente con le figurine Panini!
figurine-panini
Le carte, o cards appunto, sono dunque un’entità che oggi come ieri utilizziamo e il cui formato è perfetto per raccontare storie brevi in poco spazio.

Non solo, le card sono:

  • Facili da manipolare, organizzare, condividere
  • Perfette per il mobile: sono piccole e di rapida consultazione (e il mobile è il futuro -il presente!- del web)

E in definitiva, su Twitter, come sulle piattaforme già esistenti e future – con la sempre maggiore diffusione dei social, degli smartphone e la drastica riduzione del nostro tempo di lettura – sono un ottimo terreno di sperimentazione e creatività. La sfida? Imparare ad offrire contenuti di valori e a presentarli nel modo più coinvolgente e convincente, nello spazio di una card.

107 Flares Twitter 45 Facebook 15 Google+ 30 Pin It Share 0 LinkedIn 6 Buffer 11 107 Flares ×

valijolie

Innamorata di parole e visioni, di mari ed altri mondi possibili. Docile Amélie in burrasca appasionata di SEO, socialmedia, Twitter e letteratura.

  • Pingback: Guida Twitter Cards: aggiungerle al blog per co...

  • Pingback: Web Marketing: Come attirare attenzione su Twitter | upCreative

  • Pingback: Aggiornamento Twitter Analytics: tutte le nuove statistichevalijolie.it

  • Daniele

    Bell’articolo! E se non si parte da un wordpress i codici dove vanno incollati?

    • http://valijolie.it/ Valentina Lepore

      Ciao Daniele

      i codici vanno inseriti nell’header delle pagine dei singoli articoli con i metadati relativi al tipo specifico di card che vuoi implementare. Una volta fatto questo devi sempre passare dal validator per l’approvazione.

      Qui trovi la documentazione per le varie card https://dev.twitter.com/docs/cards con tutti i codici di esempio.

      Fammi sapere se hai problemi ;)

      • Daniele

        Voglio provare con Blogger. Sarà sufficiente incollare il codice in apertura dell’html dell’articolo?

        • http://valijolie.it/ Valentina Lepore

          Con Blogger mi sembra di sì, è sufficiente riportare per ogni articolo il codice della card.

          Ho trovato questa discussione nel forum di Twitter che forse ti può tornare utile https://dev.twitter.com/discussions/9657

  • Matteo

    Veramente una guida completa, grazie per le info. Una sola cosa: sia con Yoast, che con jm twitter cards, una volta configurati,il polling per validare fallisce, restituendo “invalid card type”…Devo andare ad inserire un singolo post, invece che l’indirizzo del blog come hai fatto tu. Hai qualche info in merito? grazie ancora!

    • http://valijolie.it/ Valentina Lepore

      Ciao Matteo,
      prova con un singolo post e vedi che risposta hai. A me è bastato validare la home…però è passato del tempo e non ho più rifatto i test.
      Intanto controlla anche com’è fatto il codice della card sia in home che nei post per risalire al tipo e all’eventuale errore. Hai scelto il tipo “summary”? Di solito è il più utilizzato…

Vuoi imparare ad usare Twitter da vero esperto? Da oggi c'è una guida completa per te!La voglio!