HTML is designed to be as independent of medium and client as possible. While you interact with the majority of web pages visually via a screen, there are numerous other possibilities for how the content may be shown, such as print, text-to-speech readers, braille translators, and more.
For this reason, tags that format text in HTML are as broadly applicable as possible.
<em>, for instance, emphasizes text. In most cases, visually rendered
<em> content means it is italicized, but a text-to-speech tool will emphasize the text verbally, just as you would reading the text out loud.
<strong>, visually, bolds the content between the opening and closing
<strong> tags, but again, the tag will have different meanings in different contexts.
Both tags are intended to be used on a short portion of text – a word or two, perhaps a sentence in a paragraph that is several sentences long. If you find yourself coding this:
<p><em> .. lots of content here .. </em></p>
… it is almost always a sign that you should not be using
<strong> but CSS instead.
<strong> makes little to no difference inside of heading elements. Use CSS instead.
HTML5 reintroduces the
<i> tags, but I would recommend sticking with
<em>, as the latter have greater applicability and accessibility.
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.