The handcrafted XHTML code from this page
We've been writing HTML since back in the last millennium, and we've been creating markup using the XHTML 1.0 spec for over 6 years now. We write all of our markup by hand, which has given us an intimate knowledge of the language.
Looking back…
Over the past decade, the code that we've written has changed dramatically. Back in the day, we created all of our layouts using tables and spacer images. Everybody did - as it was the only way to write page code with predictable results.
But tables were never intended to be used for layout: the clue's in their name. They were really intended for presenting tabular data, but back when webpages were simple linear pages of text, tables enabled designers to use columns to create sophisticated grid based layouts which were far more pleasing on the eye.
Yesterday's menu - table soup…
While tables allowed refined layouts, they had a major drawback - all of the code that was required to create the layout had to be embedded into the page. So the words that constituted the content of the webpage were mixed up with the code that created the tables, in a mess of HTML that became known throughout the industry as "table soup".
Table based layouts had several other big inherent faults too. Because of the embedded layout code, the file size of pages could be enormous - and this was back when almost everybody was using dial-up connections. Further, the mixing-up of content and presentation data meant that pages were very difficult to de-bug when problems arose, and changing the layout later in the life of the website was not for the faint-hearted.
Layout Wars - A new hope…
By late 2003, then newish technologies were promising a theoretically superior way of generating column based webpages. But while some were evangelising about tableless design using CSS based divs and spans, those of us with clients in the real world were less enthusiastic. As while the theory was great, the vast majority of people visiting our websites back in 2003/2004 were using browsers that didn't adequately support the technology required to guarantee that pages would render as the designer intended.
However, by 2006, browsers has finally got to the point where we could contemplate making the leap. Microsoft's Internet Explorer 6 had largely surpassed the earlier versions that we causing so many problems, and Firefox was starting to take off with some vengeance. So we took our first tentative steps towards mastering pure CSS based design in 2005, and embraced it for real world projects in late 2006.
We haven't looked back.
We now produce exclusively table free layouts. So our webpages are smaller than before, which results in faster page downloads. They use semantic markup, which makes them more accessible and more search engine friendly. And more. They're just, well… better.
Layout Wars - The table strikes back…
But table based layout isn't completely dead and buried just yet. Few email clients can deal well with XHTML and CSS, so HTML emails have to be created using tables. So our decade's acquired adeptness at table layout isn't going to go to waste for some years.
HTML5
Incidentally, we're quite excited about the forthcoming new version of HTML. Version 5 is long awaited (work started in 2007), and will replace XHTML once accepted. However, we're not holding our breath; the editor of the HTML5 specification now expects it to reach the W3C Candidate Recommendation stage during 2014. So no mad hurry…
Some developers are starting to use it already, and there's no doubt that certain parts of it are proving to be desirable. We'll be using some structural aspects in our code from later in 2012, but we won't be adopting it wholesale until it's become a standard.