Offline, ads are something to be admired. I enjoy looking at billboard ads, and have been found to take more interest in the marketing materials handed out at NBA games than the games themselves (sorry, just not a big sports fan!) As for commercials, I’m blessed with TiVo so the last time I watched a commercial was… well, actually, a few days ago when I was sick and for the first time in years I actually watched live TV.

I was pretty appalled by what I saw. I don’t know if all commercials were just that bad or if AMC gets the special selection of commercials rejected from the “real” networks.

But let’s get back to online ads. I’m blind to them, mostly, but recently came across some ads that are just absolutely spectacular. So far I’ve only seen these ads on a few sites, but they do a phenomenal job of using up otherwise empty background space.

The first time I came across one was for the TV show Burn Notice. I can’t remember the site, probably tv.com or some other entertainment site. Unfortunately I didn’t take a screenshot, as that was absolutely the best one I’ve seen since, absolutely beautiful. But I got a screen capture of another ad for a TV show, Sci-Fi’s Eureka.

You can see how the top center banner ad actually flows into the background of the site, creating a full-page ad without getting in the way of the page’s content. You can see, if you scroll the page a bit, that the image ad moves but the background doesn’t.

In this case it doesn’t cause too much of a break in continuity, though you can clearly see the hard lines. I’ve seen others where the continuity break between background and banner was more drastic.

Since I work with four monitors I wanted to stretch this out to its limit, just to see how wide the background goes. It fills out pretty nicely. Of course the main action is close to the page body content, but for those with wider screens it goes pretty far before going black.

As far as ads go, these ads pretty much rock the ad world. I love the fact that they are using background space that otherwise serves no real purpose and that the background is a continuation of the main center banner area.

But this one took the whole concept a step further. It’s interactive! Click any of the images in the main banner ad area and you can change the background to your liking.

This one is my favorite:

If Salli Richardson-Whitfield isn’t enough of a reason to put aside your ad-blindness, then I don’t know what is!

There are generally four things that cause code bloat:

• On-page styling
• On-page JavaScripts
• Excessive table usage
• Poor HTML formatting