The b element

The first of the HTML elements beginning with b is [maniacally rifles through stack of coffee-stained scrawlings] the <b> element. Unlike the chemical element Boron (also represented by a b), the <b> element is not a brittle, dark, lustrous metalloid. Nor is it synthesized entirely by cosmic ray spallation. For that matter, neither does it have three valence electrons for forming covalent bonds.

Truthfully, the list of differences between the chemical element Boron and the HTML element <b> is as long as my arm—and I’m some sort of gigantic, horrifying mantid, so that’s saying something. Frankly, I would love to list each of these differences in turn, if only to put off trying to set forth what the <b> element is actually for. Which is a bit tricky.

In HTML4 it was easy. The b stood for “bold” and the <b> element was used to make text go bold. If the chosen font family had a bold weight, that would be assigned. If a bold weight was absent, the browser would apply a faux-bold style, by wrapping the regular glyphs in an insulating layer of subcutaneous pixels.

In HTML5, b does not stand for “bold” anymore. Astonishingly, it stands for “Bring Attention To”. This excruciating new moniker was contrived to address concerns around presentational versus semantic HTML. You see, when <b> was first specified, you weren’t asked to consider if you meant anything by making your text bold. Maybe you did it for good reason, or maybe you just liked some occasional chonk. There was no way of knowing.

Today, if you’re making some text bold because you deem the text important, serious, or urgent, you are asked to use <strong>: the Strong Importance element. Leaving aside the fact that Strong Importance sounds like a Conservative Party slogan, where does that leave <b>?

In a somewhat precarious position, in my opinion. Because why would you ever want to literally and figuratively embolden some text FOR NO REASON? Or, to put it another way, why would you Bring Attention To some text if the reader is to believe it is not worthy of that attention? It may as well be called the Bwahaha Made You Look element. And since <b> and <strong> render the same way by default, how should the reader know which is which without inspecting the underlying HTML?

Vendors of assistive HTML-to-speech software (screen readers) are also left to speculate. Should <strong> text and <b> text be read out differently to the surrounding prose? Or should just <strong> be read louder or with a different tone? Since the visual interface does not include an equivalent differentiating cue, would this not create an inequality between audio and visual experiences?

Well, screen readers do not tend to embellish or augment their announcement of either element based on semantics. Some provide methods for inspecting the visual properties of text, which would identify bold in either case. How you should know where to look for bold, where you can’t see it, is another question. It would be like looking for links where the underlines have been removed, which is a situation I find myself in all too f**king frequently.

Some presentational elements, like <font>, have been marked as deprecated, meaning their use is no longer encouraged. Because there are new and better ways of going about things. Browsers are asked to continue supporting deprecated elements if only for reasons of backwards compatibility. In the case of the text-level <b> element, usage is so widespread that deprecating it would be less like shutting the stable door after the horse has bolted and more like shutting the stable door after the horse has emigrated. Especially since many had been using <b> with semantic intentions, in the absence of a yet-to-be-specified <strong>.

So, how should you proceed? All I can tell you is what I tend to do. I generally avoid <b> and use <strong> judiciously. How deserving some text is of <strong> is really down to the wording itself. “Mantids are the largest family belonging to the Mantodea <strong>order of insects<strong>” seems superfluous. “I am a giant, horrifying mantid and <strong>I intend to decapitate you with my fearsome raptorial foreleg<strong>” feels more fitting.

The really great part is that we’ll be going through this presentational-versus-semantic debacle all over again when we come to <i> and <em>—if I ever get that far. Stay tuned etc.


Not everyone is a fan of my writing. But if you found this article at all entertaining or edifying, I do accept tips. I also have a clothing line: