7 tag HTML essenziali per ottimizzare la SEO

Lo sapevi che sono solo 7 i tag HTML, essenziali ottimizzare la SEO? Questi 7 tag se presenti tra i tag <head> & <body> del tuo documento HTML influenzano notevolmente le prestazioni del tuo sito agli occhi dei motori di ricerca?

I tag HTML sono comandi testuali racchiusi tra parentesi angolari ĆØ sempre presenti in un file HTML. Sono invisibili agli utenti (a meno che non li cerchino nel codice sorgente della pagina) e forniscono dati sui tuoi motori di ricerca. Pertanto, aiutano i motori di ricerca a capire di cosa tratta il tuo contenuto.

Mettono in evidenza quelle che sono le parti piĆ¹ importanti della tua pagina e consente agli utenti di ricercare e trovare piĆ¹ facilmente i tuoi contenuti nel web. Quindi, ĆØ naturale presumere che i tag HTML debbano essere una parte cruciale dell’ottimizzazione on-page, assolutamente vitale per il SEO.

ƈ stato cosƬ fino a quando i motori di ricerca hanno deciso di non guardare sempre e solo i tag per ottenere informazioni. Ma i tag HTML sono ancora importanti nel 2019?

ƈ vero che negli anni precedenti l’influenza dei tag HTML sulle classifiche ĆØ diminuita. E ora i webmaster possono anche scegliere di non utilizzare alcuni tag nel loro codice HTML, tuttavia, ci sono ancora alcuni tag che: migliorano l’esperienza dell’utente fornendo una migliore navigazione e la migliore corrispondenza con le query di ricerca; forniscono indicazioni ai motori di ricerca su dove trovare le parti piĆ¹ importanti del sito e  quali parti trascurare. Adesso vedrai ciascun tag nel dettaglio.

1. Tag del titolo.

I tag <title> vengono generalmente utilizzati dai motori di ricerca per determinare l’oggetto di una determinata pagina e visualizzarlo nella SERP. In HTML un tag <title> ĆØ simile al seguente codice:

<title>Il tuo titolo</title>

I tag <titile> erano di enorme importanza per i motori di ricerca. questo tag ĆØ una delle prime cose che le persone vedono nella SERP. Pertanto, questi tag vengono riempiti con frasi contenenti parole chiave fino allā€™esasperazione.

Oggi i motori di ricerca comprendono ancora di cosa tratti una pagina web dal suo tag <title>. Tuttavia, con il passaggio di Google alla ricerca semantica, il valore di questo tag ĆØ leggermente diminuito. Ad esempio, alcuni ricercatori hanno scoperto che un tag title ottimizzato per parole chiave ĆØ associato ad un miglior posizionamento, ma la correlazione ĆØ meno importante di una volta.

Ora il motore di ricerca ĆØ in grado di interpretare l’argomento di una pagina web senza parole chiave esatte nel titolo ma sulla base di tutti gli elementi della pagina: meta description, immagini, e naturalmente, il contenuto stesso.

Nonostante tutte queste prove, non possiamo che concordare sul fatto che i tag title vengono utilizzati in tre posti e con la massima visibilitĆ :

a) SERP : Il luogo in cui l’utente decide di fare clic o meno;

b) Le schede del browser Web : la visibilitĆ  in questo luogo ĆØ particolarmente importante quando gli utenti hanno molte schede aperte nel browser;

c) I social network : il tag title viene utilizzato quando la pagina viene condivisa.

Di tanto in tanto, perĆ², Google sceglie di non utilizzare il tag del titolo ma ne visualizza uno diverso. Questo ĆØ abbastanza fastidioso, ad esempio esistono alcuni motivi per cui questo problema puĆ² verificarsi:

a) Il titolo ĆØ pieno di parole chiave : ĆØ ovvio ottimizzare il titolo per le parole chiave di destinazione, tuttavia ĆØ importante non esagerare. Altrimenti, Google riscriverĆ  il titolo nel modo che ritiene piĆ¹ appropriato.

