Comments
CSS and background images question
Written By gigawatt on Feb. 5, 2008.
3 Comments
Report Note
+ Clip This
I was working on a site a few months ago. The design called for each section to have a different color scheme, and therefore a different masthead background image. I was using the Full Page Test on Pingdom.com to see how my load times were looking, and I noticed that all 9 masthead background images were loading, even though only one was being called by the HTML - every background image in the CSS was being downloaded, regardless of whether the HTML called for it or not. I double checked by testing 9rules.com in FPT, and it was the same result - all the background images loaded for every page.
Does anyone know if this a quirk of the FPT on Pingdom, or if this is what actually happens? What I ended up doing was stripping out the section specific background image styles and linking them in separate CSS files for each section to save the unnecessary ~250KB per page load. I'm wondering now if I did this just to make FPT happy, or if it actually affects my site in the real world.
Oli
Written Feb. 5, 2008 / Report /
I think it's likely a limitation of the test. They won't be using a real browser, so they have to interpret the CSS themselves, probably by stripping out each and every @import and then finding the url(*) parts, and not trying to check if they are actually used (as that would be nauseatingly painful to implement).
gigawatt
Written Feb. 5, 2008 / Report /
Thanks, Oli. That makes sense. I tried this Web Page Analyzer and got the same results as Pingdom's, so I shot them an email to see if I could confirm what's going on. I'll report back when I hear.
gigawatt
Written Feb. 5, 2008 / Report /
You were completely correct, Oli. From the horse's mouth: