Tufte CSS • Hacker News Board

Re: Tufte CSS

#21

Post by JohnHammersley » Wed, Aug 05, 2015, 9:17 PM UTC

christopheraden wrote: post #4

Tufte-Latex, mentioned in the article, is a really nice template that produces some gorgeous Latex handouts with very little effort (I've used it a couple times when I wanted something to not look like the standard Latex article class). I thought it worth linking here for those that didn't read the link: https://tufte-latex.github.io/tufte-latex/

I agree -- I use that template for writing most of my documents now.

It's also available to try out online on Overleaf if you don't fancy installing LaTeX: https://www.overleaf.com/latex/templates/handout-design-insp...

(Note: I'm one of the co-founders of Overleaf, so any feedback appreciated, thanks!)

Re: Tufte CSS

#22

Post by mkozlows » Wed, Aug 05, 2015, 9:23 PM UTC

DaveWalk wrote: post #20

mkozlows wrote: post #17

Honestly, this is really rough. The impulse is admirable, but the implementation has a lot of rough edges and ugliness. A web author looking for good typography is going to be better served reading Butterick's Practical Typography ( http://practicaltypography.com/ ).

It doesn't have the meticulous shine of Tufte's books, but this is a straightfoward CSS guide. It's a starting point, don't you think? Butterick's implementation is more than a CSS guide though, right? I thought his design was to show off the power of Pollen[0], his online-book-publishing system. [0] http://pollenpub.com/

It's a starting point, but a starting point that directs users to fake italic, fake small-caps, mismatched mono text, inconsistent apostrophes, and ugly underlines. (Oh, and sidenotes and other margin content just disappears on a phone.) If you're going to start from a template, it at least shouldn't lead you astray in multiple ways.

Re: Tufte CSS

#23

Post by lifeisstillgood » Wed, Aug 05, 2015, 9:27 PM UTC

I love the margin diagrams, and would happily use this for print based output, but I fear the mobile world would have meant Tufte would redesign his approach to suit the smaller uni-column world, and the best layout on page is very different to that on a four inch screen

Re: Tufte CSS

#24

Post by carsongross » Wed, Aug 05, 2015, 9:33 PM UTC

It's very nice looking.

Everyone criticizing the implementation, here, let me help you:

https://github.com/daveliepmann/tufte-css

Re: Tufte CSS

#25

Post by kmfrk » Wed, Aug 05, 2015, 9:41 PM UTC

I've always taken a liking to sidenotes, but the main problem with them is they are complicated by Markdown's rendering of footnotes.

It's great for many other purposes, but a lot of people will probably prefer doing things in Markdown.

Re: Tufte CSS

#26

Post by exizt88 » Wed, Aug 05, 2015, 9:41 PM UTC

I don't think Tufte ever uses top and bottom borders for tables. Also, the delimiter below the heading should not be so bold; it's usually a very thin line.

Re: Tufte CSS

#27

Post by gknoy » Wed, Aug 05, 2015, 9:42 PM UTC

tjohns wrote: post #16

Personally, I feel like the text is too big. Medium's site is already on the upper end of what I consider to be a usable font size (22px), and this is even larger (24px). At some point, larger type makes it difficult to quickly scan the page. For comparison, even Tufte's own site is rendered with a 16px font.

The font appears to scale (in a step function?) related to pixel-width of your window. Try using a narrower window. (This may or may not be related to retina resolution. I didn't read the code to find out.)

Re: Tufte CSS

#28

Post by javajosh » Wed, Aug 05, 2015, 9:49 PM UTC

One of the things I love most about Tufte is the way his text introduces every single graphic. He tells you what he's about to show you; then he shows you. This stands in stark contrast in most books where the figures are only very loosely coupled to the text. I didn't realize how jarring I found the convention until Tufte! And it makes perfect sense in hindsight: why did we think it's okay to put figures "within a page or two" of the relevant text?

This handout, by contrast, doesn't do this, and so it throws away something that, to me, is central to Tufte's appeal.

Re: Tufte CSS

#29

Post by unicornporn » Wed, Aug 05, 2015, 9:51 PM UTC

I like the idea but turned away when I saw those ugly fake italic headings. Never italicize fonts that are missing italic type styles.

Re: Tufte CSS

#30

Post by morsch » Wed, Aug 05, 2015, 10:00 PM UTC

adsche wrote: post #9

pto0239hn wrote: post #6

This seems like an okay idea, but does anyone feel that the italics used in the headings (font family: ETBembo) are generated and are quite ugly?

The italics are basically the only thing that looks OK here: http://i.imgur.com/H9X3Hpl.png Linux/Firefox FWIW.

Something is wrong with your Linux/Firefox, because it looks ok for me: http://i.imgur.com/txKbMfF.png

Firefox 39 on Ubuntu 15.04