Cosa sono i meta tag HTML?

I meta tag HTML sono elementi nella sezione che forniscono metadati sulla pagina, letti dai motori di ricerca, dai social media e dai browser.

Open Graph (OG) è un protocollo di Facebook che trasforma le pagine web in oggetti ricchi quando vengono condivise sui social media.

Cosa sono le Twitter Cards?

Le Twitter Cards consentono di allegare esperienze multimediali ai tweet. Il tipo summary_large_image è il più popolare.

Cos'è un URL canonico?

Un URL canonico specifica la versione preferita di una pagina quando più URL puntano allo stesso contenuto.

Quanto devono essere lunghi il mio meta titolo e la descrizione?

Il meta titolo deve avere meno di 60 caratteri. La meta descrizione deve avere 120-155 caratteri.

Generatore di Meta Tag

Genera meta tag HTML per SEO, Open Graph e Twitter Cards.

Titolo

18/60

Autore

Descrizione

50/155

Parole chiave

Robots

URL canonico

URL immagine OG

Tipo Twitter Card

Anteprima social

OG Image: https://example.com/og-image.png

https://example.com/page

My Awesome Website

A short description of this page for SEO purposes.

HTML generato

<!-- Primary Meta Tags -->
<title>My Awesome Website</title>
<meta name="title" content="My Awesome Website" />
<meta name="description" content="A short description of this page for SEO purposes." />
<meta name="keywords" content="web, tools, free" />
<meta name="author" content="Author Name" />
<meta name="robots" content="index, follow" />
<link rel="canonical" href="https://example.com/page" />

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:title" content="My Awesome Website" />
<meta property="og:description" content="A short description of this page for SEO purposes." />
<meta property="og:image" content="https://example.com/og-image.png" />

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:url" content="https://example.com/page" />
<meta property="twitter:title" content="My Awesome Website" />
<meta property="twitter:description" content="A short description of this page for SEO purposes." />
<meta property="twitter:image" content="https://example.com/og-image.png" />

Informazioni sullo strumento

I meta tag sono istruzioni invisibili che aggiungi all'HTML del tuo sito web per dire ai motori di ricerca, alle piattaforme di social media e ai browser di cosa parla la tua pagina. Controllano come il tuo sito appare nei risultati di ricerca di Google e come si presenta quando qualcuno condivide il tuo link su Facebook, Twitter o LinkedIn. Senza meta tag appropriati, i motori di ricerca possono fraintendere il tuo contenuto e i tuoi link appariranno semplici quando condivisi sui social media.

Questo generatore di meta tag ti consente di creare rapidamente tutti i meta tag importanti di cui il tuo sito web ha bisogno: titolo, descrizione, parole chiave, autore, direttive robots e URL canonici. Genera anche tag Open Graph per controllare come la tua pagina appare sui social media e Twitter Cards per migliorare i tweet. Compila semplicemente le informazioni della tua pagina, copia il codice HTML generato e incollalo nella sezione <head> della tua pagina. L'anteprima dal vivo mostra esattamente come la tua pagina apparirà quando condivisa su piattaforme sociali.

Sviluppatori web, creatori di contenuti e specialisti SEO utilizzano questo strumento per semplificare il loro flusso di lavoro ed evitare errori di sintassi. Che tu stia lanciando un nuovo blog, ottimizzando una pagina di prodotto di e-commerce o assicurando che i contenuti duplicati non danneggino le tue classifiche, questo generatore ti fa risparmiare tempo e garantisce coerenza su tutto il tuo sito.

Domande Frequenti

Implementazione del Codice

def generate_meta_tags(
    title: str,
    description: str,
    url: str,
    image: str = "",
    site_name: str = "",
    twitter_handle: str = "",
    locale: str = "en_US",
) -> str:
    lines = []
    lines.append(f'<title>{title}</title>')
    lines.append(f'<meta name="description" content="{description}">')
    # Open Graph
    lines.append(f'<meta property="og:title" content="{title}">')
    lines.append(f'<meta property="og:description" content="{description}">')
    lines.append(f'<meta property="og:url" content="{url}">')
    lines.append(f'<meta property="og:type" content="website">')
    lines.append(f'<meta property="og:locale" content="{locale}">')
    if site_name:
        lines.append(f'<meta property="og:site_name" content="{site_name}">')
    if image:
        lines.append(f'<meta property="og:image" content="{image}">')
        lines.append(f'<meta property="og:image:width" content="1200">')
        lines.append(f'<meta property="og:image:height" content="630">')
    # Twitter Card
    card = "summary_large_image" if image else "summary"
    lines.append(f'<meta name="twitter:card" content="{card}">')
    lines.append(f'<meta name="twitter:title" content="{title}">')
    lines.append(f'<meta name="twitter:description" content="{description}">')
    if twitter_handle:
        lines.append(f'<meta name="twitter:site" content="{twitter_handle}">')
    if image:
        lines.append(f'<meta name="twitter:image" content="{image}">')
    return "\n".join(lines)

print(generate_meta_tags(
    title="My Page",
    description="A great page.",
    url="https://example.com",
    image="https://example.com/og.png",
    site_name="Example",
    twitter_handle="@example",
))

Comments & Feedback

Comments are powered by Giscus. Sign in with GitHub to leave a comment.