Buonasera a tutti, sono alla ricerca di una cosa difficile: un menu "multilivello" accessibile, per una pagina accessibile.

Ho sviluppato la seguente pagina di test:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xthml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it">
<head>
<title>Esempio uso CSS per l'impaginazione</title>
<link rel="stylesheet" type="text/css" href="impaginazione.css" title="default"/>
</head>
<body>
<div id="mainbox">
<div id="testata">
<h1>Testata del sito</h1>
</div>

<div id="colsx">
<h2>Colonna sinistra</h2>


Testo della colonna sinistra</p>
</div>

<div id="coldx">
<h2>Colonna destra</h2>


Testo della colonna destra</p>
</div>

<div id="colmain">
<h2>Colonna centrale - Titolo</h2>


Testo della colonna centrale e via dicendo...</p>


...ora non ci resta che provare.... </p>
</div>

<div id="footer">


Footer, pi&egrave di pagina.</p>



</p>
</div>
</div>
</body>
</html>

con il seguente foglio di stile:

/* Impostiamo il corpo del documento, associato all'elemento BODY */
body {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 1em;
color: #000;
background-color: #fff;
}

#mainbox {
border: 1px solid #000;
background-color: #999;
}

#testata {
border-bottom: 1px solid #000;
color: #9ff;
background-color: #036;
}

/* Questo è riferito all'attributo: id="colsx" */
#colsx {
float: left;
padding: 5px;
width: 150px;
color: #fff;
background-color: #999;
font-size: 80%;
}

/* Questo è riferito all'attributo: id="coldx" */
#coldx {
float: right;
padding: 5px;
width: 150px;
color: #fff;
background-color: transparent;
font-size: 80%;
}

/* Questo è riferito all'attributo: id="colmain" */
#colmain {
color: #000;
background-color: #fff;
margin: 0px 156px 0px 160px;
border-left: 1px solid #000;
border-right: 1px solid #000;
}

#footer {
border-top: 1px solid #000;
clear: both;
color: #fff;
background-color: #036;
margin: 0px;
padding: 0px;
font-size: 11px;
}

p {
margin: 0px;
padding: 5px;
}

/* Ci serve che anche i titoli all'interno della tabella siano personalizzati... colori, dimensioni, margini...*/

h1, h2, h3 {
margin: 0px 0px 0px 0px;
padding: 5px;
}

#coldx h2, #colsx h2 {
font-size: 100%;
}

#testata h1, #footer p {
text-align: center;
}

Scusatemi il lungo copia ed incolla, ma un onesto file .zip in questo forum non si può allegare...
L'obiettivo è, a questo punto, inserire un menu dinamico nella colonna di sinistra ("colsx").
Vedo almeno due difficoltà:

- un menu "a più livelli" che sia accessibile
- quando linko un'altra pagina del sito, ovviamente ne carico una creata a partire dallo stesso modello: come conservare il menu "aperto" allo stesso sottolivello della pagina chiamante?

Spero di aver dato un suggerimento a qualcuno....
Kisses,

Nat