Estoy creando una página que contendrá muchas imágenes de gran tamaño, por lo que, naturalmente, quiero asegurarme de que la página se cargue sin demasiados problemas. Leí este artículo aquíhttp://24ways.org/2010/speed-up-your-site-with-delayed-content

El método de aplazamiento es el siguiente (extraído de la página, no importa la URL)

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

luego, un fragmento de js se encarga de cargar la imagen.

$(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 + '">'
    });
});

No planeo hacer esto para cada imagen, pero definitivamente para una imagen que no necesito que aparezca en el tiempo de carga de la página.

¿Es esta la mejor manera de ir o hay mejores maneras de lograr una carga más rápida de la página al diferir las imágenes?

Gracias