La semantica del Web con HTML5

Perché parliamo di web semantico e cosa c’era prima?

La struttura di una pagina HTML5

Gli elementi <section> e <article>

L’elemento <section> rappresenta la sezione generica di un documento o di un’ applicazione.

L’elemento <article> rappresenta un contenuto che ha senso anche se scorporato dalla pagina. Di buona norma al suo interno troviamo elementi caratteristici come intestazioni e paragrafi.

http://html5andmore.info/creare-una-pagina-html5/

Gli elementi <nav> e <aside>

L’elemento <nav> serve ad indicare la presenza di un menù di navigazione mentre <aside> ci aiuta a definire una sezione con contenuto non per forza in relazione con il principale. Viene usato in particolar modo per le sidebar.

Scopriamo gli altri elementi HTML5Rappresenta l’intestazione di un elemento <section> e può contenere al suo interno almeno un <h1> fino a <h6>, un <hgroup> o può ospitare i metadati dell’articolo (tassonomie, autore, etc).

<header>

<hgroup> Serve a raggruppare intestazioni (<h1>, <h2>, etc) dentro l’elemento <header> quando c’è più del semplice titolo (sottotitolo e altro ancora).

<footer> Indica l’area in fondo ad un articolo o una sezione, spesso usata come raccoglitore per ulteriori approfondimenti e informazioni, generiche o meno.

https://developer.mozilla.org/it/docs/Web/HTML/Element

Rimasto con qualche dubbio?

Schema.org: la semantica per Google

Con degli attributi di tipo itemprop aiutiamo i motori di ricerca a indicizzarci meglio in base al nostro contenuto e ad arricchire gli snippet in SERP con i giusti elementi grafici e testuali.

http://schema.org/docs/schemas.html

I vantaggi di adottare schema.org

RichSnippet in SERP per attirare clickMigliore indicizzazione da Google, Bing e YahooPiù trasparenza per il visitatore

Anatomia di uno schema

Rimasto con qualche dubbio?

skillsAndMoreRegistrati ora ad un prezzo irripetibile!

http://skillsandmore.org/registrami