Generatore di Meta Tag

0/60
0/160
Robots

Compila un modulo, titolo della pagina, descrizione, URL canonico, immagine sociale, autore, nome del sito, handle di Twitter, e il generatore emette un blocco di meta tag pronto da incollare che copre le basi SEO, Open Graph (per Facebook, LinkedIn, Discord, Slack), Twitter Card, favicon/icon Apple touch e JSON-LD Schema.org opzionale per Articolo o Prodotto. Utile quando stai configurando un sito statico a mano o aggiungendo metadati a un CMS che espone solo un editor <head> grezzo.

Come costruire il frammento dell'intestazione

  1. 1

    Inserisci i metadati della pagina

    Titolo, descrizione, URL canonico, autore, nome del sito.

  2. 2

    Aggiungi l'URL dell'immagine sociale

    Utilizzato sia per `og:image` che per `twitter:image`. 1200×630 è ideale.

  3. 3

    Scegli le opzioni

    Tipo di card di Twitter, direttive robots, colore del tema, tipo Schema.org.

  4. 4

    Copia l'output

    Un blocco di tag HTML `<meta>` pronto da incollare tra `<head>...</head>`.

Cosa produce il generatore

<!-- Meta Primaria -->
<title>Titolo della pagina, Nome del sito</title>
<meta name="description" content="Un riassunto di 150 caratteri del contenuto della pagina.">
<link rel="canonical" href="https://example.com/page">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow">

<!-- Open Graph -->
<meta property="og:type" content="article">
<meta property="og:url" content="https://example.com/page">
<meta property="og:title" content="Titolo della pagina">
<meta property="og:description" content="Stessa descrizione o una ottimizzata per i social">
<meta property="og:image" content="https://example.com/og-image.jpg">
<meta property="og:site_name" content="Nome del sito">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@siteaccount">
<meta name="twitter:creator" content="@authoraccount">
<meta name="twitter:title" content="Titolo della pagina">
<meta name="twitter:description" content="Descrizione">
<meta name="twitter:image" content="https://example.com/og-image.jpg">

<!-- Icone -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<meta name="theme-color" content="#0b5ed7">

Guida campo per campo

  • Titolo: 50–60 caratteri. Includi la parola chiave principale. Metti il marchio alla fine: Titolo della pagina, Marchio.
  • Descrizione: 140–160 caratteri. Legge bene in isolamento. Evita frasi standard che si ripetono tra le pagine.
  • Canonico: URL assoluto, incluso https://. Corrisponde a og:url.
  • Immagine OG: minimo 1200×630 px (il rapporto preferito da Facebook 1.91:1). JPG o PNG. Sotto 8 MB.
  • Card di Twitter: summary_large_image se hai una buona immagine; summary per una miniatura piccola.
  • Robots: index, follow per pagine pubbliche; noindex, nofollow per contenuti di staging o sottili.

Extra opzionali

  • JSON-LD per Articolo o Prodotto consente a Google di visualizzare risultati ricchi (autore, data di pubblicazione, prezzo, stelle di recensione).
  • theme-color colora il chrome del browser su Android Chrome e iOS Safari.
  • og:locale per siti multilingue (es. en_US, es_ES).
  • Extra og:type=article: article:published_time, article:author, article:section, article:tag.

Errori comuni che questo generatore previene

  • Dimenticare il tag viewport. La tua pagina viene visualizzata in larghezza desktop su mobile, livello di zoom 0.3.
  • Titoli diversi in <title>, og:title e twitter:title. Schede di condivisione incoerenti.
  • URL delle immagini relative in og:image. Facebook non può risolverli; la scheda non viene visualizzata.
  • Mancanza di og:type. I valori predefiniti funzionano, ma Facebook è più felice con un valore esplicito.

Domande frequenti

Tecnicamente Twitter ricade su Open Graph se i suoi tag sono assenti, quindi se imposti solo OG, Twitter visualizzerà comunque una scheda. Aggiungere tag specifici per Twitter ti consente di personalizzare l’esperienza (es. rapporto di aspetto dell’immagine diverso).

1200×630 px (1.91:1). Facebook e LinkedIn visualizzano questo a dimensione intera; Twitter lo ritaglia per la scheda di riepilogo. Non mettere contenuti critici ai bordi, il centro del 60% è la zona sicura.

No. Le pagine si classificano bene anche senza. JSON-LD abilita funzionalità di risultati ricchi (schede ricetta, accordion FAQ, elenchi di prodotti) quando il tipo di contenuto corrisponde a uno schema Schema.org. Aggiungilo dove si adatta.

Tra <head> e </head> nel tuo HTML, prima di eventuali fogli di stile o script esterni che potrebbero ritardare il parser nel raggiungerli.

No. Tutto è generato localmente nel tuo browser.

Strumenti correlati

Strumento disponibile in altre lingue