I’ve only just launched a client website, and already a good friend of mine has reminded me of the importance of a semantic website structure. Why? Because I used an empty b tag to attach graphics. I sacrificed semantics in favor of style and a little bit of ease of use.
Specifically, I needed to create a liquid height box with rounded corners. The HTML was roughly like this:
... content ...
The benefit of this empty b tag is the ability to attach the bottom rounded corner graphic to it and have it stay at the bottom of the box no matter the height.
Sound harmless? Not so. The b tag means “bold”. So that friend of mine, he’s right of course: “bold” makes no semantic sense in this context. So why did I choose it? Well, b is really short and ultimately a useless tag when you use strong for bold text.
I made a judgement call. I went with short and simple and sacrificed the semantics. It was probably a mistake: in the future I’ll use a div instead, but for now: I’m not going to lose any sleep over it. Should I?
Semantic or not, it is valid code, and it displays as intended, so don’t lose sleep over it.
oh yes.
If you have empty < b > tag just for styling, semantic gods will come to you at night and ask gently to use div next time
.
You shouldn’t lose any sleep over it. Really.
These are unexpected answers, actually.
Losing sleep over this is pushing it, of course. But there is a point in semantics, even lazy ass me sees that. I guess what I’m really asking is:
Am I hurting the cause by being lazy?
In the long run, I think you’ll be happier doing things “the semantic way” because it will be easier to maintain, edit, etc. But, for now, the empty b tag works as intended and doesn’t break anything, so I wouldn’t consider it to be a major concern at this point in time, just something that you may want to change later.
Well, it doesn’t break anything if you have sight. What does it do if you’re blind and using a screen reader? The point of using semantic markup is that you ought not have to worry about contingencies you may not be able to foresee.
Incidentally I’m the meddling good friend.
The real kicker here, is this line of thought that Chris started: this is (slightly) wrong, and I know it.
I have decided to not lose sleep over it, but let’s say that I keep doing this on future sites. Lets imagine everyone did it, over and over again, with the “b” tag. I’m thinking Google would “evolve” as an organism dealing with an outside influence. It would start treating the “b” tag differently… Essentially it’d transform the “b” tag.
Right?
Almost. You start then something similar what IE does – most used #$%$#% browser and without any respect to standards.
how about using
?
Good point. Reminds me: would it be valid to create a self-closing tag, like this:
?
Nope. I don’t think any browser will get mad at you for it, but it’s not valid.
Mind you, joen is just doing this cause he’s a lazybones. Doesn’t your editor support something that would let you use a keyboard shortcut? Or is Windows too primitive for such advanced techniques? Hehehe.
Thanks. It works in XML, that’s why I ask.
Har har har. Don’t underestimate the power of being lazy! In this case, lazy means I’m looking intensely for the easiest way to solve my problem in a good way.
Using the span tage like that is perfectly valid. I’m not sure how style-able it’ll be, but it’s totally valid XHTML, I just double checked.
Interesting.
Elaborating on this could clean up some other tags as well. For instance:
could become
Right?
In theory yes, in practice I’m not sure.
I’d say proceed with caution, and test fully, but you definitely can use shorthand tags like that in some situations.
Last time I tried < script > needs to be closed with < /script >. I recall having an issue with that once.
[...] Joen discussed “the importance of a semantic website structure.” [...]