A grandi linee una cosa del genere dovrebbe andar bene:
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="script/ajax.js"></script>
<title>Documento senza titolo</title>
<script type="text/javascript">
function desc(T){
var Testo = new Array()
//lista array qui puoi modificare i contenuti e lunghezza della lista.
Testo[1] = "Qui scrivo il primo testo descrittivo";
Testo[2] = "Qui scrivo il secondo testo descrittivo";
Testo[3] = "Qui scrivo il terzo testo descrittivo";
//stampo a video il relitivo link.
document.getElementById("descrizione").innerHTML=Testo[T];
}
</script>
<style type="text/css" media="all">
#menu{
	padding: 0;
	float: left;
	width: 210px;
	overflow: hidden;
	font-family: Arial;
	font-size: 13px;
	font-weight: bold;
	height: 400px;
}
.menu li{
	display: block;
	list-style-type: none;
	float: left;
	width: 200px;
}
.menu li a{
	float: left;
	color: #000000;
	text-decoration: none;
	padding-top: 7px;
	padding-right: 7px;
	padding-bottom: 11px;
	padding-left: 7px;
}

.menu li a:hover{
	color: #466AB4;
}
#descrizione{
	float: left;
	width: 650px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #CCCCCC;
	height: 400px;
}
#top{
	height: 120px;
	width: 900px;
	margin-right: auto;
	margin-left: auto;
}
#centrale{
	width: 900px;
	margin-right: auto;
	margin-left: auto;
}
#sotto{
	height: 50px;
	width: 900px;
	margin-right: auto;
	margin-left: auto;
}
</style>
</head>

<body>
<div id="top">Pagina di prova</div>
<div id="centrale">
  <div id="menu"><ul class="menu">[*]Prima voce del menu[*]Seconda voce del menu[*]Terza voce del menu[/list]
  </div><div id="descrizione"></div>
</div>
<div id="sotto"></div>
</body>
</html>