As of WordPress 4.7, the visual editor no longer has a button for underline. There were a lot of reasons for this, but primary are two:

  1. Space is not limitless.
  2. Underlining looks like links.

Naturally someone complained that we were breaking style guides:

When referencing a source of information it is correct form to underline the title of the source.

They happen to be wrong. Let me explain.

The Web Is Not Print

We use double spaces to indicate the end of a sentence in printed works. We don’t on the Internet. It took me a long time to get used to that, and if you look back on my older posts, you’d see it all over the place. The point here is that we know you don’t use the same punctuation and style you might use online as you do on paper.

I look to the grandpappy of web, Jakob Nielsen, for some backup here. Your writing style for the web is different from print. A lot different. In Writing Style for Print vs. Web he says:

In linear media — such as print and TV — people expect you to construct their experience for them. Readers are willing to follow the author’s lead.

In non-linear hypertext, the rules reverse. Users want to construct their own experience by piecing together content from multiple sources, emphasizing their desires in the current moment. People arrive at a website with a goal in mind, and they are ruthless in pursuing their own interest and in rejecting whatever the site is trying to push. Banner blindness is only the most extreme manifestation of this selfishness.

But that talks about the way we write and not the design of what it looks like. Web and print design are wildly different too. For newspapers, you have to consider the width of the columns. If you’ve never taken a journalism course, there’s as much about layouts as there is about writing a solid lede.

Good Writing Has Rules

I’m a huge fan of Strunk & White’s The Elements of Style. My wife has a copy and, when we met, she found my grammar to be deplorable and used to wave it at me a lot. Having read it multiple times (yes, I do re-read it) I’ve found my communication skills have been catapulted because of the directions. People ask me why I’m a good speaker and the answer is because I’m a good writer.

One of the lessons from Strunk & White is to use the active voice, for example, which is something Nielsen points out as well. You need to engage your readers. You need to bring them on a journey and make it theirs as much as yours. To do that, you need to understand the rules of the language in which you’re writing.

Content Must Not Confuse By Context

Going back to the heart of the matter, why is it okay that WordPress killed the underline button? It was confusing.

Originally we underlined links because it was easy and being consistent about a display reduced the chances for misunderstandings. Why were they underlined and blue? I actually have no idea. I looked it up but was unable to find a solid answer. My theory was that blue would stand out against the standard grey background as well as the black words so everyone knew what it was for. Similarly, on a monochrome screen, which was very common in the day, an underline would stand out (as it happens, Sir Tim Berners-Lee picked blue totally by happenstance).

Why underline and not bold or italics? My guess is that since underlining is not actually standard practice for writers, it was a safe grab. Otto pointed out that old-old systems always had underlines, but not always italics or bold, so that weighed heavily into the decision as well, clearly.

In a word, it wasn’t confusing. It was consistent.

It’s Actually Italics

Did you double take when I said underlining wasn’t standard practice? Surprise! Let me appeal to Misters Strunk & White on a few matters of form:

Titles. For the titles of literary works, scholarly usage prefers italics with capitalized initials. The usage of editors and publishers varies, some using italics with capitalized initials, others using Roman with capitalized initials and with or without quotation marks. Use italics (indicated in manuscript by underscoring), except in writing for a periodical that follows a different practice. Omit initial A or The from titles when you place the possessive before them.

The Iliad; the Odyssey; As You Like It; To a Skylark; The Newcomes; A Tale of Two Cities;Dickens’s Tale of Two Cities.

Notice the direction to use italics? The talk of a manuscript is in reference to the fact that most people wrote manuscripts by hand or on typewriters that didn’t have italics. I remember having to type a line, and then backspace to add in the underline manually. Have you ever tried to write italics manually? It’s not easy!

The web is not handwritten. Computers in 2016 can handle italics.

And it’s not just Strunk & White. Harvard’s documentation on citation doesn’t recommend underlining at all. The MLA (Modern Language Association) says, as of this year, to use italics for large works like books and magazines, but quotes for short ones in titles. The Chicago Style Guide reads the same.

Use Italics, Not Underline

If you skip the whole post, let me make this simple for you: The title of a source should be italicized.

Reader Interactions

Comments

  1. Hey there!

    Ah, I didn’t notice this was done! (need to blog more lol) I can totally see your points but there is one case you didn’t mention to where I think underline should still be an option (I am sure a plugin will come along)

    Some themes do not underline hyperlinks and it drives me insane! They make the hyperlink kinda bold in font but no underline. Some people do not understand to click links unless they are underlined. For this reason, I had to manually underline all my hyperlinks with this theme.

    Now that underline is gone, I would have to switch to another theme or find some CSS code that will make it work properly. So, for that reason I think underline should stay! haha 🙂

    • @Mike Price: Using underline for every link, manually, is a massive waste of time. Instead, why not use the new built in CSS editor? It’s in customizer after all!

      Also tell the theme you’re using that this is an issue. Maybe they’d reconsider.

      a { text-decoration: underline!important; }

    • @Ipstenu (Mika Epstein): Thanks for the tip! I haven’t been blogging like I should be so I haven’t tested this out in quite awhile. In fact, not sure which of my sites has that silly theme haha. But just thought it was worth mentioning 🙂

  2. I love this post.. in fact when I did mine on the new version, that was one of the two (removed) features I focused on (the other being justification). I think it was as far back as 5 or 6 years when I did blogging workshops, that I told people to please ignore the underline button in the editor.

    Really liked how you dove into this deeper… great stuff, thanks!

  3. Another major argument against removing underline was its much more common use as highlighting text to draw attention to it. This is fairly common and does not conflict with underlined links.

    The extended argument was that a properly styled theme would ensure there is a visual difference between a link underline (which is not an underline but a visual cue) and an actual intentional underline. This was largely ignored.

    As a result of this some work is being done to introduce a highlight option in the TinyMCE editor. I for one hope this gets rolled in sooner rather than later as the removal of the underline effectively removes the only method for highlighting text without emphasis.

    • @Morten Rand-Hendriksen: I’m not really sure how underline drew attention to something without emphasis… It’s as eye-catching as italics or bold in it’s own way. It stood out from the normal text. That said, adding in highlight would be nice, though I would think that would be better served via the mark tag (new in HTML 5).

  4. Underlining, as exclamation points, is like laughing at your own jokes.
    Happy New Year Mika and Judith. And Mika … Strunk and White was always in our house …

%d bloggers like this: