NerdAlert: Che schifo, codice…
Non devi necessariamente saperlo leggere o scrivere, ma devi sicuramente sapere che esiste, e devi decisamente verificare che elementi importanti, come i meta tag, compaiono nel codice del tuo sito.
Ok, Shay, vediamo di finire sta cosa. Come guardo il codice del sito?
Ci sono due modi:
- Vedere la sorgente della pagina.
- Ispezionare un elemento.
Sono praticamente la stessa cosa. L’unica differenza è che ispezionare un elemento ti porterà direttamente al pezzo di codice dove sta l’elemento in questione.
Entrambi i metodi si trovano nel menù contestuale del tasto destro del mouse, cliccandolo ovunque sul sito (nota che utenti di safari dovranno abilitare lo strumento dell’ispettore per il loro browser).
Ora vediamo ‘sti meta tags
I meta tags contengono informazioni sul tuo sito che verrà servito a chiunque lo richiede, che sia un altro sito, un motore di ricerca o un’app.
Il meta data, che è servito nella forma di meta tags, ha due scopi principali. I motori di ricerca necessitano di queste informazioni per poter mostrare la tua pagina come uno snippet nella SERP. Lo snippet è quella parte blu-verde-nera, che contiene il titolo, la URL e la descrizione della pagina.
La seconda ragione per cui ti servono i meta tags è per mandare le informazioni corrette ad altri siti.
Per spiegare meglio questo aspetto, prenderò come esempio il post di tipo link.
Quando incolli qualsiasi link nello status di Facebook, ricevi subito un’anteprima del link: l’immagine in evidenza del post, il suo titolo, la descrizione, URL e l’autore.
La maggior parte di questa informazione può essere scoperta automaticamente dal sistema, raschiando l’informazione sulla pagina web. Usando i meta tags, però, otterrà risultati migliori! Potrai decidere esattamente cosa andrà in ognuno di questi campi.
Così il titolo o la descrizione possono anche cambiare tra le piattaforme, permettendoti di parlare con un tono di voce diverso dove serve.
OK, sono pronto, mostrami ‘sti meta tags
Diamo un’occhiata ai meta tag della descrizione:
<meta name="description" content="A nessun CEO interessa il codice o i meta tags, ha gente che viene pagata per pensarci. Ma nessun CEO può avere un sito che mostra i meta dati sbagliati."/>Come puoi vedere, ogni meta tag ha il proprio nome (in questo caso, description) e contenuto.
Alcuni meta tags sono anche specifici per diverse piattaforme. I meta tags di cui la property comincia con OG, che sta per il linguaggio Open Graph di Facebook, sono fatti per essere mostrati da Facebook.
<meta property="og:title" content="Cosa sono i meta tag e perché servono al tuo sito?"/>Quello che vedi qui è l’elemento titolo che verrà mostrato quando incolli la URL dell’articolo nello status di Facebook.
I titoli possono essere diversi per ogni piattaforma, come già menzionato. Esiste, però, anche un titolo principale della pagina (che può essere diverso dal titolo della pagina o dell’articolo) che verrà mostrato ovunque questo titolo sia richiesto (guarda il testo dentro il browser-tab di questa pagina, per esempio).
Questo tipo di titolo ha un proprio tag:
<title>Cosa sono i meta tag e perché servono al tuo sito?</title>