vs in HTML5

Answer 1

span means nothing. Semantically, it doesn’t matter if there is a span element at all. So the question should not be when to use b vs. span, but it should be: Should I use b? (There are many cases where you might want to use b without needing a styling hook, so there would be absolutetly no need for span if b wouldn’t be appropriate.)

To decide if b is appropriate or not, I think it might help to imagine an intelligent user-agent that makes use of semantic markup. If everyone would use HTML5 correctly, what could such a user-agent deduce from content marked up with b?

I think the example use-cases mentioned in the definition give a pretty good idea:

• key words in a document abstract
• product names in a review
• actionable words in interactive text-driven software
• an article lede

→ Summarized: keywords.

So such a user-agent could, for example, extract all keywords in a paragraph/section and present them in a certain way, so you can decide if you’d like to read it.

In a recipe, it could be all ingredients. In your very question, it could be "b", "span" and "HTML5". On a product page, it could be the product name, main features and the manufacturer. Think of meta-keywords, but not document-wide (same as link vs. a).

Don’t let you mislead by a styling need. While, in many cases, boldface might be an appropriate styling, most of the time I never use any special styling for b.