Div vs Article vs Section e Span

Div vs Artcle vs Section

Le indicazioni del w3c rispetto al tag div sono chiare: il tag div non ha di per sè un significato particolare, è un contenitore che rappresenta i suoi figli. Va utilizzato con attributi globali per manipolarne il contenuto a livello di stile o a livello di codice.

Il tag div dovrebbe essere utilizzato quando non è possibile utilizzare nessun altro tag per rappresentare il suo contenuto, o quando diventa un elemento indispensabile per realizzare una determinato layout grafico (queste problematiche vi si chiariranno quando affronterete i fogli di stile 😉 ). In tutti gli altri casi, il suggerimento è di utilizzare article o section.

Ma quindi se uso div è sbagliato? E quando usare article? O section?

Section o article sono anch’essi dei contenitori. La differenza riguarda esattamente il loro contenuto e il contesto nel quale sono inseriti.

  • Section raggruppa un insieme di elementi, attorno allo stesso tema
  • Article identifica un’unità atomica di contenuto
  • Div è un raccoglitore di elementi generico, solitamente raccolti nell’ottica di implementazione di layout grafico o di struttura

Section e Article possono essere utilizzati congiuntamente: è possibile avere una section in cui sono contenuti diversi article inerenti ad un argomento, o un article a sua volta diviso in varie section.

Il tag Span

Il tag span è il corrispettivo del tag div, ma in versione in-line. Il principale utilizzo è per identificare porzioni di testo.