Queste slide sono state utilizzate all'interno del nostro webinar "Scopri la nuova Semantica Web con HTML5" che puoi trovare a questo indirizzo: http://skillsandmore.org/semantica-web/ All'interno dell'intervento abbiamo approfondito il termine e le tecniche che portano a raggiungere una buona semantica, Eugenio ci ha parlato della gerarchia degli elementi HTML5 e successivamente siamo andati a scoprire la sintassi e l'utilizzo di Schema.org, i nuovi attributi che ci permettono di approfondire il significato del proprio contenuto. Personalmente ti consiglio di venire a vedere la registrazione del webinar e se non vuoi perderne altri non ti resta che iscriverti alla nostra newsletter: http://skillsandmore.org/newsletter/

1. La semantica del Web con
HTML5

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

3. La struttura di una pagina HTML5

4. 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/

5. 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.

6. Scopriamo gli altri elementi HTML5
Rappresenta 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

7. Rimasto con
qualche dubbio?

8. 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

9. I vantaggi di adottare schema.org
RichSnippet in SERP per attirare click
Migliore indicizzazione da Google, Bing
e Yahoo
Più trasparenza per il visitatore

10. Anatomia di uno schema

11. Rimasto con
qualche dubbio?

12. skillsAndMore
Registrati ora ad un prezzo irripetibile!
http://skillsandmore.org/registrami