This is an absolutely beautiful design system, and a beautiful way of presenting one. I love the interplay of the organic serifs and handwritten script for inputs, with all the attention to detail for balanced line heights and weights.
Wish there were custom checkboxes and radio buttons - they're the only thing that break immersion at the moment! Everything else is absolutely stellar. Might inspire me to finally make that blog I've been thinking about!
The font doesn't seem that great to me. Not sure exactly why but while it's not quite difficult for me to read, it's not as easy as other common fonts.
I think that's kind of the whole point. It is introducing an ambience, it is deliberately made quirky and irregular like the handwriting of some. It is not a common font and that means our eyes are going to be slightly unused to reading it.
I appreciate it if sites demoing their CSS embed the non-minimized version. I wanted to take a quick peek at what it looked like, but instead I have to go through a few additional hops to grab the source. Or at least just a clickable link directly to the unprocessed form.
> Permitted parents: Any element that accepts flow content. Note that a <header> element must not be a descendant of an <address>, <footer> or another <header> element
I think you can use a header more or less anywhere, and it is a header for content contained by its parent.
this, mixed with the look of a LaTeX document is exactly the kind of vibe I'm looking to go with for my personal site as well. Something just so appealing about it to me.
that, and the ultra-minimal look of websites of old university professors (basically just html and nothing else) looks so cool to me.
I am glad Tufte emphasizes tight integration between images and text, a reasonable style choice that certain TeX purists refuse to acknowledge. In my writings at least, technical or otherwise, images and text are part of one continuous narrative; it makes no more sense to reorder and relocate my images than to do so to my paragraphs.
No. Please don't put script fonts in uppercase. It's absolute death to readability.
Actually don't put anything in uppercase - like underlining, it's a form of emphasis that has its origins in typewriters, which were locked to one typeface.
The uppercase letterforms are too similar -- there is no variation in the heights of the letters, so your eye finds it harder to read. Upper and lower case, you have letters like y and p and j which have descenders; b and d and t who have ascenders, and the variation is easier to parse.
For emphasis, please use size, weight, and italics.
I wish there were more of the minimalist CSS frameworks with opinionated styling. Easy to find very nice generic ones, but harder if you want one with some flavor.
And when font selection by a web page is disallowed altogether, it is rendered with my preferred font, but with a reduced font-weight, slightly increased font-size, and increased line-height. The low weight in particular, combined with it picking up the dark theme, makes the text rather uncomfortable to read.
Code for those interested: https://github.com/wintermute-cell/magick.css/blob/master/ma...
Wish there were custom checkboxes and radio buttons - they're the only thing that break immersion at the moment! Everything else is absolutely stellar. Might inspire me to finally make that blog I've been thinking about!
Dead Comment
I appreciate it if sites demoing their CSS embed the non-minimized version. I wanted to take a quick peek at what it looked like, but instead I have to go through a few additional hops to grab the source. Or at least just a clickable link directly to the unprocessed form.
> Permitted parents: Any element that accepts flow content. Note that a <header> element must not be a descendant of an <address>, <footer> or another <header> element
I think you can use a header more or less anywhere, and it is a header for content contained by its parent.
that, and the ultra-minimal look of websites of old university professors (basically just html and nothing else) looks so cool to me.
i wish personal blogs were more popular!
Actually don't put anything in uppercase - like underlining, it's a form of emphasis that has its origins in typewriters, which were locked to one typeface.
The uppercase letterforms are too similar -- there is no variation in the heights of the letters, so your eye finds it harder to read. Upper and lower case, you have letters like y and p and j which have descenders; b and d and t who have ascenders, and the variation is easier to parse.
For emphasis, please use size, weight, and italics.
Thank you.
However, in doing so, it also creates a distinctive style.
I think I like it.
https://edwardtufte.github.io/tufte-css/
https://www.mcsweeneys.net/articles/im-comic-sans-asshole