headings, terza parte
E ultima, che mi sono annoiato da solo. Comunque, riprendendo le fila del discorso, l’elemento problematico è <h1>. Che cosa rappresenta in un sito? Un po’ di ragionamenti qui e su Italian Webdesign e una piccola riflessione piuttosto ovvia mi induce a pensare che le cose siano state date un po’ per scontate, senza rifletterci, riportando in una pagina Web il tipico approccio che si utilizza in un word processor, ammesso che si usino gli stili di paragrafo. Il Titolo 1 è il titolo del documento, e via a scendere.
Di conseguenza, ecco che <h1> diventa il nome del sito, e via così. Vale questo comportamento per un sito? Nì. Sembra più una consuetudine, che il frutto di un’analisi.
Da qualsiasi punto di vista si osservi l’outline (semantica, accessibilità, SEO, usabilità, architettura), a me sembra che la scelta di usare <h1> in modo ripetitivo come nome del sito su tutte le pagine sia poco sensata. Sulla home page ok, <h1> è il nome del sito, stabilisce un contesto corretto.
Ma per tutte le pagine successive <h1> dovrebbe essere il titolo che descrive, introduce l’argomento principale (come da definizione, “a heading element briefly describes the topic of the section it introduces. Heading information may be used by user agents, for example, to construct a table of contents for a document automatically”.
Mai più che il nome del sito descrive l’argomento della sezione che introduce. Quindi, per questo sito per ora ho deciso di fare così: nella home il nome del sito è <h1>, mentre per le singole pagine il tag viene attribuito al titolo del post. Mi sembra più pulito e chiaro.
Anche guardando la pagina con Document Map mi sembra tutto più chiaro e significativo, e ho scoperto (sic, era sotto il naso da anni) un illustre sito che fa la stessa cosa.
Ho aggiunto anche degli <h2> nascosti, che servono a introdurre le sezioni a cui si riferiscono, e fine della saga. Per ora…
Appendice
Ma come faccio a farlo con Wordpress?
Giusta domanda. Ci vogliono due header diversi, uno per la home e uno per le pagine singole. Di solito nei template Wordpress il nome del sito è in header.php, poi c’è index.pxp che carica il loop e mostra gli ultimi post, clic sul titolo di un post e questo viene rappresentato in single.php.
Sì, ma come faccio ad avere header diversi in modo da attribuire elementi diversi al nome del sito?
Abbastanza semplice. Basta cercare nella cartella del tema il file che carica il contenuto della home, di solito index.php. Osservando il codice, all’inizio ci sarà certamente una riga simile a questa:
<?php get_header(); ?>
Il nostro obiettivo è fare in modo che single.php (il post) carichi invece di header.php un altro header, in cui il nome del sito non sia marcato <h1>. Nel mio caso ho chiamato questo file header_single.php. È del tutto uguale a header.php, tranne che per il nome del sito ho usato un semplice <p>.
Ok, ma come faccio a caricare questo file? In single.php, ho sostituito la riga precedente con questa:
<?php include(TEMPLATEPATH . '/header_single.php'); ?>
La costante TEMPLATEPATH è una cosa piuttosto interessante, che approfondirò. Ok, magari è una banalità, ma io sono un principiante…
Nome sito
Titolo pagina
E per Wordpress, sì, se vuoi cambiare dalla home alle pagine interne - anche se, come avrai capito, non sarei così d’accordo
Per cambiare la struttura delle pagine ho preferito usare templatepath, senza ricorrere a elaborazioni, mentre userò sicuramente i tag condizionali per definire i cambi di struttura e/o stile nelle singole pagine.
Quindi, ci si arrangia un po’