semantica e tag H1

[liviasettantuno]

Salve a tutti,
Chiedo chiarimenti su un tema già trattato ma la cui lettura mi ha aumentato i dubbi invece che dissiparli.. Spero che qualcuno mi possa fare chiarezza e possa al contempo esser di aiuto ad altri lettori.

Parliamo di semantica e tag <hx>.

Dai tanti post letti sulla rete mi pare di intendere che ci deve essere un solo H1 in tutta la pagina web e che le sequenze dei tag titoli deve rispettare assolutamente l'ordine h1 - h2 - h3 - etc...

Le mie domande sono quindi le seguenti:

Se nella mia pagina ho tanti div id, posso avere più di un tagH1 o questo deve essere destinato solo al tiutolo della pagina web?

Se come sui giornali sopra ad un titolo volessi mettere un occhiello (L'occhiello (o sopratitolo) è una frase opzionale di dimensioni non superiori alle due righe e generalmente di una sola riga, posta al di sopra del titolo di un articolo di giornale o rivista o di un libro. Il carattere tipografico utilizzato ha un corpo inferiore a quello del titolo sottostante.), mi verrebbe naturale mettere prima un h2 e poi a seguire un h1; ma ho letto che è semanticamente sbagliatissimo. Come trattereste voi una situazione del genere?

Grazie in anticipo

[ricman]

Bella domanda. Guardando come hanno gestito l'html 5 verrebbe da dire che ogni sezione del sito può avere il proprio H1 e che quindi sia corretto averne più di uno anche nell'html 4

[gcarless]

L'ordin h1>h2...>h6 deve essere essere rispettato sempre.

Per la tua domanda, del tag h1 unico in una pagina, io ho questo pensiero.

Io posso avere più di un h1 in una pagina, l'importante è che in quella sezione abbia UN unico h1 che ne definisce il "primo titolo".

Piccola cosa, se per assurdo ci andrebbe solo un tag h* per pagina, credo che il validatore del w3c segnalerebbe almeno con un warning la cosa.

[liviasettantuno]

grazie per le vostre considerazioni, ne terrò sicuramente conto.
Quindi sul discorso dell'occhiello, andreste ad usare un <p class...>?

[ricman]

Originariamente inviato da liviasettantuno
Quindi sul discorso dell'occhiello, andreste ad usare un <p class...>?

Magari con un EM o uno STRONG giusto per rinforzare un pochino quell'H1

[bobosg]

imho semanticamente non è scorretto avere h2 > h1 > h3
l'importanza della semantica sta nell'assegnare ad un elemento corretto (semanticamente appunto) al contenuto.

chiaro che se per dare importanza visiva ad un testo usi un <hn> semanticamente stai commettendo un errore (grave direi)

ad ogni modo non troverai delle regole ben precise sull'argomento anche se un buon libro sugli standard e sulla semantica e d'obbligo.

comunque ti basta un pò di buon senso

[liviasettantuno]

mi segnali dei testi sull'argomento? grazie

[bobosg]

primo su tutti "Sviluppare con gli standard web" del guru Zeldman

[liviasettantuno]

già letto

[Marcolino's]

Puoi usare tutti gli h1 che ti servono, anche se discussioni del genere ce ne sono a bizzeffe, in realtà il W3C non ha detto uno e uno solo, ma

Un elemento di intestazione descrive brevemente l'argomento della sezione che esso introduce. Le informazioni di intestazione possono essere usate dai programmi utente, ad esempio, per costruire automaticamente un sommario per un documento.

Vi sono in HTML sei livelli di intestazione, con H1 come il più importante ed H6 come il meno importante. I programmi utente di tipo visuale riproducono di solito le intestazioni più importanti con caratteri più grandi di quelli usati per le meno importanti.

L'esempio successivo mostra come usare l'elemento DIV per associare un'intestazione con la sezione del documento che la segue. Questo metodo consente di definire uno stile per la sezione (colorare lo sfondo, impostare il carattere, ecc.) con i fogli di stile.
HTML 4.01

La regola sembrerebbe che ci devono essere tanti livelli 1 quanti sono gli articoli nella pagina, e mi pare anche giusto, però in genere facendo l'esempio del giornale, il titolo del giornale che definisce la testata viene solitamente reso con h1, quindi molti decidono di dare il livello 1 solo a questo e di scendere poi in h2 per le varie testate e usare h3 per le tagline dove non è mai conveniente usare un grassetto o un inclinato per enfatizzare un'intera frase, perché servono a evidenziare una porzione di testo, poi il secondo stanca alla lettura se il testo è molto lungo.
Dal punto di vista semantico è comunque corretto usare un'intestazione dato che la tagline non è un paragrafo ma la spiegazione del titolo dell'articolo, in pratica un'introduzione.
In effetti l'occhiello non è la tagline, l'occhiello viene prima del titolo e serve a spiegare il "dove" e "quando" dell'argomento trattato (fonte: http://www.zanichellibenvenuti.it/it.../esercizi.html).
Mentre la tagline "spiega" il titolo e si trova solitamente sotto di esso. (fonte: http://www.mestierediscrivere.com/in...ticolo/tagline)

Scrive Mariuccia Teroni sul Manuale di Redazione (Apogeo) a pagina 176 riguardo i titoli:

I titoli hanno il compito di individuare e di specificare l'argomento contenuto in un testo.
Quando si deve specificare un titolo (possibilmente scritto con la sola sola iniziale in maiuscolo) si dovrebbe renderlo in forma breve... omissis...

seguono indicazioni sul tipo di carattere da usarsi per i titoli, con indicazioni sul tipo di font, peso, inclinazione, eccetera in funzione dell'argomento trattato ma che qui non credo serva indicarli.
In tutto ciò non si parla specificatamente di livelli.

A dire il vero non ho mai trovata nessuna indicazione categorica sull'uso dei livelli tranne quella, ovvia, di usare le intestazioni con i numeri sequenziali a discendere per ogni box informativo, o pagina o sezione di pagina, anche se lo stesso W3C per infondere confusione scrive:

Sezioni numerate e riferimenti
L'HTML non produce di per sé stesso la generazione dei numeri di sezione a partire dalle intestazioni. Questa agevolazione può tuttavia essere offerta dai programmi utente. Tra breve i linguaggi per i fogli di stile come CSS consentiranno agli autori di controllare la generazione di numeri di sezione (comodo per i riferimenti in avanti nei documenti stampati, del tipo "Si veda la sezione 7.2").

Alcuni considerano il saltare dei livelli di intestazione una cattiva consuetudine. Essi accettano H1 H2 H1, mentre non accettano H1 H3 H1, poiché il livello di intestazione H2 risulta saltato.

Ad ogni buon conto di tutto questo ambaradan già se ne discuteva nel lontano luglio 2004 nei forum di Diodati, che in particolare rispondendo ad un interlocutore scriveva sull'argomento

Non riesco neppure ad immaginare perché dovrebbe essere necessario saltare dei livelli: se su una pagina ci sono titoli di livello gerarchico differente, dopo aver marcato con H1 il più generale cosa vieta di marcare con H2 quello di livello immediatamente inferiore? Forse tu stai pensando a oggetti della pagina che non sono direttamente collegati gli uni agli altri.

Interessante è leggere tutta la discussione pur se lunghetta (49 post).

M.