PDA

Visualizza la versione completa : Struttura e stile pagina html5


Mgbyte78
10-01-2012, 20:55
Salve a tutti, volevo porvi una domanda. Ho iniziato a leggere la guida in html5 e ho preso conoscenza dei nuovi elementi come i tag article, header e section. Quello che non capisco è se sostituiscono i div che usavo per il contenitore, sidebar ecc... oppure sono in aggiunta, e poi mi chiedevo se anche per essi si aggiunge il tag id per creare uno stile. Grazie.

ldetomi
11-01-2012, 15:34
I nuovi tags sostituiscono i precedenti anche se, nel caso in cui volessi proprio essere un purista della semanticità, in alcuni casi la sovrapposizione di ruoli tra il vecchio DIV con id=content e il nuovo ARTICLE non è proprio totale.... (se leggi bene in giro sui libri, avrai maggiori dettagli in merito). :ciauz:

A parte questo però, se non vuoi proprio fare il filosofo, puoi tranquillamente sostituire il classico <DIV id='header'> con il nuovo <HEADER> ed essendo comunque un tag in tutto e per tutto gli puoi assegnare uno stile via css senza dover aggiungere id o classi, ma solo usando il tag stesso come selettore. Ovviamente nessuno ti impedisce di scrivere <HEADER id='header'> ma non avrebbe molto senso.... :D

Zorinik
11-01-2012, 16:42
Ovviamente nessuno ti impedisce di scrivere <HEADER id='header'> ma non avrebbe molto senso.... :D

L'avrebbe eccome :)

Il tag header non funge solo per header della pagina, ma si può inserire ad esempio anche come header di una section e cose così, quindi impostando uno stile unico a tutti i tag "header" in taluni casi potrebbe fare abbastanza casino :)

ldetomi
11-01-2012, 16:52
Originariamente inviato da Zorinik
L'avrebbe eccome :)

Il tag header non funge solo per header della pagina, ma si può inserire ad esempio anche come header di una section e cose così, quindi impostando uno stile unico a tutti i tag "header" in taluni casi potrebbe fare abbastanza casino :)

Sì ok, e infatti avevo scritto che le cose non sono proprio sostituibili al 100% dal punto di vista della semanticità, perché le funzioni sono leggermente diverse. Si tratta spesso di finezze che apprendi se leggi i libri specifici ma che nell'uso normale raramente capitano. Diciamo che per necessità di header multipli, eviterei il banale HEADEr id='header' ma troverei più logico essere maggiormente espliciti tipo HEADER id='testata_pagina' e HEADER id='intestazione_articolo' o cose così..... :ciauz:

fcaldera
11-01-2012, 17:13
Originariamente inviato da Zorinik
L'avrebbe eccome :)

Il tag header non funge solo per header della pagina, ma si può inserire ad esempio anche come header di una section e cose così, quindi impostando uno stile unico a tutti i tag "header" in taluni casi potrebbe fare abbastanza casino :)

eventualmente se si vuole risparmiare nell'uso di un id nel markup e nel css, strutturando il markup opportunamente, può essere sufficiente vedere se l'header in questione è un child diretto del body (quindi header del sito) oppure no, ovvero puoi stilarlo solo con "body > header"

Ad ogni modo, dovendolo identificare converrebbe farlo usando i role attributes che aggiungerebbero un po' di semantica e accessibilità in più. nel caso specifico scrivendo <header role="banner"> e stilandolo con header[role="banner"]


http://www.w3.org/TR/wai-aria/roles#banner

Mgbyte78
11-01-2012, 17:32
Grazie , molto interessante. Ma cos'è esattamente l'attributo role? Ho letto la pagina inglese ma non ho capito granchè .....

Loading