b) ll titolo non corrisponde ad una determinata ricerca: Google puĆ² scegliere la tua pagina per una determinata ricerca anche se il titolo non corrisponde alla ricerca. In questo caso, il titolo puĆ² essere talvolta riscritto per ottimizzare la SERP. Ćˆ ovvio che non ĆØ possibile scrivere un titolo che corrisponda a tutte le possibili ricerche. Tuttavia, se vedi che Google riscrive il tuo titolo, allora considera di rivederlo.

c) Esistono alcuni titoli alternativi : Facebook e Twitter hanno i propri tag nella sezione <head>, quindi se utilizzi i titoli alternativi per questi social network, Google potrebbe anche usarli al posto del tuo tag title.

Come ottimizzare il tag title? Penso che dovresti saperlo. Comunque ĆØ davvero facile ottimizzare i titoli! Ci sono alcuni consigli su come scrivere quelli che sicuramente piaceranno di piĆ¹ a Google:

1.1 Lunghezza del titolo

Si consiglia di mantenerlo lungo meno di 70 caratteri , altrimenti puĆ² essere tagliato in SERP e alcune delle tue parole chiave importanti potrebbero essere omesse. Inoltre, tieni presente che la lettera W occupa piĆ¹ spazio rispetto, ad esempio, alla lettera I o ad alcune lettere minuscole.

Pertanto, se il tuo titolo ĆØ piuttosto lungo, ĆØ consigliabile evitare le lettere maiuscole tenendo presente quanto spazio esse occupino. Ad ogni modo, un titolo lungo non ĆØ un errore grave, non c’ĆØ nessuna penalizzazione per questo. Ma sono sicuro che vorresti che i tuoi titoli fossero completamente visualizzati nei risultati di ricerca.

Se usi wordpress puoi verificare facilmente la SERP prodotta con il tuo ttiolo, basta installare il plugin Yoast SEO, per analizzarne il contenuto. .

1.2 Parole chiave del titolo

Se non desideri che Google riscriva i tuoi titoli o ti punisca per aver causato un’esperienza utente scadente, ti preghiamo di non riempire i tuoi titoli con un milione di parole chiave .

Tuttavia, ĆØ ancora importante ottimizzare i titoli per le parole chiave target, basta farlo in modo intelligente. Prova a incorporare una o due parole chiave per creare un titolo descrittivo e unico. Scrivi per i tuoi clienti. Ćˆ chiaro che vuoi attirare piĆ¹ visitatori, ma sicuramente vorresti che rimanessero e si convertissero, senza rimbalzare immediatamente.

Usa le tue parole chiave piĆ¹ vicino all’inizio del titolo. In questo modo, gli utenti che sfogliano i risultati della ricerca noteranno prima le informazioni importanti.

Consiglierei anche di evitare titoli duplicati , poichĆ© Google potrebbe pensare di avere contenuti duplicati e penalizzare il tuo sito Web.

1.3 Marchio in un titolo

Nel caso in cui tu abbia un marchio noto, ĆØ una buona idea usarlo nel titolo. SarĆ  una sorta di approvazione dei tuoi contenuti da parte della qualitĆ  e del riconoscimento associati al tuo marchio. Tuttavia, ricorda di usarlo alla fine del titolo (a meno che non sia una home page o una pagina Informazioni che dovrebbe essere naturalmente piĆ¹ focalizzata sul marchio), in modo che informazioni uniche siano piĆ¹ visibili.

2. Tag meta description.

La meta description ĆØ contenuta nella sezione HTML <head> di una pagina. Di solito viene visualizzato nella SERP dopo il titolo e l’URL del sito Web. In HTML ĆØ cosƬ:

<meta name=”description” content=”descrizione breve del contenuto della pagina web“>

Il valore SEO della meta description ĆØ molto vicino a quello del titolo. Ćˆ un elemento importante di una pagina che aiuta i motori di ricerca a determinare l’oggetto della pagina e consente agli utenti di capire se la pagina corrisponde alla loro ricerca.

Sebbene la meta description non sia un fattore di classificazione, determina comunque se l’utente farĆ  clic sulla tua pagina influenzando cosƬ il posizionamento e la visibilitĆ . Inoltre, una descrizione accurata che corrisponde ai tuoi contenuti ridurrĆ  significativamente la frequenza di rimbalzo ed eventuali penalizzazioni da parte dei motori di ricerca.

