Philadelphia Standards Organization

The Difference Between <em> and <i>

June 28th, 2006 by Andrea Piernock Barrish

Way back, when I upgraded my personal site to WordPress 2.0 and began playing with the new WYSIWYG post editor, I noticed something about the bold and italic buttons in the tag helper bar: they say bold and italic but they output strong and em, respectively.

There’s been a push in the developer community to begin using markup that has more meaning, and in many cases <em> makes more sense than the presentational markup of the <i> tag, specifically when you want to give emphasis to the enclosed word or phrase. I mean, that’s the point of the <em> tag. Now many coders and developers are always using the <em> tag instead of <i>, falsely believing <i> and <b> to be deprecated (only <u> has been deprecated as of HTML 4.01).

But should we all go back into our code and change every isntance of <i> to <em>? I think not. There are plenty of perfectly good pieces of text that you would want to italicize, but you don’t necessarily want to emphasize.

Italics are used to indicate titles of longer works (albums, periodicals, television series, plays and films), foreign words that have entered English vocabulary (de rigueur, resume), and words or phrases used as themselves (the term computer, the letter A).

For example, I write a post about a certain book, perhaps a review. According to various guidelines for writing, titles of books written on the web should be in italics, since underlining is not only confusing, but a web standards faux pas.

I don’t want to emphasize the book’s title, but I do want to be grammatically correct. However, this brings up the debate over the practice of using presentational markup vs. separating style from content, and until we’re all writing XML and defining our own <booktitle> tags, I’ll keep using <i>.

When I originally posted this article to my website on 10 January 2006, someone commented that “[y]ou should use the cite tag for … citing the names of books and such.” However, I don’t know if the cite tag is appropriate, since I’m not citing a book or reference, just mentioning it. If I were to publish a research paper online, then I would use cite and blockquote quite often. This doesn’t seem the case to me here.

7 Responses to “The Difference Between <em> and <i>”

  1. Posted: July 11th, 2006 at 6:49 pm
    Zoe Gillenwater Says:

    Thanks so much for this post. I've been arguing the same thing for years. It's a pretty common misconception that em is just the new i.

    Can I say, though, that I find your security code image very annoying? I am a young person with good eyesight and even I find it very hard to make. It's taken me several tries to get this comment to submit. Please don't put the burden on moderating your comments on your users -- it's your job to keep the spam out, not ours to do it for you. You just inconvenience, annoy, and drive away those of us who are legit.

  2. Posted: July 19th, 2006 at 9:08 am
    bj Says:

    Though it may be semantically correct to use either the i or the em in your html/xhtml markup, it may also create additional headaches. First of all, until monitors show more dots per inch italics can be very hard to read, especially for those with less agile sight. Secondly there's the IE's italics problem to contend with. You just better hope you don't do any site designs for attorney firms, who LOVE those dang italics in both cite and in em, and wouldn't hear of letting you style them out to solve a thorny browser problem.

  3. Posted: October 24th, 2006 at 2:21 pm
    Brad Henry Says:

    Another interesting difference is strong verus bold. Is there really any difference there. I know in search engine optimization the strong tag is considered a little more important but not to the point that it will make any real difference in your site. It's one of those factors that can be the straw if it comes down to it...

    Brad

  4. Posted: November 1st, 2006 at 7:14 am
    sadsa Says:

    sa,mds,mklhkjsdhoi

  5. Posted: March 11th, 2007 at 12:14 am
    Guide To Cheap Car Insurance by Pricilla Says:

    Guide To Car Insurance
    Here is a useful guide to car insurance. Buying car or motor insurance is important as it is legally enforced in the UK . You are required by law to have a policy to cover your liability to other road users. Car Insurance protects motorists and drivers against liability in the event of accidents they may cause. It can also provide cover for the motorist’s own vehicle. If you are the cause of an accident the car insurance company will pay your liability to other people involved in the accident.

  6. Posted: February 2nd, 2008 at 2:31 am
    boy Says:

    你好你好

  7. Posted: February 10th, 2008 at 9:41 am
    国际机票 Says:

    北京搬家公司

Leave a Comment

You must be logged in to post a comment.