Highlighting is strong, excessive, distracting, aggressive.
Underlining is soft, neat, light, instead.

While highlighting screams: LOOK AT ME COME ON!, underlining raises a hand and timidly tells you: hey! Remember this!

Highlighting is egocentric and annoying, underlining is actually useful: it catches the eye, but without stressing it with too many frills.

Underlining lets you focus on the content, which is what actually matters.


What about colored text or bold text?
This is more a matter of design. In general, I prefer when there are less colors; it enhances focus.




Styling #

An appendix for techies: as you may have noticed, underlined text in this website is a bit darker (or brighter, if you are in light mode) than the text. This is because I love when the underlining is subtle an simple. I did this by using a very nice CSS property: text-decoration-style. In this website’s CSS I set it up like this:

/* Instead of using a weaker grey, I decreased the opacity of the original text color, instead */
* {
	text-decoration-color: #E3E3E399 !important;
	/* “!important” has to be added if we want to override the decoration color of <a> tags, which is the same of the link color by default */
}
Note: keep in mind that by using the * selector in CSS, we automatically change also the strikethrough color

Share

Commenti