Semantica nuovi tag

[killumix]

Un saluto a tutto il forum


Dal vecchio sistema tabellare , ho ripreso a programmare con html5 attraverso l'uso della nuova semantica.

Sto cercando di creare e impaginare un'ipotetico articolo da inserire nella home page del mio sito. All'indirizzo : http://havingroove.altervista.org/ c'è quello che dovrebbe essere inserito in home page..
Per adesso vorrei capire solanto se cio' che ho scritto è semanticamente corretto, la progettazione grafica dell'articolo è pensata anche in funzione di cio' che vorrebbe vedere google. Mi farebbe piacere ricevere qualche suggerimento, magari sapere se il codice html è snello o se ci sono delle soluzioni piu' efficaci. Un Grazie in anticipo

[Al_katraz984]

<section id="art1"> 

se l'id indica "articolo numero 1" imho non è corretto il tag section identifica una sezione non un articolo

<header id="testata">  <p><h2>TECHNICOLORFULL</h2>  <h3>HIS LOOK AND..</h3></p>  </header> 

questo header è riferito alla sezione (non all'articolo), hai inserito 2 tags di heading all'intero di un tag <p> per formare un titolo, dovresti usare un div se hai necessità di aggiungere dello stile oppure lasciare senza tag <p>

<article id="fotodata"> 

l'id qui non è molto comprensibile

   <h5><time datetime="20/05/2015" pubdate>Pubblicato il 25 Aprile 2015 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;    &nbsp;category/outfit</time></h5> 

qui usi un tag di heading quando non serve meglio inserire la data su un tag <p> e soprattutto togliere quei &nbsp; i posizionamenti si fanno con il css non con artefizi.
per il tag time: http://www.w3.org/TR/2014/REC-html5-...e-time-element

<p><img src="image/imageart1.png" /></p> 

il tag img richiede alcuni tags obbligatori es. alt per il testo alternativo.

<ul id=trasp>    <li><a href="#" style="cursor: pointer;"><img src="image/icon/instapic.png"></a></li>    <li><a href="#" style="cursor: pointer;"><img src="image/icon/pintlittle.png"></a></li>    <li><a href="#" style="cursor: pointer;"><img src="image/icon/facelittle.png"></a></li>    </ul> 

qui mescoli stile con struttura

<footer id="preart">    <p>Evan Rachel wood talks to Lou Stoppard about collaborating with Lee McQueen and his pioneering use of crystal within his design..    </p>    <img src="image/icon/iconbotart.png">   </footer> 

il footer con id indecifrabile (probabilmente inutile).

qui trovi alcuni consigli: http://www.w3.org/TR/2014/REC-html5-...#common-idioms

mentre qui trovi tutto: http://www.w3.org/TR/2014/REC-html5-20141028/[/php]

[killumix]

Grazie mille per i suggerimenti e la segnalazione delle guide w3 . Ho riscritto il codice posizionando i div con le position relative e staccandoli verticalmente con bottom . http://havingroove.altervista.org/

Dovremmo esserci?