Said Achmiz comments on Please give your links speaking names!

[Said Achmiz]

Use the title attribute of links to give them descriptions (or “speaking names”, as you put it). If you do this, it is possible (easy, in fact) to configure a page’s CSS so that the link is displayed normally on the screen (without your long description breaking up the flow of text), but when the link is printed, the full title/​description is inserted after the normal link text.

EDIT: I don’t know how to do this with LW’s draft.js editor, but in Markdown you do the following:

[link text](http://link_url.whatever.stuff "Link title attribute")

(In other words, put a space after the end of the URL, then the description in double quotes.)

[rmoehn]

Great suggestion! According to a StackOverflow answer, this CSS will do the trick:

a[href^="http://"]:after{
    content: " (" attr(title) ") ";
}

[Said Achmiz]

Very close, though the :after form is deprecated—it should be ::after.

If you’re using GreaterWrong, I suggest this instead:

.body-text a::after {
    content: " (" attr(title) ") ";
}

[rmoehn]

Thanks!