vs in HTML5

Answer 1

The first example is fairly straightforward. You are trying to make "CS 101 Final" catch the eye, because it's more important than the "Your score for" text is. So that's

Your score for CS 101 Final is 42%.

With , you're not trying to catch the eye. You want the whole text to be read evenly, but you marking certain words and phrases as being of use to the reader (utilitarian purposes). Frankly, there aren't many uses for this. The spec gives examples of keywords in an adventure game and in a report but it's not easy to find many uses.

The second example is trickier. Here, "Answer" is being stylistically offset. The word "Answer" is definitely not more important than the actual answer text, nor does it need to be brought to the particular attention of the reader for any other reason. It's just being marked as distinct from the actual answer text. However, the spec, in the "Common idioms without dedicated elements" section, suggests the use of to mark the speaker in a conversation, and using it could be seen as being analogous to that. But basically it's just styling, so with a class is likely the best choice.

What criteria do I use to decide on a b or a span tag?

As you can see from the above, it's a process of elimination. Is or or appropriate? Yes - use them. No - Is or appropriate? Yes - use them. No then use