Skip to content

Bad Habits

A Cautionary Tale of Non-Semantic Markup and Donuts

I work with really great people. On their way into the office, my co-workers routinely stop and pick up a box of donuts to share. While their hearts are certainly in the right place, their donut-wielding generosity is absolute murder on my diet.

Just One Won’t Hurt, Will It?

I know I shouldn’t eat a donut.  I don’t need the calories and eating it won’t really satisfy me. In all likelihood, eating one donut will probably just make me want another. It’s really so simple. I just shouldn’t eat a donut.

That’s what I try to tell myself as I sit at my desk, staring blankly at my monitor, while a chocolate glazed calls my name. Over and over that sugary ring of deliciousness calls to me until I inevitably give in to temptation and eat a donut - and then the guilt begins.

The Bad Habits of Web Site Design

Building Web sites is like always being tempted by the delicious, yet unhealthy, lure of donuts. We know the benefits and advantages of semantic markup and keeping presentational elements out of our HTML, but just like it’s easy to say ‘yes’ to that donut, it is similarly easy to give into temptation and insert a <br /> tag into our markup to provide some visual separation.

Just like it’s unwise for us to put the belly-bursting calories of donuts into our bodies, it is equally unhealthy for us to fill our markup with visuals and presentational elements that are rightfully the domain of CSS.

Why is it so easy to say ‘yes’ to things that we know are bad for us!

Our Own Worst Enemies

In the case of donuts, the answer is easy. They taste good. Really good. It’s always hard to say ‘no’ to something when it provides us with some kind of happiness, however fleeting that happiness may be.

In terms of Web design, our excuse is often that presentational markup is quick and easy. With deadlines and budgets always nipping at our heels, the temptation to cut corners and add a presentational element is often great. Maybe it is the aforementioned <br /> tag, or perhaps it is an inline image that is a design element rather than a piece of content, or it could even be an overuse of classes or divs, the effects are the same – bloated, unhealthy Web pages.

A Healthy <body>

We often make decisions in the here and now, rather than thinking of the ultimate consequences of our actions. This is particularly true when the decisions in question are small ones.  Choices like whether to eat or not eat a donut or whether or not we should insert an inline image are minor when compared to many of the important life or project-alerting decisions we routinely need to make. That being the case, it is easy for us to ignore the long term, negative effects of a decision because we can’t see past the immediate gratification that a tasty treat or easy presentational markup will provide.

Keeping our markup lean and fit takes the same kind of determination and effort that keeping our bodies healthy requires. We have to be committed to keeping ourselves on the right track by saying ‘no’ to things that are bad for us, no matter how delicious they may taste or easy they may be to add to our HTML.

We know what the right choice is, we just need to make it.

A Routine of Good Habits

It is often said that bad habits are hard to break, but the truth is that any habit is hard to break – good ones included. The more often we make good decisions, the quicker they become part of our routine. This can often allow us to completely ignore bad choices because we don’t even consider them anymore. Such is the power of a positive routine consisting of good habits.

So while I know that the donuts will be delicious, I will thank my co-workers for their generosity, but graciously pass on their sugary offerings. I will keep the unhealthy calories out of my body the same way I work to keep the unnecessary markup out of my Web pages, and they will both be healthier and happier for the good habits I will be establishing.

Comments

Very funny analogy you have here Jeremy. And I have to say that I have to agree with 99% of what you are saying here. Our markup should absolutely be semantic and the job of presentation belongs solely to CSS. But I feel like the <br> tag gets a bad name.

Though it should not be used throughout a document to apply separation to content, there are moments when it should be used, i.e. inside of the <address> tag. Though I believe there are different schools of thought on this one, with mine being pro use in conjunction with this tag, I think it is unfair to bash poor <br> in the head if it is being used properly.

Just my opinion. Loved reading this.

Posted by Erik Ford on 02/17 at 12:45 PM

The break tag is certainly just an example and I use it largely because it is the easiest one to pick on and the one I most often see abused. Like most things in Web design, there are times when it is appropriate to use and times when it should be avoided.

Sometimes it’s ok to eat a donut.

Posted by Jeremy Girard on 02/17 at 01:02 PM

Mmmmmm… Donuts…

I love the analogy that you use. I know exactly how you feel. Sometimes, we also have people where I work who bring donuts for everybody and it’s very hard to resist it. Also, I’m the type that once I eat one, I can’t resist eating another one.

I completely agree with you on this. It’s very common to see the mixture of presentation markup and HTML. Sometimes, people just don’t know any better, but more often than not, it’s just laziness. Sometimes, it’s a lot faster to do so and because of this, people just do what’s easy.

Loved the article and I couldn’t agree more. Hopefully, your students are reading your blog as well. smile

Posted by Design Informer on 02/18 at 02:16 PM

i really adore your own writing choice, very attractive,
don’t quit and keep creating due to the fact it just worth to read it,
excited to look into far more of your current writing, goodbye smile

Posted by PerliarabiB on 03/21 at 03:22 AM

Post a Comment

Name:

Email:

Remember my personal information