Um recurso muito interessante que pode agilizar o carregamento da página é somente carregar do servidor as imagens quando o usuário as visualizar. Esta técnica é conhecida como Lazy Load e o existe um plugin jQuery para fazer isso Lazy Load Plugin for jQuery que é bastante simples.

Primeiramente inclua as bibliotecas jQuery e Lazy Load Plugin for jQuery:

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.lazyload.min.js" type="text/javascript"></script>

A ideia é que quando a página for carregada as imagens do site irão carregar uma imagem pequena na marcação img e quando a marcação img realmente aparecer o javascript irá carregar a imagem correta, então deve colocar a imagem padrão pequena no atributo src e a imagem a ser carregada no data-original, lembrando ainda que como a imagem que carregará por padrão é pequena(tipicamente uma 10×10) se faz necessário colocar o tamanho da imagem “real” nos atributos width e height para evitar redimensionamento ao rolar a página.

<img class="lazy" src="img/grey.gif" data-original="img/imagem_grande01.jpg" width="600" height="600">  

Agora que já temos a imagem é só iniciar o plugin.

$(document).ready(function(){
    $(".lazy").lazyload();
});

Também é possível colocar um efeito de fadeIn para fazer a transição para aparecer a imagem.

$(document).ready(function(){
	$(".lazy").lazyload({effect : "fadeIn"});
});

Segue um exemplo utilizando imagens do Instagram