2011-02-07 12 views
5

Tengo un pequeño problema aquí. Soy un desarrollador web principal y actualmente estoy construyendo este sitio para un proyecto que estoy obligado a hacer. Quería que se vea bonita con una imagen de fondo. Creé la imagen en Photoshop y la guardé en la web como .jpg y terminó siendo 58.8k de tamaño.¿Qué tan grande es demasiado grande cuando se trata de imágenes de fondo?

Estoy a favor de los sitios web que se cargan rápido para el usuario, pero me pregunto si menos de 60k está bien? Lo revisé en la extensión yslow de Firefox y se carga para mí en 96 ms (tema de prueba ligeramente pobre - http://www.speedtest.net/result/1146275377.png)

¿Es demasiado 60k, es una mejor práctica tener imágenes de solo 10-20k? ME ODIO cuando veo una imagen cargando ... simplemente ... ni siquiera vale la pena el gráfico en ese punto. ¿Hay formas más rápidas de cargar una imagen de ese tamaño? CSS o etiqueta? ¿O no debería preocuparme por eso?

Respuesta

1

La mayoría de los navegadores cargan la última imagen de fondo por defecto, por lo que no debería tener un problema.

El tamaño es demasiado grande depende de la configuración de tu hosting, la cantidad de tráfico que recibe tu sitio y la tasa de transferencia típica de tus visitantes.

60k me parece razonable para un sitio promedio con demasiados visitantes simultáneos. Sin embargo, el ancho de banda cuesta dinero y esta es la razón por la que rara vez se ven imágenes de ese tamaño en grandes sitios. Por otro lado, youtube transmite regularmente videos que son miles de veces más grandes que la imagen de fondo que usted propone. Es imposible darle consejos precisos sin saber mucho más sobre su sitio, su solución de hosting y sus estadísticas de uso.

Lo más probable es que si hace esta pregunta, 60k está perfectamente bien.

Si desea garantizar que sus cargas de imagen de fondo primero o el último que puede hacer:

<script type="text/javascript"> 
bgimage = new Image(); 
bgimage.src = "http://www.olhovsky.com/img/cdf97/256fwt1_eg.png"; 
</script> 

lugar que el código de la etiqueta de cuerpo para precargar la imagen de fondo. Colóquelo más abajo en su documento html para cargarlo más tarde (por ejemplo, después de la etiqueta </body> para cargar el fondo al final).

Y luego en el cuerpo de la etiqueta:

<body onload="document.body.background=bgimage.src;"> 
1

No creo que 60k es demasiado grande, aunque es probable que desee mirar a sus usuarios probables y pensar en lo que sus velocidades de conexión serán similares. Si desea intentar y comprimir el tamaño del archivo tanto como sea posible, intente también con smushing it y es posible que vea que baja un poco más.

+0

¡Me olvidé de eso! ¡Muchas gracias, bajé a 54.6k! – Phil

Cuestiones relacionadas