Estou criando uma página que conterá muitas imagens de tamanho grande, portanto, naturalmente, quero garantir que a página seja carregada sem muitos problemas. Eu li este artigo aquihttp://24ways.org/2010/speed-up-your-site-with-delayed-content

O método de adiamento é o seguinte (retirado da página, não importa o URL)

<div>
    <h4>
        <a href="http://allinthehead.com/" data-gravatar-hash="13734b0cb20708f79e730809c29c3c48">
            Drew McLellan
        </a>
    </h4>
</div>

então mais tarde um trecho de js cuida do carregamento da imagem

$(window).load(function() {
    $('a[data-gravatar-hash]').prepend(function(index){
        var hash = $(this).attr('data-gravatar-hash')
        return '<img width="100" height="100" alt="" src="http://www.gravatar.com/avatar.php?size=100&amp;gravatar_id=' + hash + '">'
    });
});

Eu não planejo fazer isso para cada imagem, mas definitivamente para alguma imagem que eu não preciso que apareça no tempo de carregamento da página.

Este é o melhor caminho a percorrer ou existem maneiras melhores de obter um carregamento de página mais rápido ao adiar imagens?

obrigado