Mejorar la carga de imágenes para el usuario
by Ricardo Gil on December 6, 2008
A la hora de cargar ficheros JPG en la web debemos tener en cuenta que existen dos maneras de guardarlos y que implican diferencias sustanciales a la hora de mostrarlos online. Un fichero JPG puede ser de tipo baseline o de tipo progressive.
Qué implica cada tipo
Los ficheros baseline son el tipo de ficheros JPG por defecto. Los que al guardar o exportarlos los programas de edición salvan por defecto. Su visualización en un navegador sería algo como:
Es decir el fichero se va cargando progresivamente, y los que recordéis la época de las conexiones vía modem o los que disfrutéis ahora de conexiones 3G, sabréis lo frustrante que puede llegar a ser la carga de una imagen relativamente grande.
Los ficheros progressive son la otra opción. A la hora de exportar un JPG los programas de edición tienen la opción de “visualización de navegador progresiva”, “progressive browser display”, o algo similar. Su visualización en el navegador sería similar a:
El fichero se carga parcialmente y va mejorando su nitidez conforme se descarga.
Qué aporta el método progressive al usuario
El usuario tiene un feedback de qué se va a cargar y por tanto puede decidir si continuar la descarga o no, mejorando su experiencia en la web. Si considera que la imagen le aporta valor pueda dejar que se descargue, si por el contrario piensa que no puede cancelarla, tener una referencia de la imagen original y leer el contenido.
Además, en pruebas realizadas con más de 10.000 imágenes se ha comprobado que los JPG progressive ocupan de media un 11,45% menos que los JPG baseline. Otro motivo más tenerlos en cuenta.
Más información en: Yahoo! User Interface Blog


3 comments
Muchas gracias.
Y muy útil.
Para que digan que el saber no ocupa lugar.
by elastragalo on 6 December 2008 at 12:15 pm #
Lo has explicado estupendamente, Ricardo. Me da la sensación de que la práctica de guardar los JPG como tipo progressive se está perdiendo apoyándose en la disponibilidad de conexiones a internet cada día más veloces. Sin embargo, como bien dices, es fundamental que los diseñadores y desarrolladores seamos conscientes de que la navegación desde dispositivos móviles cada vez es más habitual, y que por tanto sigue siendo muy importante una carga optimizada, rápida y progresiva de las imágenes.
by Sergio on 11 December 2008 at 7:04 pm #
[...] Visto en El Clérigo [...]
by Jose AlvarezCarbajal » Archivo » JPEG baseline vs. progressive on 6 January 2009 at 7:25 pm #