Ups and Downs and Everything In Between

If you’re anything like me, you’re not very willing to compromise. At least, not on things like your happiness, your dreams, your ambitions, or your web site’s accessibility. Unfortunately, due to the less than ideal reality in which we live, compromise often seems less of a choice and more of a necessity.

Thus the story of the building of a web site.

Okay, enough dramatics. I recoded the whole thing to use a single, large-scale table for basic positioning needs, and then tweaked and proded with CSS to arrive at a solution that works for all parties. Amazingly, this solution may actually be better than the original code I came up with, and here’s where the philosophizing comes in.

First of all, though there were some very tricky problems I needed to (and successfully did) overcome which mostly centered around semantic markup and source-order, the table’s role in positioning the elements here is something I am far more used to. Using CSS as the styler with a table wrapper and nested divs where needed actually talk me more about using CSS than did positioning the layout solely from the CSS.

No doubt, this has only to do with my incomplete knowledge of CSS2 positioning, but the point here is that I made more progress in this recoding effort in terms of my own advancement than I had made in the first attempt.

It also felt a lot easier this time around.

Maybe that’s because I’m simply more knowledgeable now than I was 2 weeks ago. Still, this relatively insignificant difference does not, I don’t think, account for the vast improvement of the quality of my code. Even I can see my original attempts riddled with “errors.” Of course, the whole thing is subjective in the first place.

Better code is only different code. The question to pose is: better in what way?

It’s more semantically correct.

I was surprised, but this is actually true. This second recoding provided the opportunity to go over much of the markup and strip out unnecessary and thus “incorrect” code snippets. For instance, there’s no need to place a p tag around the one and only block of text inside a blockquote tag. This is at best redundant so all those extra tags went.

The CSS is more effective.

Naturally, this process of ripping out useless markup also helps in a variety of other ways such as page weight (a little), and the coming CSS’s effectiveness (a lot). Indeed, more than just extra tags were lost in this process. Excessive labelling of tags such as <p id="explanation"> went bye-bye, since they were actually useless too.

Instead of writing CSS rules specific to each individual element (possible, but laborious and excessive), with a sounder understanding of the possibilities I was able to far more eloquently select tags using descendant selectors and selector specificity to accomplish the same task with nearly half the CSS code as I had before. Although I must admit that some of this was due to the positioning property of the main table. Yet even the table element’s attributes such as width and background were all removed from the markup, leaving an easy to read, easy to style html page.

And, this was the real shocker, but it is actually easier now to re-skin the whole page since I started (as I probably should have done in the first place) with the big things first. Simple logic, but it takes experience and practice to get it right, even when I think I have it nailed.

Most important of all, I am focused once again.

Having the energy to devote to working on what you love can only be accomplished when you rid yourself of worries, anxieties, and fears. Easier said than done, but I shall leave it at that.

I’ve created this place as a space to publicly express continuing feelings on bipolar disorder, and to talk about anything in a related vein. Let’s see how this goes.

A little while ago, I’ve just completed a spectacular, four-column, semi-liquid layout without a single table in the markup what so ever. It is entirely semantic, utterly accessible, incredibly lean, visually stunning…and a disaster in only the one browser that 95% of the population uses. Internet Explorer for Windows. As this is my first major success with CSS-based design, this is nothing short of maddening.

As a compromise, I’m going to re-code the whole thing using a large scale table for basic positioning. With a few aces up my sleeve, I hope to preserve most of the accessibility features. Here’s hoping. :)

Alternatively, this post could merely be titled, “Yet more never ending reasons to avoid Microsoft Internet Explorer like the plague.” And I’ll let Doug explain it. ::sigh::