I have a colorful background image of 2000px x 1500px, and because of the details, I save it as a jpeg that displays 1.1 MB. I am using the CSS background property to render the image. Therefore, being relatively new to web developers and working with a client / designer who do not open to change the design at this stage of the process, I must do this to help this image load incredibly fast. I do not know if this matters, but the site uses Joomla 1.5.9. This is what I always wanted to understand, but I had problems finding solutions for ... I hope someone can help!
Thanks everyone!
. , , ; , CSS (, , ), .
JPEG . , . , ( ), , . , (, , , , , ).
, , . , smush.it. , , res, . , . about.me 100 , 1200 .
,
<script> (new Image()).src = "IMAGE PATH"; </script>
, , , , cs5, -, , yahoo smush.it
http://www.smushit.com/ysmush.it/
, , , - setTimeout -
* CSS
body{ opacity:0; }
* JQuery
setTimeout(function(){$('body').animate({opacity:'1'},300)},5000);
.
, ? , 1.1MB.
- style <body> background: url(image.jpg) onload?
style
<body>
background: url(image.jpg)
Image transfer via CDN is likely to speed things up; the best of them are typically optimized to deliver the proper TCP packet / MTU size to a wide range of clients, and usually do a lot of work to detail the delivery of things quickly. Slow connections, such as cell phones, will still hate you, but getting things like packet size can provide the maximum available bandwidth.