Discusion: <b> vs <strong> vs CSS

Recently, I retracted a Feature Request, where I asked for 'B' and 'I' to be deleted in favour of <span>.

image

The action above, inserts a <b> element into the code:

Summarizing the many posts on the internet, is this article from MDN:

The <b> HTML element is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance. This was formerly known as the Boldface element, and most browsers still draw the text in boldface. However, you should not use <b> for styling text or granting importance. If you wish to create boldface text, you should use the CSS font-weight property. If you wish to indicate an element is of special importance, you should use the <strong> element.

A similar argument can be made for the <i> element where we should use <em> instead.

I am sure that, like me, the main reason for having boldface, is purely visual and not meant as needing a semantic meaning as in <strong> and <em>. A <span> element will allow us to apply CSS for styling.

I am interested in your views on this topic.

But <span> is already available and you can add it. What is the issue there?

Try putting it inline as in the example above:

image

Why inline? I hope you understand we can't move all the html tags to be available inline in the design view :slight_smile:

That is why I am only asking for the <span> element.

I think we can do this - change <b> to <strong> and <i> to <em>, but not sure about the span added there :slight_smile: Like any other HTML element you can add span in the app structure.

Please show me how. Would love to apply the this.

here, please check my screenshots ...

Ok, I add a <span> inside the paragraph, with this result:

<p><span></span>This article describes several text-level elements. It explains their usage in an HTML document.</p>

Ben i really don't get your point? What do you expect to happen or what is the problem that needs to be fixed here?

I want the span to surround HTML, in a similar manner to what B does.

If you can change B to strong, then surely you can replace the B with SPAN and create an element called span instead of strong.

As said, semantic elements like strong is usually not the reason why we would use strong. It is the visual effect which should be done using CSS. I hope that you saw my video on Headings, where I discuss much the same thing,

Come on guys!

Keep this old geezer happy this festive season :christmas_tree:and join in the discussion :hear_with_hearing_aid:.

I vote for change, what about you?

3 Likes

I'm 100% in favour of changing <b> to <strong> and <i> to <em> .... I use spans a lot and if that could be added to the toolbar as well that would be grand! Right now I have to do it in code view.

1 Like

Hi Brad, I love that idea, can still add classes as in

<strong class="text-danger">HTML</strong>

Same here.

Thank you for changing my mind.

Same here I use spans everywhere!

1 Like

Hi!

Je vote pour le changement (I vote for the change).

Indeed the <strong> and <em> tags have an influence on SEO, their role is to indicate the meaning of the text. The <span> tag is an inline tag just like <em> and <strong>, which we place in the middle of a text... These tags are mainly of interest in SEO (to indicate an important text).

In conclusion, yes, you must use the <span> tag. (my strong text :stuck_out_tongue_closed_eyes:)

1 Like

Off topic: In 2025 you still believe in SEO? Wow!

Is this only in the inline edit in design view? Yes <strong> and <em> should be used instead of <b> and <i>

I don't think <strong> and <em> does much for SEO in modern search engines but it is important for accessibility and screenreaders.

I think one of the main things Wappler is currently missing is a way to insert inline elements by selecting some text and wrap the element around it. Not only bold and italic but also elements like <abbr>, <code>, <kbd>, <time> etc.

You can insert them currently inside another element, but that is not how you normally use inline elements.