18 comments

[ 3.0 ms ] story [ 46.5 ms ] thread
Is it just me who finds the serif font used in this website too narrow and hard on the eyes, even on Retina displays?
I recall quite liking the typography on this website the first time I saw it years ago. It's amazing how much it has dated for me since (I think primarily due to being liberally copied exactly in too many places around the web).

> a reminder about the goal of this project. The web is not print. Webpages are not books. Therefore, the goal of Tufte CSS is not to say “websites should look like this interpretation of Tufte’s books” but rather “here are some techniques Tufte developed that we’ve found useful in print; maybe you can find a way to make them useful on the web”.

Reading this I think an interesting alternative approach could to be apply Tufte's principles to a CMS rich text field editor or to a frontend templating library - something that generates HTML - rather than focusing purely on the CSS side. This & selecting some less print-oriented type.

How many times will Tufte CSS be reposted?

I feel like I see this every year. Unfortunately I like it less every year too.

Looks like about every 18 months.
Bembo-like font is atrocious.

Kerning is horrible.

Small caps have different stroke widths.

Tufte’s style is ok, just the open-source Bembo bad-clone font is very-very bad.

> Although paper handouts obviously have a pure white background, the web is better served by the use of slightly off-white and off-black colors. Tufte CSS uses #fffff8 and #111111 because they are nearly indistinguishable from their ‘pure’ cousins, but dial down the harsh contrast.

I never got this argument.

I can see an argument for "We need to reserve some headroom and footroom for Darker Than Common Black and Brighter Than Common White for occasional emphasis scenarios. Or, for differentiation from pure black/white in images and background elements."

But, I read "dial down the harsh contrast" as "We presume users have their monitor contrast settings set too high and intentionally use a reduced range to compensate for their mistake even though it costs us a bit of color precision."

Meanwhile, I might have an LCD monitor with the contrast dialed down next to an OLED with the brightness and contrast cranked up. And, even if the common case user setup is not so extreme, it still varies wildly in practice.

As a game engine developer, this is something I've had to deal with in practice for a long time... Reduced contrast range as a stylistic choice can be quite valid. But, trying to predict user viewing conditions is wishful thinking.

> Although paper handouts obviously have a pure white background

This alone makes it clear enough they’re not going to make much sense.

As far as I am aware there is nothing “pure” white, or at least, nothing you’re going to print on with a laser printer.

Previously:

Tufte CSS - https://news.ycombinator.com/item?id=42820449 - Jan 2025 (4 comments)

Tufte CSS - https://news.ycombinator.com/item?id=35032334 - March 2023 (32 comments)

Tufte CSS - https://news.ycombinator.com/item?id=23828196 - July 2020 (9 comments)

Show HN: A minimalist blog based on Tufte CSS - https://news.ycombinator.com/item?id=19615895 - April 2019 (74 comments)

Tufte CSS - https://news.ycombinator.com/item?id=15633102 - Nov 2017 (59 comments)

Tufte CSS - https://news.ycombinator.com/item?id=10555319 - Nov 2015 (26 comments)

Tufte CSS - https://news.ycombinator.com/item?id=10012360 - Aug 2015 (103 comments)

ctrl+F "tufte" results in 47 hits in this fairly short article. The guy must love his name even more than Wolfram.
how else would one reference the topic of the article? The name seems like the most concise way to me.
> "Blue text, while also a widely recognizable clickable-text indicator, is crass and distracting. Luckily, it is also rendered unnecessary by the use of underlining."

Can someone explain this to me? I don't get the 'crass' part of it. I find that having different colors for things really helps me parse things quickly. By removing the color dimension from the equation, it seems to make it more difficult to know what is what.

I have been using (an older version of) Tufte CSS on my blog[0] for years now. I had to tweak it quite a bit before I thought it looked OK on both phones and tablets but I really think it does work well for the longer-form posts I was originally aiming for.

[0] https://sheep.horse/everything.html

Beautiful. Bug? when I narrowed the window, the side notes disappeared?
Causing a 300 year quest to prove a theorem.