Search code examples
htmlsemantic-markup

Is it semantically correct to use a <b> element to mark up keywords without highlighting them?

I have a sentence that includes defining a term in another language. After reading through the W3C official docs, I used the following markup to convey meaning:

<p>The <strong><dfn><i lang="tl">barangay</i></dfn></strong> is the <em>smallest</em> <b class="no-bold">political unit</b> in the <b class="no-bold">Philippines</b>.</p>

with my understanding from the docs that:

  • <strong> is for strong importance
  • <dfn> is for the defining instance
  • <i> is for technical terms and/or transliterations
  • <em> is for stress emphasis
  • <b> is for highlighting keywords without marking them as important

What I am not sure of is if I could use the <b> element just to mark certain words and phrases as "keywords", without bringing attention to them (hence why I added class="no-bold" to change its appearance using CSS). Would this be correct usage of the element?

Solution

  • Styling doesn’t change the meaning. So if it were appropriate in some context to use b with styling (e.g., making it bold), it’s also appropriate in that context to use b without any styling.

    It’s conceivable that a user-agent makes use of these b elements, even if you don’t style them or don’t do anything else with them.

    An actual example: text browsers (or feed readers etc., i.e., any UA that doesn’t support CSS) might display them in bold by default.

    class name for the b element

    However, the class name no-bold is not ideal, as

    • it couples the current styling to the content (you might want to change the styling without also having to change the HTML), and
    • it doesn’t describe what the purpose of the b element is (not useful for consumers of your markup).

    This goes for any element, but the spec explicitly mentions it for the b element, too:

    […] authors can use the class attribute on the b element to identify why the element is being used, so that if the style of a particular use is to be changed at a later date, the author doesn’t have to go through annotating each use.

    A more suitable name might be definition-keyword or something like that.