Hola:
El problema está en que el parámetro de mostrar tiene que ser el id de la imagen, y ahora solo pones el id de la capa contenedora... es cierto que las imágenes ensanchan la capa, pero eso tiene fácil solución usando estilos, por ejemplo con position:absolute... o en vez visibility, alternar la visibilidad con display...
Código:
<map name="Map4">
<area shape="rect" coords="68,73,244,105" href="#" onclick="document.getElementById('derecha').src='img/ImagenDerecha1a.png'; mostrar('capa1');">
<area shape="rect" coords="65,255,185,286" href="#" onclick="document.getElementById('derecha').src='img/ImagenDerecha2.png'; mostrar('capa2');">
<area shape="rect" coords="67,196,181,229" href="#" onclick="document.getElementById('derecha').src='img/ImagenDerecha3.png'; mostrar('capa3');">
<area shape="rect" coords="67,135,180,166" href="#" onclick="document.getElementById('derecha').src='img/ImagenDerecha4.png'; mostrar('capa4');">
</map>
...y
Código:
<td width="585" height="363"><div align="left">
<img src="img/ImagenDerecha1a.png" id="capa1" style="visibility:visible" width="385" height="363" border="0">
<img src="img/ImagenDerecha2a.png" id="capa2" style="visibility:visible" width="385" height="363" border="0">
<img src="img/ImagenDerecha3a.png" id="capa3" style="visibility:visible" width="385" height="363" border="0">
<img src="img/ImagenDerecha4a.png" id="capa4" style="visibility:visible" width="385" height="363" border="0">
</div></td>
Si no sólo va una imagen, simplemente ponlas en capas con los id's que quieras mostrar, con el resto de contyenidos de cada capa.
Saludos