semantica html5

[max103]

vorrei un consiglio sul tag html5 da utilizzare

ho una pagina così composta:

<header><nav></nav></header>

<section>
  qui ho una serie di link organizzati in sezioni, che tag utilizzo? <nav> o <article>?
</section>

<footer></footer>

[rickynewtek]

Hai le idee un pò confuse, sopratutto sui tag article e section... prova a schiarirti le idee QUI mentre QUI se vuoi appronfondire l'uso dei nuovi tag.

Allora venendo al tuo problema:

<section> indica porzioni di codice o testo non distribuibili e comunque a diversa tematica. Es. section "news" section " contatti" etc.

<article> invece viene usato per contenere il testo o codice che concerne un specifico argomento. article "ricetta1" article "ricetta 2"

Dentro article puoi mettere un <header> con relativi dag di heading <hgroup>

<nav> viene di solito usato per la navigazione sul sito e non per normali elenchi (per quello usa come hai sempre mfatto <ul>

E' consigliabile posizionare il nav dentro il tag aside.

Venendo alla tua domanda:
qui ho una serie di link organizzati in sezioni, che tag utilizzo?
la risposta e' dipende. Queste sezioni fanno parte del sito? rendono la navigazioni efficente o sono una "lista" di link esterni o della stessa tipologia/tematica?

Se fanno parte della navigazione puoi usare nav (occhio ad abusarne).

Non abusare anche del tag section e article, se hai un box "generico" di testo o codice DEVI secondo le specifiche usare il tag DIV come hai sempre fatto.

[max103]

sono una serie di link che rappresentano le sezioni del sito

potrebbe essere la pagina mappasito.htm ad esempio

quindi mi stai dicendo:

<header><nav></nav></header>

<aside><nav>
 <ul>[*]sezione 1[*]sezione 2[*]sezione 3[/list]
</nav></aside>

<footer></footer>

[rickynewtek]

Tutto giusto ma il <nav> dentro il tag <header> e' inutile, fai cosi piuttosto:

<header>
<hgroup> //facoltativo
<h1>Titolo principale</h1>
<h2>Sottotitolo</h2>
</hgroup>
</header>

<nav>
<ul id="menu">[*][/list]
<nav>

Mentre invece il secondo spezzone di codice va bene

<aside>
<nav>
<ul>[*]sezione 1[*]sezione 2[*]sezione 3[/list]
</nav>
</aside>

<footer></footer>

Ciao!

[max103]

ok ma l'header, contiene strutturalmente il menù,
in realtà contiene anche una serie di elementi (scelta della lingua, search ecc)

qualcosa tipo

<div id="header">
search
cambio lingua
<nav>finalmente menù di navigazione </nav>
logo con h1
</div>


resto della pagina

[rickynewtek]

Ok ma <header> non e' div="header" Usa div header per il contenitore di lingua search etc, e usa <header> per inglobare il tutto, qualcosa del tipo:

<header>

      <div id="head">
              
             <div id="lingua"></div>
             <nav></nav>

        </div>
</header>

[max103]

leggendo la descrizione dei nuovi tag html5 offerta da w3schools

http://www.w3schools.com/html5/html5_new_elements.asp

trovo:

<article> For external content, like text from a news-article, blog, forum, or any other content from an external source

come se <article> sia deputato a contenuti esterni al sito..?

[rickynewtek]

No per html5 non ti consiglio w3c schools, in ogni caso si intende contenuto esterno inteso come "re-distribuibile all'esterno" pensa ai vari social network.

[max103]

capito,

sono andato a cercare alla fonte e infatti la musica cambia
ecco il link al tag <article> sul sito w3.org

http://www.w3.org/TR/2011/WD-html5-2...rticle-element

[rickynewtek]

Si w3c school usalo solo per Php o se vuoi fare qualche prova "in tempo reale" (negli altri linguaggi e' parecchio scadente).