Live data from Hacker News

Towards a more perfect link underline

acusti.ca

11–20 of 39 posts

Re: Towards a more perfect link underline

#12

I really do not like this. It breaks the assumption (wrong word? Intuitive guess?) that one underline == one link. Which means that every time I look at the link I do a doubletake trying to figure out why there are 6+ links in that word.

I see your point, but I have a counter assumption that individual letters without spaces between will not ever be linked that cancels it out for me.

Re: Towards a more perfect link underline

#13
post #6

lgtm I really like the selection color-change, but I'm not sold on the actual CSS :/ It's too bad line-height doesn't work so great, because that feels like a great solution.

lgtm?

"Looks good to me". It's a shorthand commonly seen in comments on pull requests.

Re: Towards a more perfect link underline

#15
I actually do find this to be an improvement for underlining of text as a visual style, such as for emphasis or headings. (Which you should never do on the web, specifically because "underline" means "link" and nothing else; however, in non-hypertext, underlining can work as a visual style.)

However, as a style for links, it has a sufficiently different style that I find it distracting, both from . appearing far too faint to stand out, and from introducing breaks in the line. It isn't nearly as bad as sites that hide link underlines entirely, however.

Re: Towards a more perfect link underline

#16

I really do not like this. It breaks the assumption (wrong word? Intuitive guess?) that one underline == one link. Which means that every time I look at the link I do a doubletake trying to figure out why there are 6+ links in that word.

That's among the reasons I generally ad an on-hover very slight background color shift to links. It allows me to see what the boundaries of a link are before clicking it. I also dispense with the underline on links by default.

The following is from what I call my "unstyled" CSS -- I'll apply it to bare-bones HTML websites.

    a {
        color: #1e6b8c;
        text-decoration: none;
        transition-property: color, background-color;
        transition-duration: 0.3s;
        transition-timing-function: linear;
        transition-delay: 0.1s;
    }

    a:visited {
        color: #6f32ad;

    }

    a:hover {
        text-decoration: underline;
        background: #f0f0ff;
    }

    a:active {
        background-color: #427fed;
        color: #fffff6;
    }

Re: Towards a more perfect link underline

#18

I really do not like this. It breaks the assumption (wrong word? Intuitive guess?) that one underline == one link. Which means that every time I look at the link I do a doubletake trying to figure out why there are 6+ links in that word.

That's among the reasons I generally ad an on-hover very slight background color shift to links. It allows me to see what the boundaries of a link are before clicking it. I also dispense with the underline on links by default. The following is from what I call my "unstyled" CSS -- I'll apply it to bare-bones HTML websites. a { color: #1e6b8c; text-decoration: none; transition-property: color, background-color; transi…

Your a:hover styles should also be applied to a:focus [0]. You might also want to read about why using only color to differentiate links is bad practice [1].

[0] http://www.456bereastreet.com/archive/201004/whenever_you_us...

[1] http://www.w3.org/TR/WCAG20-TECHS/F73.html

Re: Towards a more perfect link underline

#19

Just seems a little nit-picky to me. I can't help thinking there are more important things to implement than little gaps around letter descenders and configurable line thickness in text underlines...

Just because there are more important things to do worry about than one particular thing doesn't mean no one on earth should worry about that thing until everything else is fixed.

I really need to vacuum my car, but maybe I should hold off until we resolve the Ebola outbreak?

Re: Towards a more perfect link underline

#20

I really do not like this. It breaks the assumption (wrong word? Intuitive guess?) that one underline == one link. Which means that every time I look at the link I do a doubletake trying to figure out why there are 6+ links in that word.

Maybe there's something wrong with your browser. The underline style is only interrupted slightly for descenders. It continues through spaces and other punctuation like it does normally. It looks nothing like a phrase with each word underlined individually.
Post reply on HN