Generatore di meta tag
Inserisci i dati della tua pagina e copia l'HTML pronto da incollare nell'head: tag title, description, canonical, robots, Open Graph e Twitter card.
Funziona interamente nel tuo browser
I campi vuoti vengono omessi dall'output. Le anteprime sono simulazioni create dal tuo testo; non caricano mai l'indirizzo della tua immagine, e i veri motori di ricerca e social formattano le cose a modo loro.
Come generare i meta tag
- Inserisci il titolo e la descrizione della pagina. I contatori danno un'idea approssimativa di quanta parte di ciascuno viene di solito mostrata.
- Aggiungi un indirizzo canonical, le scelte per i robots e i campi Open Graph e Twitter che ti servono. Gli avvisi segnalano gli indirizzi che non sono URL
https://completi. - Controlla le simulazioni di ricerca e social, poi premi Copia HTML e incolla i tag dentro il
<head>della tua pagina.
A che cosa serve ogni tag
Il <title> e la meta description sono di solito ciò da cui è costruito un risultato di ricerca. Il link canonical dice ai motori di ricerca qual è l'indirizzo principale quando la stessa pagina è raggiungibile in più modi, per esempio con parametri di tracciamento. Il tag robots serve solo quando vuoi cambiare il comportamento predefinito di indicizzare la pagina e seguirne i link.
I tag Open Graph sono nati per le anteprime dei link e oggi vengono letti dalla maggior parte delle app di chat e dei social. Titolo, descrizione, immagine e URL sono i quattro che contano di più; og:image:alt dà all'immagine una descrizione testuale e og:type di solito è website o article. Il tag card di X sceglie tra una piccola miniatura quadrata (summary) e un'immagine larga (summary_large_image).
Il testo viene sottoposto a escape mentre viene scritto, quindi una e commerciale diventa & e una virgolette doppia diventa ". Questo mantiene valida la pagina e impedisce che virgolette vaganti chiudano un attributo in anticipo. Controlla la pagina finita con una vera anteprima di condivisione prima di farci affidamento, perché ogni sito mette in cache l'anteprima che ha scaricato per prima.
Suggerimenti
- Conta i caratteri con più precisione con Conta caratteri.
- Crea un indirizzo pulito per l'URL canonical con il Generatore di slug.
- Riordina l'head in cui incolli con Formatta e indenta HTML.
Domande frequenti
Quanto devono essere lunghi un title o una description?
Non c'è un limite fisso. I motori di ricerca tagliano il testo in base alla larghezza in pixel, non ai caratteri, e possono riscriverlo. Come indicazione di massima, title di circa 50-60 caratteri e description di circa 150-160 caratteri di solito vengono mostrati per intero. I contatori qui sono indicazioni, non regole.
Servono sia i tag Open Graph sia quelli Twitter?
Spesso bastano quelli Open Graph. X (Twitter) legge titolo, descrizione e immagine Open Graph quando mancano i suoi tag, ma vuole comunque twitter:card per scegliere il layout della card. Aggiungi twitter:site se vuoi che l'account venga citato.
Perché og:image deve essere un indirizzo completo?
I social scaricano l'immagine dai propri server, quindi un percorso relativo come /img/card.png non ha nulla rispetto a cui essere risolto. Usa un URL https:// assoluto. Una dimensione tipica per le card è 1200 per 630 pixel.
Che cosa fa la scelta dei robots?
noindex chiede ai motori di ricerca di non elencare la pagina e nofollow di non seguirne i link. Il comportamento predefinito di una pagina senza tag robots è index e follow, quindi scegliere entrambi non scrive alcun tag.
I caratteri speciali vengono sottoposti a escape?
Sì. E commerciali, parentesi angolari e virgolette doppie nel tuo testo vengono convertiti in entità HTML, quindi un titolo come Q&A "live" non può uscire dal suo attributo né aggiungere markup alla pagina.
Viene inviato qualcosa a un server, o viene caricata la mia immagine?
No. I tag vengono creati nel tuo browser e l'indirizzo dell'immagine è solo stampato come testo nella simulazione social, mai richiesto. I social lo scaricheranno più tardi, quando qualcuno condividerà la pagina.