The Semantic Trepidation
Not long ago I had an e-mail exchange with somebody that had developped a jQuery plugin and wanted some advices on how to handle accessibility issues.
The plugin was really a good one but it frustrated me exactly because of its lack of accessibility and semantics. I always found myself bothered by the fact that, because of its “flaws”, I could not really recommend the plugin to my clients without a pinch in my purist principles. And, well, I knew that some small changes would easily do the trick.
That is why, when I had the chance to exchange some e-mails with him, I took the opportunity to, first, congratulate him for the great work and second to point out what could be improved in his plugin so to make it completely smashing.
Among other things like the lack or the misuse of title attributes here and there, what annoyed me
was the fact that the added dynamic content was completely semanticless. A whole block of content was
wrapped in a simple <div> tag... No paragraph.
Indeed, call me a purist, but for me, when I have a paragraph of text, I put it inside a
<p> tag... just like that.
So, proud of my own principles, feeling like Dalay Lama versing all his wisdom,
I wrote him with all my best intentions
saying: “Here you'd better use a <p> tag instead of a <div>,
because the <div>
tag doesn't have a semantic meaning”. I could go on saying that the world balance depended on
small tiny details like that and so on (laughs), but I didn't want to freak him out.
I thought I gave him good advice by telling him to take care of semantics, specially knowing
that it would be easy to fix. However, I received an answer that I still cannot quite understand: he used
the <div> tag on purpose, exactly because it has no semantic weight.
I really wanted to ask him why. Which possible reason could drive somebody to choose willingly the
dark side of the force? But I didn't. Something was telling me that he would not answer or that he
would be so vague that it would not help.
Ok. I can understand those who don't care for semantics. I work with many developers that have all the focus on development and simply don't think about it. For some, the HTML is mostly a boring thing that must be scripted. I can understand those that spend 40 minutes to choose the right tag (yes, apparently they exist. I wouldn't say much myself! haha! But, no, that's not true either, I cannot understand them, if they're really out there). We can be indulgent enough with those that don't care or don't have the required level of HTML knowledge, but what can we say about those that intentionally don't want to be semantic?
Can this be fear? I mean, if I choose the non-semantic path I don't have to fear doing wrong, do I? Well, besides having chosen the wrong path...
Can't we be more redundant, please?
I cling to semantics not just because I know its benefits or because I cannot go against what is pure and simple logic for me, but also because it is the basis for an optimized and coherent CSS design.
For example, I have a straightforward way to control relative font sizes in my style-sheets:
in the beggining of the CSS I declare the size of my text in “em”, and I declare them
exclusively to text block elements like Hs, p,
li, dt, dd. Never to inline elements or to divs.
This allows me to assure a coherence of font sizes, avoiding surprises like tiny text sizes that, I
believe you know quite well, happens everytime an element accumulates its relative font size with the
relative font size declaration of its parent.
When I have an exception of size for an inline element, I adjust it using “%”, what is very handy and simple.
That is one of the best practices I stick to because it eases my work, and again because it is logical. Now, guess what I have when I use a plugin that adds to the DOM a bunch of divs with no text block? Yes, I have a big text with the default font size of the browser that, usually, has nothing to do with the size of my paragraphs, of course. And here I go adding useless, redundant properties to my CSS to fix the font size for each and every semanticless div.
I wonder why all frameworks or libraries or whatever couldn't be like jQuery, that never imposes a markup, freeing you to apply a plugin to whatever bunch of code we want, and that, that's really logical.