La meta description puĆ² essere vista in due modi:

a) SERP : la meta description occupa la maggior parte della SERP;

b) I social network : la meta description di solito appare quando le persone condividono il tuo URL attraverso i canali dei social media.

Analogamente all’uso deliberato dei titoli da parte di Google, la meta description visualizzata in SERP potrebbe differire da quella specificata nella sezione <head>.

Sembra che le meta description siano persino piĆ¹ dipendenti dalle ricerche dei titoli.  Di norma, Google utilizza la meta description specificata in <head>, ma quando sono necessarie ulteriori informazioni o piĆ¹ contesti per abbinare la query, possono essere necessarie anche alcune parti del contenuto della pagina web. Ci sono alcuni modi per risolvere questo problema. La cosa piĆ¹ corretta che puoi fare ĆØ scrivere la meta description che corrisponde meglio al contenuto della tua pagina.

Come ottimizzarla?

Tieni sempre dā€™occhio la lunghezza della meta description. Non molto tempo fa, per essere completamente visualizzata nella SERP, la lunghezza della meta- description doveva essere di circa 160 caratteri. Quindi gradualmente questo valore ĆØ aumentato fino a 300 caratteri. Infine, a dicembre 2017 la lunghezza della meta description ha superato i 300 caratteri.

Cosa dovresti fare in una situazione del genere? Molte persone hanno condotto alcuni esperimenti per capire qual ĆØ la miglior lunghezza per la meta description. Bene, la risposta a questa ricerca ĆØ che non cā€™ĆØ una lunghezza sicura.

Innanzitutto, ĆØ consentita la descrizione di qualsiasi lunghezza. Se troppo lunga, Google la taglierĆ . Penso che il modo piĆ¹ sicuro sia ancora attenersi ai 300 caratteri e tenere d’occhio glie ultimi aggiornamenti su questo argomento.

Se usi wordpress, puoi controllare le tue meta description avvalendoti sempre di Yoast SEO.

2.1 Crea una meta description che funga da annuncio per la tua pagina

Nella situazione in cui Google giochi con le tue meta-description, prova a creare una descrizione che pubblicizzi i contenuti della tua pagina html nel modo migliore e conciso possibile. Evitando descrizioni duplicate: i motori di ricerca penalizzano fortemente eventuali contenuti duplicati sul tuo sito web.

Inoltre, ricorda che eventuali parole in grassetto attirano di piĆ¹ l’attenzione degli utenti. Pertanto, ottimizzare la tua meta descrizione per le parole chiave ĆØ ancora importante.

ottimizzare la meta-description con un tag html essenziale per la SEO

2.2 Nessuna virgoletta nella meta descrizione

Quando usi le virgolette doppie nell’HTML della meta description, Google taglierĆ  questo testo tra virgolette quando lo visualizzi nella SERP. Pertanto, ĆØ meglio rimuovere tutti i caratteri alfanumerici dalle meta description.

2.3 Markup dello schema

Non scherzo, puoi effettivamente arricchire la SERP. Utilizzando un markup speciale , puoi aggiungere elementi al tuo HTML che renderanno le tue descrizioni piĆ¹ attraenti per gli utenti. Ad esempio, possono essere adornati da stelline, valutazioni dei clienti, immagini, informazioni aggiuntive sul prodotto, eccā€¦

ottimizzare la serp con un tag html essenziale per la SEO

Grazie a Google, non ĆØ necessario essere uno sviluppatore web esperto. Ćˆ possibile utilizzare l’Assistente per il markup dei dati strutturati . Prima di aggiungere il blocco di markup dello schema HTML alle tue pagine, ricorda di visualizzare in anteprima i frammenti di SERP copiando e incollando il codice sorgente della tua pagina nello strumento di test di Google.

3. I tag OpenGraph.

I tag Open Graph (OG) sono metatag aggiuntivi inseriti nella sezione HTML <head> di una pagina che consentono a qualsiasi pagina Web di diventare un oggetto ghiotto per i social network. Ćˆ stato introdotto per la prima volta da Facebook nel 2010 e ulteriormente riconosciuto da altre principali piattaforme di social media (LinkedIn, Google+, ecc.)

