Impostando, tramite i CSS, la larghezza dell'immagine con le unità percentuali, l'area occupata dall'immagine stessa dipenderà dalla larghezza della finestra del browser (vedi la pagina di esempio), come illustrato nella seguente immagine.
L'immagine di copertina, che dovrà essere dimensionata in modo proporzionale, sarà selezionata attraverso l'attributo id="copertina".
Come precedentemente detto, l'area dei contenuti occuperà il 40% dell larghezza della finestra, mentre l'immagine di copertina occuperà il 100% della larghezza dei contenuti:

<html>
<head>
<style type="text/css">
#contenuti {
width:40%;
padding:0 1em 1em 1em;
}
img#copertina { width:100% }
</style>
</head>

<body>

<div id="contenuti">
<h1>Esempio</h1>
[img]immagine.jpg[/img]
</div></body></html>

Credo che tu possa stabilire una percentuale anche per l'altezza, ma rischi di deformare l'immagine. Ti conviene impostare solo la larghezza per un caso come il tuo.