Microdata HTML: usi pratici
Microdata è una specifica HTML5 che permette di annotare i contenuti direttamente nel markup, abbinando dati strutturati a elementi visibili della pagina. Sebbene Google preferisca oggi JSON-LD, Microdata resta valido e particolarmente utile quando i dati sono già intrecciati col DOM e non vuoi mantenere copie separate. In questa guida vediamo come usarlo correttamente.
Cos'è Microdata
Microdata introduce tre attributi globali: itemscope per definire l'inizio di un'entità, itemtype per specificarne il tipo (di solito un'URL Schema.org), e itemprop per assegnare proprietà ai singoli elementi. Il risultato è un'albero di dati estratti dal markup esistente, senza necessità di blocchi script separati e con un legame diretto tra contenuto e metadati.
Quando preferirlo a JSON-LD
Microdata è utile quando i dati strutturati corrispondono fedelmente al contenuto già presente nella pagina, evitando duplicazioni e sincronizzazioni. È preferito in templating server-side dove i dati vengono generati una sola volta. JSON-LD invece è meglio per markup complesso o quando i dati sono calcolati separatamente dal rendering, perché più facile da generare a parte.
Esempio completo Article
Un blog post con Microdata si avvolge in <article itemscope itemtype="https://schema.org/Article">. Il titolo: <h1 itemprop="headline">. L'autore: <span itemprop="author" itemscope itemtype="https://schema.org/Person"> con <span itemprop="name"> interno. La data: <time itemprop="datePublished" datetime="2026-06-29">. L'immagine: <img itemprop="image" src="...">. Il corpo del testo: <div itemprop="articleBody">. Il publisher: nested Organization con name e logo. Questa struttura genera rich snippet con immagine, data e autore nei risultati Google.
Vantaggi specifici di Microdata
Microdata mantiene i dati strutturati visibili anche agli sviluppatori che leggono il sorgente. Ogni annotazione è esattamente dove si trova il contenuto, riducendo il rischio di disallineamento tra dati strutturati e contenuto reale. È particolarmente apprezzato in progetti server-side rendering dove i template generano markup ed è naturale annotare gli stessi elementi che renderizzano il contenuto. La curva di apprendimento è gestibile e l'integrazione con HTML esistente è graduale, senza riscritture massive del codice.
Validazione Microdata
Strumenti per validare Microdata: Rich Results Test di Google (search.google.com/test/rich-results) accetta sia URL che codice incollato e mostra i dati estratti come Google li vede. Schema Markup Validator (validator.schema.org) è uno strumento ufficiale Schema.org che evidenzia errori di sintassi e proprietà non riconosciute. Entrambi gratuiti, complementari. Integra la validazione nel flusso di sviluppo: ogni nuova feature che genera dati strutturati va testata prima del deploy in produzione. Errori comuni che i validatori rilevano: itemtype senza https, itemprop su elementi sbagliati, gerarchie di scope confuse o incomplete.
Microdata e accessibilità
Microdata in sé non influisce direttamente sull'accessibility: gli attributi itemscope, itemtype e itemprop sono trasparenti ai lettori di schermo. Tuttavia, scrivere markup pulito e ben strutturato per i dati strutturati spesso coincide con scrivere markup accessibile: usare i giusti tag semantici (article, time, address), label esplicite, alt descrittivi. La disciplina richiesta per Microdata ben fatto migliora indirettamente la qualità complessiva del codice, e quindi anche l'accessibilità. Un sito SEO-ottimizzato semanticamente è quasi sempre anche un sito più accessibile.
Microdata e CMS
Molti CMS supportano Microdata nativamente nei template. WordPress ha plugin Schema Pro, Schema All-In-One per inserire Microdata. Drupal ha modulo Schema.org Metatag con dozzine di tipi. Joomla ha estensioni Microdata SEO. Per siti custom, integra annotazioni nei template Twig, Blade, Handlebars. Mantieni una documentazione interna dei tipi usati e dei campi richiesti per ciascuno. Crea un check automatico nel build pipeline che valida i dati strutturati su un set di URL rappresentativi. Pattern enterprise: design system con componenti Microdata-aware, dove ogni componente sa quali itemprop esporre in base al contesto della pagina che lo ospita.
Procedura passo-passo
- Identifica l'entità da marcare (es. un'articolo, un prodotto, un'evento).
- Avvolgi il blocco con un tag avente itemscope e itemtype="https://schema.org/Article".
- All'interno marca le proprietà con itemprop, ad esempio <h1 itemprop="headline">.
- Usa <meta itemprop="datePublished" content="2026-06-29"> per dati non visibili.
- Per immagini usa <img itemprop="image" src="..."> con URL assoluto.
- Per autori annida un nuovo itemscope con itemtype="https://schema.org/Person".
- Verifica il markup con il Rich Results Test di Google.
Errori comuni e come risolverli
- itemtype senza https: usa sempre https://schema.org/ con protocollo esplicito.
- itemprop su elemento sbagliato: assegna le proprietà ai tag che contengono il dato corretto.
- Dimenticare itemscope: senza itemscope, l'itemtype non viene riconosciuto dai crawler.
- Annidamento confuso: ogni nuova entità richiede un proprio itemscope, altrimenti le proprietà vengono attribuite all'entità sbagliata.
- Mancata sincronizzazione: se modifichi il testo dimenticando il microdata, i dati strutturati diventano obsoleti.
Domande frequenti
D: Microdata è ancora supportato da Google?
R: Sì, è perfettamente valido, ma Google raccomanda JSON-LD come formato primario per nuove implementazioni.
D: Posso mescolare Microdata e JSON-LD?
R: Tecnicamente sì, ma rischi inconsistenze. Meglio scegliere uno dei due formati per coerenza.
D: Microdata influisce sul rendering?
R: No, gli attributi itemscope, itemtype e itemprop non hanno effetto visivo.
D: Funziona con qualsiasi tipo Schema.org?
R: Sì, l'intero vocabolario Schema.org è disponibile via Microdata.
Hai bisogno di aiuto?
Se vuoi sviluppo web con il team di G Tech Group, scrivici tramite il modulo di contatto.