4

Recently my manager at work criticised my use of the HTML <strong> tag as I had used it to bold some text. He stated that if I was trying to achieve aesthetic appearance and apply some visual emphasis to to my web page I should be using a CSS class in place of the <strong> tag such as this class:

.heavytext {
  font-weight: bold;
}

Here is the text on the web page using the <strong> tag.

<li>The hirer agrees <strong>Any damaged occuring is...</strong></li>

Here is the text on the web page using the the CSS class inside a <span> element.

<li>The hirer agrees <span class="heavytext">Any damaged occuring is...</span></li>

My question is what is better practice. In this case I believe that the text should be emphasised for the screenreader using the <strong> tag and as this is not for visual effect. The text is part of some terms and conditions and reads "Any damage caused due to misuse of equipment is the responsibility of the customer and will be charged for the damage".

user1554264
  • 1,204
  • 3
  • 22
  • 47
  • Very similar to http://stackoverflow.com/questions/4939807/strong-vs-font-weightbold-em-vs-font-styleitalic – j08691 Apr 07 '13 at 16:24
  • `b` is an inline element and the browser define styled for it is simply `b {font-weight:bold;}` which ultimately ends up into a CSS style, so why bother adding class to make a text bold. – Deepak Kamat Apr 07 '13 at 16:29
  • Is what the hirer agrees to more important than the fact that they are agreeing? I would suspect not (though I am not a lawyer), so your manager is probably right to discourage the use of `` in this particular instance. – Alohci Apr 07 '13 at 18:16

3 Answers3

5

You shouldn't depend on a tag to apply any specific styles. There is no standard for applying styles to tags, and this can be changed by CSS. Tags have semantic value rather than presentation value.

The answer to your specific question of "what is better practice" is "it depends."

  1. If you want the text to appear bold in GUI browsers, use CSS
  2. If some text is important relative to surrounding text, use <strong>

These are not mutually exclusive.

Explosion Pills
  • 188,624
  • 52
  • 326
  • 405
0

As you can see, nobody's really agreeing on "standard", here.

But this is something that comes down to the intent of the content.

If you would like to change the appearance of text, for the sake of changing its appearance, CSS is the way to go. If you would like to change the semantics of what is housing the text, then use a tag.

In this case, the answer is probably "both".

There is absolutely nothing wrong with an answer of both.

In fact, so that you're both correct, there's nothing wrong with saying:

<strong class="heavy-text">if you break it, you bought it</strong>


strong.heavy-text { font-weight: bold; }

Redundant?
Well, if that's the only change you ever make to it, then yes...

But now you have text which is emphasized in a way that you think it should be, for semantics and accessibility, while it's also styled using the appropriate hooks, for future-modification.

If it's decided that no audio/textual weight should be applied to that specific segment, above any other segment, then just use <span class="heavy-text">, or whathaveyou.

Norguard
  • 26,167
  • 5
  • 41
  • 49
  • I just wonder if there's any SEO benefit for `` vs ``. One could always just set a global CSS for `strong` instead of weighing it down with a class. For the sake of clean markup, I vote `` for in-content (such as a small segment inside a paragraph) and a class for actual objects (ie, the `

    `itself).

     – Casey Dwayne Dec 21 '13 at 18:31
  • @kcdwayne So far as I'm aware, you aren't going to get an SEO boost out of wrapping content in `` any more than you're going to get from wrapping everything in `` tags. CSS isn't for one part and not another, that's an organizational preference. One benefit to having `strong.heavy-text` would be *very* old browsers. Microdata would help SEO, but it doesn't matter whether it's `` or `` – Norguard Dec 23 '13 at 02:30
-4

Strictly speaking, you should use CSS. That being said, <strong> is "basically" a <span> that happens to have font-weight:bold in the browser's default stylesheet.

Personally, I like to just use <b>. It's a lot simpler and clearer, and more meaningful to screen readers than some obscure class name.

Niet the Dark Absol
  • 320,036
  • 81
  • 464
  • 592
  • 2
    should be used as a last resort. It is strongly advised against. or CSS are the preferred methods. HTML5 standards are particularly against the tag. – Kevin Lynch Apr 07 '13 at 16:15
  • 2
    Use strong or em if you want to emphasize text so that screenreeders etc. will know it is emphasized. b is just visual and has no semantic meaning, same as using css – user1950929 Apr 07 '13 at 16:19
  • In this case I believe that the text should be emphasised for the screenreader using the tag and as ths is not for visual effect. The text is part of some terms and conditions and reads "Any damage caused due to misuse of equipment is the responsibility of the customer and will be charged for the damage". – user1554264 Apr 07 '13 at 16:22