In Lesson 1 of this tutorial, we learned how to manipulate images to reduce your download time. Now, it’s time to dig even deeper into the fine art of slimming down those pages.

We’re going to talk about page layout, and that means talking about HTML tables, first and foremost. First, because table-based layouts are the de facto web standard, and foremost because table-heavy designs have a nasty reputation for poor performance.

And CSS layout? It’s faster, better, and smarter. We’ll cover it later. Now, you’re welcome to skip ahead, but The House bets that you’ll keep reading.

CSS is cooler than tables. And smaller. And in the long run, its better. But some CSS-2 layout standards still aren’t showing up the same in every browser. So let’s face it — sometimes right-now compatability trumps future-compatability.

Tables aren’t all bad, anyways. Most designers are taught to design with a grid, so dropping things into a table comes naturally. We’re also fond of their duality; variable-width tables can both define a layout and respond to the unpredictable elements of a page. Being a web designer means coping with unpredictability, and striking a compromise between your design and the user’s flexibility. (Users should be afforded the ability to make fonts larger, for instance). Unfortunately, tables also increase the time it takes to display a web page, and sometimes by a substantial amount.