Secondo alcune teorie SEO, assolutamente testate, pare che la posizione dei contenuti all’interno del HTML sia piuttosto rilevante. Cambiando però punto di vista secondo le teorie dell’usabilità sarebbe buona cosa che il menù di navigazione apparisse prima di tutto. Tali teorie sono riportate anche nel documento di accessibilità della legge Stanca.
Ma sono due cose in contrasto, come fare? Dal punto di vista del codice putroppo non ci sono soluzioni, chi è sopra è sopra, chi è sotto e sotto! Dal punto di vista visuale però possiamo fare qualcosa.
Ho lanciato la provocazione tecnica anche agli amici del forum di HTML.it. Inizialmente il titolo non è proprio piaciuto, forse ho esagerato. L’argomento però si anche se purtroppo la discussione non è stata così fruttuosa. Alla fine una soluzione insieme l’abbiamo trovata, purtroppo però obbligatorio l’uso di Javascript.
L’esempio lo trovate nella pagina Vertical Switch Div. La soluzione si basa su questo CSS:
#myDiv1{
position: absolute;
top: 100px;
}
#myDiv2{
position: absolute;
top: 0;
}
E su questo script javascript richiamato dopo la lettura dei due DIV:
function myDiv1Top(){
var d1 = document.getElementById("myDiv1");
var d2 = document.getElementById("myDiv2");
var margine = 10;
d1.style.top = d2.offsetHeight + margine + "px";
}
Per il funzionamento completo fate riferimento alla pagina linkata sopra e al suo codice. Dopo aver letto i due DIV, viene richiamata la funzione javascript myDiv1Top, la quale prende l’altezza (d2.offsetHeight) del primo DIV da visualizzare (myDiv2) la somma a un margine e setta l’attributo TOP al secondo div da visualizzare (myDiv1).
Se avete esigente diverse grafiche o più DIV dovete chiaramente giocare con margini iniziali e sommatorie multiple delle altezze. Non mi sembra una grande soluzione, però sinceramente non ne ho trovate altre. Se ne conoscete sarò ben lieto di pubblicarle e riportarle su HTML.it.
Le ultime al bancone