In HTML un tag OpenGraph si presenta cosƬ:

<meta name=”og:title” property=”og:title” content=”Open Graph Title“>

I tag OG ti consentono di controllare come sono rappresentate le informazioni sulla tua pagina quando vengono condivise tramite i canali social. Questa possibilitĆ  puĆ² aiutarti a migliorare le prestazioni dei tuoi collegamenti sui social media, aumentando cosƬ le conversioni e le condivisioni.

Come ottimizzare questo tipo di tag? Prima di decidere di implementare i tag OG nel tuo HTML, prendi in considerazione alcune ottimizzazioni. Ci sono molti tag Open Graph, io ti darĆ² alcuni consigli su quelli piĆ¹ importanti e popolari.

l'uso dei tag opengraph con un tag html essenziale per la SEO

3.1 Titolo Open Graph

ƈ chiaro, qui specifichi il titolo del tuo contenuto. Puoi copiare e incollare il tag del titolo se ritieni che sia abbastanza convincente per i canali dei social media.

Tieni presente che dovrebbe contenere tra 60 e 90 caratteri, altrimenti potrebbe essere troncato.

3.2 Tipo Open Graph

Con l’aiuto di questo tag, puoi descrivere il tipo di oggetto che sei pronto a condividere: un sito Web, un post, un video, un’azienda, ecc. Puoi controllare l’elenco completo qui .

Questo tag ĆØ considerato importante se nella tua pagina fosse presente il pulsante ā€œLikeā€. PuĆ² essere utile determinare se i tuoi contenuti verranno visualizzati nella sezione di interesse dell’utente di Facebook nel caso in cui “Piaccia”.

Nella maggior parte dei casi, il tipo ĆØ “sito Web”, poichĆ© si condividono principalmente collegamenti a siti Web. In tal caso, non ĆØ necessario specificare il tipo nel codice, verrĆ  letto come tale per impostazione predefinita.

3.3 Descrizione Open Graph

Questo ĆØ molto simile al tag meta description. Tuttavia, non verrĆ  visualizzato nella SERP, verrĆ  mostrato come riepilogo quando la tua pagina verrĆ  condivisa. Per questo motivo, non ha senso inserire abilmente le tue parole chiave in questa particolare descrizione.

Il tuo compito principale ,qui, ĆØ quello di parlare al tuo potenziale pubblico, generando piĆ¹ clic. Per quanto riguarda la lunghezza, ĆØ considerata una buona pratica mantenerlo di circa 200 caratteri.

3.4 Immagine Open Graph

Questo ĆØ un vero asso nella manica. Un’immagine renderĆ  il tuo link condivisibile piĆ¹ attraente del 500%. Quindi fai del tuo meglio.

ƈ chiaro che l’immagine dovrebbe attirare l’attenzione, richiedere associazioni adeguate. Puoi inserire del testo sull’immagine OG per richiamare qualsiasi azione da parte dellā€™utente. La risoluzione consigliata per l’immagine OG ĆØ 1200×627 pixel, la dimensione – fino a 5 MB.

Una volta che hai finito con i meta tag OG, puoi controllare come appare tutto con l’aiuto di Open Graph Object Debugger , uno strumento creato da Facebook.

3.5 Schede Twitter

Le schede Twitter sono molto simili ai tag OG (titolo, descrizione, immagine, ecc.), Ma sono utilizzate esclusivamente da Twitter. Sebbene ora i tweet possano superare i 140 caratteri storici, queste cards sono una piacevole estensione che consente al tuo tweet di distinguersi tra la folla di tweet di testo comuni.

ottimizzare le cards di twitter con un tag html essenziale per la SEO

Esistono alcuni tipi di cards twitter:

Scheda riepilogativa: oltre al tweet originale, ĆØ disponibile un’anteprima del contenuto della pagina, utile per evidenziare post di blog, prodotti, notizie, ecc.

Titolo: 70 caratteri
Descrizione: 200 caratteri
Immagine: 120x120px, fino a 1 MB

