Это не будет делать то, что вы ожидаете:
<img src="image1.gif" alt="image2.gif" />
Атрибут ALT только для текста - он не будет делать ничего особенного, если вы дадите ему URL изображения.
Если вы хотите изначально отобразить изображение в низком разрешении, а затем заменить его изображением в высоком разрешении, вы можете выполнить некоторое кодирование JavaScript, чтобы поменять изображения. Или, возможно, загрузить изображение в div, у которого есть фоновый рисунок, заполненный изображением с низким разрешением. Затем, когда изображение с высоким разрешением загружается, оно загружается поверх фона.
К сожалению, прямого способа сделать это нет.
Ваша вторая попытка создаст ссылку на изображение2, но на самом деле отобразит изображение 1.
<a href="image2.gif" ><img src="image1.gif"/></a>
Если вы хотите открыть версию с более высоким разрешением, хорошая идея @ Сэма.
Этот CSS может работать для вас (он работает для меня в Firefox 3):
<html>
<head>
<style>
.lowres { background-image: url('low-res.png');}
</style>
</head>
<body>
<div class="lowres" style="height:500px; width:500px">
<img src="hi-res.png" />
</div>
</body>
</html>
В этом примере вы должны установить высоту / ширину div для изображения. Фактически он будет загружать оба изображения одновременно, но при условии, что низкое разрешение загружается быстро, вы можете сначала увидеть его во время загрузки изображения с высоким разрешением.