Tuesday, July 13, 2010
Page Weight Vanity
As long as I’ve been developing websites, I’ve alway been concerned with page weight and performance. During the development of this site, I’ve been using the Developer tools in Safari and the Web Developer Toolkit in Firefox to debug code and display issues. Safari has a nice graphical resource report which will tell you download times and file size. Initially, I was concerned that my home page was well over 100k, in fact over 200k. Then I started looking around to what other sites I regularly visit weigh. And then it hit me: page weight doesn’t matter.
No, page weight doesn’t matter, but component weight does. See, I’ve always looked at target page weight as a goal to achieve. Achieving this goal gave a sense of accomplishment. I was producing trim markup and svelte images. But as I looked closer, I saw sites that were essentially streaming not only media, but everything a viewer sees and eventually interacts with.
Take a look at BMW USA. Yes, its a Flash site, but its huge >5mb and counting. The interior pages are close to 1mb. It is a streaming site. Ok, you say that if I can afford a BMW, I can afford a fast internet connection. Ok, fair enough.
Now lets look at MSBC. It weighs a whopping 1.4mb today. Wired.com, well its only 1.15mb. All of these example sites have many components, but all the components are relatively small. The page contents build into the browser relatively quickly. The illusion of a slim, fast site is because the CSS loads very fast and its dependent components are small, so they load fast and this provides the bulk of the visual framework for the page.
As I was looking around for other articles about the weight gains of web pages, I ran across this article on the Yahoo Developer Network: Best Practices for Speeding Up Your Web Site. Some of the advice is not really the designers concern, but rather the web master.
Nonetheless, designers have a role to play in keeping page weight as low as possible. Designers are usually the last one to touch an image. Once you get tuned into your TPW you’ll pay closer attention to image file sizes and develop a visual standard for compression practices. If you’ve never had to live with a very slow Internet connection, then it may be more difficult to develop a awareness of how fast images contribute to total page weight.
To sum up, heavy page weights are quite common and don’t necessarily degrade the viewer experience through long load times—if you’re careful. Keep component weight small, always optimize images and use minified scripts. The total weight is lees important than what those components deliver to the user.
(0) Comments •