We've built a custom CKEditor within one of the sites we've developed to allow users to add and edit the content on particular pages. However the editor by default comes with an Underline option and the client has taken it upon themselves to emphasize text by underlining it. This makes everything look like a link when it isn't.
As it's a custom editor we can remove the ability to underline (although I think they'll still be able to do it with a Ctrl+U) but I want to ensure there are no genuine uses for underlined text before I recommend it be disabled.
Is there ever a valid use-case for having text underlined on a website - other than for links, and possibly headings (both of which would be taken care of by the site CSS anyway)
A similar example of what I mean is below (taken from the current wordpress.com page editor) 
Interestingly, I notice that the Stack Exchange text editor doesn't have underlines as an option
Answer
Underlining non-link text is a sort of usability crime. Underline is a standard way of visualizing links, especially when the default blue isn't use for links, so underline can confuse web users as to what's a link. Even in desktop applications, underlined text often means "I'm clickable".
Everyone knows that text that’s underlined, or is a different colour is likely to be a link. Don’t go confusing people by throwing in underlined text elsewhere! To draw attention to a certain word, try using the strong or emphasize tags instead.
Underlining is also almost impossible to ignore. Contrast italics which emphasize text in context. Italics are only noticable while you're reading a line. Contrast this with Underline and Bold which draw your eyes even when you aren't reading a paragraph. Underlines, like bold, are hard to ignore when scanning text.
The important thing here is that Bold and Italics provide two important ways of emphasizing text, and Bold and Italics are a complete set on their own. They have their own use cases but Underline serves the same purpose as Bold, while being stylistically awkward and harming readability.
Sitepoint does a good job of explaining the risks of Underline on readability as well:
In addition to possibly confusing the user into thinking that the underlined text is a link, underlining can also cause readability problems, as the line interferes with the descenders on lower case text (for example the lower case letters g, j, p, q and y), making some word shapes less clear.
Underline is distracting, potentially confusing and, more subjectively, it's visually ugly. Because Bold and Italics cover the use case of emphasis, Underline does not have a distinct use case and should be avoided for non-links in general content.
There are however use cases where underlining is important however: When a predefined style guide demands underlining.
MLA Format requires underlining for book titles; giving an editor with no underlining to people using MLA format would be cruel. APA also underlines.
No comments:
Post a Comment