Scheda di riepilogo con un’immagine grande: questa scheda ĆØ simile alla precedente, ma contiene un’immagine piĆ¹ grande. L’immagine puĆ² anche includere del testo che trasmette il punto principale del contenuto della tua pagina, un invito all’azione o qualcosa di veramente stimolante a fare clic.

Titolo: 70 caratteri
Descrizione: 200 caratteri
Immagine: 280x150px, fino a 1 MB

Card Player: tali cards consentono agli utenti di riprodurre video o audio all’interno di un tweet.

Descrizione: 200 caratteri
Video: H.264, profilo di base, livello 3.0, fino a 640 x 480 pixel a 30 fps.
Audio: AAC, profilo a bassa complessitĆ 

Cards app : tali schede consentono agli utenti di scaricare app mobili direttamente da un tweet. Presentano un nome, una descrizione, un’icona, una valutazione e un prezzo.

Titolo: rendering dall’ID app
Descrizione: 200 caratteri
Immagine: rendering dall’ID app

Nota: ĆØ supportato solo un tipo di card per pagina.

Quando sei pronto con gli elementi della tua card Twitter, devi fare due cose:

Imposta le cards per le tue pagineInizia qui.

Convalida le tue cards qui. Lo strumento di validazione ti permetterĆ  di verificare se ci sono errori e ti permetterĆ  di vedere in anteprima le tue carte.
Le cars player devono essere ulteriormente approvate da Twitter. Usa questa guida per scoprire come farlo.

4. Il meta tag robot.

Un tag robot ĆØ un elemento nel codice HTML di una pagina che informa i motori di ricerca quali pagine del tuo sito dovrebbero essere indicizzate e quali no. Le sue funzioni sono simili a quelle di robots.txt. Ma viene generalmente utilizzato per impedire ai motori di ricerca di indicizzare singole pagine, mentre robots.txt impedisce loro di indicizzare un intero sito o parte di esso.

In HTML puĆ² apparire cosƬ:

<meta name=”robots” content=”index, follow“>

Non ĆØ che un tag robot possa aiutarti a migliorare le tue classifiche, ma puoi usarlo per salvare le tue classifiche nel caso in cui devi bloccare alcune pagine dall’indicizzazione.

Ad esempio, puoi avere alcune pagine con contenuti piuttosto sottili che non ti interessano essere indicizzati nella ricerca, ma che vorresti conservare. In questo caso, puoi semplicemente aggiungere un tag noindex per questa pagina.

Se non aggiungi questo tag al tuo HTML, i motori di ricerca eseguiranno la scansione e indicizzeranno tutte le tue pagine per impostazione predefinita. Ha senso utilizzare un tag robot solo se si desidera modificare uno di questi parametri.

5. Etichetta canonical.

Quando hai poche pagine con contenuto identico, puoi utilizzare un tag canonical per indicare ai motori di ricerca quale pagina deve essere prioritaria.

In HTML appare cosƬ:

<link href=”URL” rel=”canonical“>

Un tag canonical ĆØ importante per la SEO per due motivi.

Prima di tutto , non solo dice ai motori di ricerca quale pagina tra quelle simili ĆØ piĆ¹ importante, ma mostra anche che tali pagine non sono duplicate. PoichĆ© i contenuti duplicati sono fortemente penalizzati dai motori di ricerca.

In secondo luogo , impedisce la cannibalizzazione che si verifica quando le pagine meno importanti tra quelle simili ottengono classifiche piĆ¹ alte.

Apri il progetto e presta attenzione ai titoli duplicati e alle meta description duplicate.

Nel caso in cui tu abbia alcuni URL con contenuto identico, specifica un elemento <link rel = “canonical”> nell’HTML della pagina.

6. Tag di intestazione.

I tag di intestazione sono i titoli (h1-h6) che usi per strutturare la tua pagina. In HTML un tag di intestazione puĆ² apparire cosƬ:

<h1>una tua intestazione quiā€¦</h1>

Non ĆØ un segreto che ĆØ del tutto lecito usare i tag <h>. Tuttavia, questi tag aiutano i motori di ricerca a leggere i tuoi contenuti in modo piĆ¹ efficiente. L’ordine dei tag di intestazione (da h1 ad h6) mostra il livello di importanza di ogni sezione.

Inoltre, quando una pagina ĆØ strutturata a livello, ĆØ molto piĆ¹ facile per i visitatori leggerla e comprendere le parti piĆ¹ importanti in breve tempo.

Inoltre, di volta in volta, a Google piace creare contenuti in primo piano di tipo ad elenco prelevati dai titoli di una determinata pagina (di solito funziona per guide e istruzioni). L’h1 della tua pagina corrisponderĆ  alla query di ricerca e i tuoi sottotitoli (h2, ad esempio) creeranno un elenco cronologico in uno snippet in primo piano. Il risultato verrĆ  visualizzato in questo modo:

tag title esssenziale per la SEO

La gerarchia dei titoli consentirĆ  ai motori di ricerca di comprendere meglio i tuoi contenuti. Come sai, ora vengono presi in considerazione tutti i fattori per fornire le migliori risposte corrispondenti alle nostre domande.

ƈ consigliabile utilizzare una h1 per pagina e suddividere logicamente i contenuti in sezioni con h2. Se necessario, ĆØ possibile segmentare ulteriormente le sezioni h2 con h3, h4 e cosƬ via. Basta non riempire la tua pagina con una serie di intestazioni diverse. Usali strategicamente per introdurre

PoichĆ© le intestazioni introducono i punti principali di ciascuna sezione della pagina, ĆØ consigliabile includere in esse le parole chiave target e i loro sinonimi. Inoltre, di solito il tuo h1 (se lo usi una volta come titolo di una pagina) sarĆ  simile al tag del titolo in HTML. Pertanto, sarĆ  giĆ  ottimizzato in linea con il tag del titolo.

Un consiglio, non abusare con le parole chiave! Scegli perĆ², una bella parola chiave a coda lunga, composta da almeno 3 o 4 parole.

Mentre i motori di ricerca leggono i tuoi meta tag, i tuoi visitatori leggono il testo. Pertanto, non devi solo migliorare l’indicizzazione dei tuoi contenuti, ma anche l’esperienza dell’utente.

Quando usi il tag h1 per il titolo della tua pagina, cerca di renderlo visibile ai visitatori, dato che, questo tag trasmette l’argomento principale del contenuto della tua pagina. Pertanto, dovrebbe essere:

a) piĆ¹ grande di tutti gli altri elementi di testo della tua pagina;

b) evidente a colpo d’occhio: usa elementi di formattazione e stile diversi per farlo risaltare.

7. Attributo Alt.

L’attributo alt fa parte di un tag immagine e fornisce una descrizione per un’immagine. In HTML potrebbe apparire cosƬ:

<img src=”url” alt=”La descrizione della tua imagine quiā€¦“>

Il testo alternativo ha un ruolo importante nell’ottimizzazione delle immagini. Rende le tue immagini accessibili sia ai motori di ricerca (dicendo loro cosa significa una particolare immagine) sia alle persone (visualizzando un testo alternativo nel caso in cui una particolare immagine non venga visualizzata correttamente).

I testi alternativi sono un’altra opportunitĆ  per utilizzare le parole chiave target. Scrivi la descrizione che fornisce il contesto ai tuoi contenuti e usa una parola chiave dove ĆØ piĆ¹ adatta. Le immagini ottimizzate per parole chiave funzioneranno perfettamente in combinazione con i fattori che i motori di ricerca prendono in considerazione quando classificano le pagine.

Inoltre, cerca di mantenere le tue descrizioni piuttosto brevi – circa 125 caratteri, poichĆ© gli screen reader tagliano i testi alternativi attorno a questo segno.

Nessuno di questi tag puĆ² influenzare direttamente il tuo successo nella SEO, ma possono  influenzarlo indirettamente. Ćˆ strettamente necessario sapere cosa hai tra i tag <head> & <body>, come funziona e cosa puoi fare per farli funzionare al meglio.

L’importanza dei Meta Tag nella SEO

Antonio Lamorgese

Amministratore di rete e sviluppatore. Dopo anni di esperienza nel settore, ho ideato un sistema di gestione dati MYSQL in PHP senza scrivere una sola riga di codice. Scopri di piĆ¹....