CSS Is Crap - the Sequel (Trequel? Trefoil? Trinity?)
So I bitched on here before about how I thought that CSS was total and utter crap. A design quagmire, built by committee, polished by someone with syrup all over their hands, and implemented by the most batshit of batshit inmates in the asylum.
Lots of people didn't agree with me. So I offer you a challenge:
Recently I rebuilt the X-Ray Kid Software website. (I'm in round 2 of rebuilding it right now so that the layout can handle longer pages).
Here's the requirements for it, although it's probably easier to look at the site itself:
- Single column design, which must be able to contain a variety of column layouts (check out the main page and the team page for examples)
- The main column must be centered on the page.
- A footer must appear at the very bottom of the screen, expanding the container above it down to meet it (for the background image)
- If the content + footer is longer than the window, the footer should appear at the bottom of the page, and the page should scroll. The footer must remain flush with the bottom of the browser window even after scrolling.
- The background image must appear as shown on the site; it's positioned relative to the main, centered column.
- Most content is in the form of blocks in the main panel which have a stretch area in the middle, rounded corners, and an image based title (or potentially buttons in the footer of the blocks).
- Nav bar must be aligned to the right, at the top of the column, and must be baseline aligned with the logo's major axis.
- Must work in all major browsers - Chrome, Opera, IE6, IE7, Firefox 2, Firefox 3.
I must admit, I wussed out on this one. I wanted to do it all as tables, but that wasn't going to work. Then I tried all CSS, and that didn't want to work either. So the result is the bastard child of CSS and Tables. And then comes the footer, which is all handled with Javascript. It's certainly not perfect, but it works. The new version I'm putting together works even more consistently.
I dare you to do this entire site using nothing but CSS, and still have the HTML document be readable.
Now, if I was implementing HTML & CSS from scratch, I'd have implemented this completely differently. It shouldn't take 3 or 4 days of experimentation in different browsers, rebuilding graphics, messing with combinations of styles, reparenting DIV hierarchies etc to make this kind of a site. There's nothing to it really. Back in the day, I would have put together that site like this, which would take less than a couple of hours to put together. But the demands of a modern website don't allow you to get away with something that is as unpolished as that.
I've had a website up online since 1994 (one of the first homepages on the net, and one of the few that has been consistently online since then). Sure, the URL has changed occasionally as its moved from server to server, but it has been there.
And you know what? Web development today is actually exponentially more difficult than it was back then.
Why the hell is that the case? Software's supposed to get more refined and work better over time. Not worse. Admittedly, we're asking a fair bit more of it today, but frankly, the whole system needs an overhaul.
(more...)