View Sidebar
Blogging Refocus and Page Size

Blogging Refocus and Page Size

February 3, 2010 8:00 am4 comments

As part of my planning for 2010, I decided to write new vision statements for some of my web sites and put myself back on a content creation schedule.

This site (ardentdev.com) will now be updated every Wednesday, so stay tuned via the RSS feed or subscribe by email.

New Design

I decided to simplify the design, opting for a clean white background, more whitespace, and less colour.  Hope you find it easier to read.

ardent2010

Page Size Optimization

One of my goals in redesigning the site was to reduce the page size a bit.  I like to include images in my posts so going overboard on optimization wasn’t going to make total load time much better, but small improvements are always welcome.

Thanks, YSlow

To measure my optimization progress, I used YSlow.  YSlow is a Firefox add-on that integrates with Firebug.  Firebug is a web development add-on for Firefox.  I highly recommend you hook yourself up with the Firefox + Firebug + YSlow triad of awesome if you do any web development.

My quest for page size reduction began with cleaning out the old WordPress theme.  For example, by removing Recent Posts and Recent Comments from the footer, I reduced the amount of HTML and gained the happy side effect of reducing the number of database hits required to build a page.

ArdentDev.com serves its HTML content compressed.  At the time of the design switch, the old theme was sending down 13.7K of compressed HTML for the home page.  The theme changes reduced that to 12.4K.  Dropping the number of posts shown on the home page from 10 to 5 brought things down to 7.7K.  That’s 6K less than the original (not including images from posts no longer visible on the home page).

I did a clean up of the CSS files for the site as well.  The site has a CSS file for web browsers and a CSS file for printing.  With some editing and some whitespace removal, the CSS files went from 4.6K down to 3.2K.  It was not a super thorough scrub of the CSS, but I trimmed another 1.4K.

The previous theme referenced nine images via the CSS file.  I dumped all those extraneous little images, which knocked  29.8K off the page size.  I then introduced a new logo that added back 2K.  That left a 27.8K reduction, not to mention 8 fewer HTTP requests.

I also dropped a banner ad that removed 0.4K of JavaScript and an additional HTTP request (plus another subsequent HTTP request to download the ad itself).

Net Gain (Well, Net Loss Really…)

The total reduction in page size came out to 35.6K as well as 9 fewer HTTP requests (not counting the request for the banner ad).  For a broadband Internet user, the optimizations should make the home page load 1/10 to 1/4 of a second faster than before.  Not a massive savings but a rewarding exercise as I searched for ways to reduce the bulk of the home page.

Everyone’s mileage will vary but please leave a comment about your own page optimization experiences.

Previous YSlow Stats

yslow-prev 

New YSlow Stats

yslow-newest

4 Comments

  • yslow is one the best programs out there

  • Does anyone know what is the optimanl page loading speed?
    Mine is about 2seconds. Does page load speed has something to do with SEO?

  • According to Evernote’s blog post, Clearly will even automatically turn a multi-page article into a single page so you no longer need to click from one page.

  • Does anyone know what is the optimanl page loading speed?
    Mine is about 2seconds. Does page load speed has something to do with SEO?