How to correctly use i, em, b and strong
There is a subtle difference between the <b>, <strong>, <i> and <em> html tags: they are commonly misused when styling text as bold or italic.
The <b> and <i> tags are presentation elements and are to be used where there is no “semantic” meaning, for example in a site footer. The <strong> and <em> tags are used where emphasis is to be put on a word and there is semantic meaning, as above with “subtle”.
Semantic: “relating to meaning in language or logic.”
New Oxford American Dictionary
Why does this matter? The correct use of these tags help computers understand language. Currently,
“… web pages are designed to be read by people, not machines.”
Wikipedia
By correctly using these tags we help computers understand in what context we meant something we wrote. The most important use of these tags is for accessibility, em and strong tags are read with emphasis on a screen reader while i and b are read as normal text; since they’re designed for presentation use only.
Comments
Insightful, yes. Great looking website, check. Informative content, …hang on there… Why would you say that the b and i tags have any relevant place now? You imply that they would be used in certain areas of a site, and you explicitly state that they could be used in a footer. Why? Those tags are horrible! They should be completely replaced by CSS and spans or whatever. However, I will agree with the semantic markup portion of your argument. I’m currently in a project that involves 508 accessible content, and I can tell you, there are a whole bunch of things that typical web devs don’t take into account.
By MtheoryX
I’m not suggesting you wrap your whole footer in “i” tags!
Say you had maybe a “time generated” footer piece, you could put that in “i” tags. I dunno, I probably would still just use css also.
By Ben McRedmond (The Author)
I agree with the first comment. Those tags should not be used anymore in modern day web design/development. CSS all the way. I’m confused why this has even been posted as it’s completely irrelevent in todays industry.
By Jon Stevenson
CSS is obviously the way forward, I was just pointing out the differences. The reason this has been posted is that most people still use “i” and “b” tags as they’re shorter and most people aren’t aware of the difference.
By Ben McRedmond (The Author)
Leave a Reply