Hyperlink treatment about tufte-css HOT 6 CLOSED

@daveliepmann alright, I pushed my fork to http://bolatovumar.github.io/tufte-css/ with blue links which turn orange on hover. I couldn't style visited links since as it turns out applying background css property to visited links is impossible (https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector). Let me know what you think.

I made some gifs to demonstrate the visibility of different colour links during fast scrolling to illustrate one of my above points about link discoverability.

Red links

Blue links

Black links

As you can see red links stand out even during very fast scrolling and so do the blue ones (but less).
Black ones almost blend in with the text.

from tufte-css.

Color

I'm not opposed to using color for links in some (many!) project contexts, but I'm not convinced that the default for Tufte CSS should be to reach for color. It draws even more attention to hyperlink text and may conflict with other color choices a particular site has made for graphs, logos, and so on.

It would be good to ask what specific benefits we're looking for color to provide. (Or problems color solves.) It seems you point to two: 1) allowing :hover and :visited styling beyond grayscale and 2) highlighting link usage while skimming. I'm not bullish about either :hover or skimming, but :visited does give me pause.

:hover styles

I repeat that I am reluctant to emphasize :hover styles, because they are only relevant in mouse contexts. We should ask, "what is their purpose?" while remembering that the purpose will not aid mobile or tablet users.

I believe web pages built in the spirit of ET's books are best enjoyed on large high resolution displays of desktop computers which are the closest approximation of high-resolution paper book material we have.

I must disagree strongly. For one, to quote Karen McGrane: "You don’t get to decide which device people use to access the internet: they do." Someone is going to view your Tufte CSS webpage from their iPad or phone, and you can't stop them. We choose not to ignore or devalue their experience.

Secondly, our goal is not now and has never been to replicate Tufte's paper books. The web is not print. Webpages are not books. Tufte CSS is not in the business of telling people not to view any given website from a touchscreen large or small.

Again: what is the specific goal of :hover styling in Tufte CSS? If we have none, then I say we leave it alone. Designers can use that technique as their project suits them.

:visited styles

I feel your pain on this one. I think there is often significant value in denoting which links a user has visited.

However, I'm not sure what the best solution is for Tufte CSS. Any solution, whether using color or grayscale or background or something else, fundamentally requires increasing the difference between link text and non-link text, which in my view harms the flow of readability. I'd like to hear suggestions from ET and the community on this one, but for the moment, the restriction on background styling prevents the implementation of our descender-clearing trick on :visited links, so I lean towards the status quo.

To address your proposal of blue text that turns to red on hover: if we ever did turn to color for anchor text, I'd avoid a jarring color switch like blue/red. Manipulating the value of the hue would be preferable.

Clearing descenders

For some time (check the commit history) Tufte CSS used borders to put an underline below descenders on anchor text. ET convinced me that the current approach is cleaner.

The implementation Tufte CSS uses to achieve descender-clearing underlining is a CSS trick, but neither the typographic technique nor that CSS wizardry is a "gimmick".

Tufte CSS prefers to clear descenders and this is not likely to change.

Conclusion

It would be nice to denote :visited links, but it doesn't seem possible without drastic changes. I am not convinced by your other arguments.

Happy new year!

from tufte-css.

@daveliepmann thanks for detailed response. It's nice to see clear reasoning behind the decision made.

from tufte-css.

For an example of link color making text difficult to read and nigh-impossible to skim, see Reason.com's black-on-white/orange-on-white text/link arrangement. Picking a color that has more contrast with the background could help, but the simple fact is that link-heavy text is burdened by the use of color to denote links. Such frequent color switches break up the flow of reading.

from tufte-css.

Hyperlink colour on that site is indeed problematic. Using colour with less of a contrast with surrounding text seems to improve the situation at least a little bit.

Also, they seem to use hyperlinks absolutely indiscriminately linking to ABSOLUTELY EVERYTHING they can. I think whoever writes the copy should be conscious of how many links they are using and whether they really need to use them.

from tufte-css.

Per my earlier extended comment, I do not see any actionable tasks in this issue at the moment.

from tufte-css.