Love the comments. Blows my mind how diverse the reactions are.<p>I read most HN on a 9 year old iPad. It's savage, raw compute would be fast enough, but limited RAM and pinned to a very old version of Mobile Safari. I generally keep JavaScript disabled, otherwise hangs are all too common.<p>If I can't at least read the basic idea of a web article at these settings, I move on. Perhaps it's arrogant of me, but I'm exasperated by current web design practice that requires megabytes of JavaScript to render a landing page.<p>`gwern.net` does not suffer from absolute madness, but the use of custom font means that the site is a blank page for thousands of milliseconds, and this old iPad has trouble scrolling the page of text even after the font is rendered.<p>My comments are probably irrelevant, but I'm not going to be surfing the web on a 16-core workstation with 32 gigabytes of RAM.
I like the design, but semantics and accessibility aren't great.<p>We have lists implemented like divs, navs like divs, lack of appropriate attributes, aria labels and few other things.<p>That's not great considering there's basically only static content without interaction.<p>Articles speaks about optimizing for performance but will still attempt to load 150kb of analytics library and doesn't handle fallback fonts and font rendering properly. What's the point of obsessing over bundle size when you will still shove fonts and analytics when loading the application?<p>In every one of my projects I always try to convince stakeholders and designers that they will find fonts that will be great among the system fonts and that it won't be that much of a difference to users generally (there's plenty of successful enterprises and top 50 websites out there that only use os fonts and make $$) and what I get are poorly implemented fonts with inconsistent heights and vertical positioning across different OSs.<p>And the irony is that since most of your company runs the same OS (MacOS) where this issue is not visible it's like it doesn't exist.
For a site that lists its #1 principle as <i>minimalism,</i> it sure has a <i>lot</i> going on at all times.<p>Multiple menus all over the screen, many different kinds of links with distinct underline and icon suffix, popups within popups that reinvent OS window functionality, historiated initials, graphical horizontal divider with <i>hidden links,</i> a recommended articles carousel, and a very (visually) busy comments section.<p>Minimal <i>it ain't.</i><p>If you want to see a professional minimal design, check out mine:<p><a href="https://hypertele.fi/ec997be8c5933e87" rel="nofollow">https://hypertele.fi/ec997be8c5933e87</a>
It’s a truly distinct and amazingly designed website that I’m often not smart enough to understand. It’s a unique property on the Net, and that’s saying a lot these days.<p>One thing I would like to understand more is the archive system (used to reduce the problem of dead links). Is there some kind of automated process to create local copies of the linked webpages, or is it done by hand using some thing like wget or curl? How far do they go to archive embedded assets such as images or PDF files? Are there any copyright considerations for archived articles (what if you archive someone’s article that they would prefer to keep off-line)?
I wouldn't necessarily call this a minimalist design. I do like Tufte-style websites with sidenotes, but these don't show on mobile for this site, despite my tablet having a large screen.<p>> Gwern.net used Baskerville, but system Baskerville fonts don’t have small caps.<p>Can someone explain to me what is meant by this? I don't understand what not having small caps means. I use Baskerville in my LaTeX documents with Michael Spivak's MathTime2 Pro fonts I purchased. I am currently building my blog, and despite trying to just get it out there and worry about my ideal design later, I am considering trying Baskerville and other such fonts instead of sans-serif fonts.
I love this site. The content, minimalism and focus on performance, the honest over-engineering, everything. But I can't read much of it as is.<p>• My reason is not the font, which I like, but the 'density' (not information density). The line height is too less for me.<p>• There are a lot of hyperlinks and they look like the factorial notation instead of an underline and are of the same color as normal text.<p>• Sidenotes are a good thing but they should be shown on demand, not everytime (maybe there's a setting I missed which does this).<p>• Regarding the pop-ins, I dig the idea but IMO, showing the whole page is not very useful. Maybe just the summary of what's to be shown. Why would I want to read a whole article in the pop-ins and what purpose do they serve which sidenotes don't?
It feels quite busy after claiming minimalism. Also, not a huge fan to see Disquss being used and a bunch of JS just to serve static content. Seems like most of the things us humans do - a cacophony of contradictions. Like the simple color scheme though, so points for that.
Gwern’s site always reminds me of the Talmud (Jewish religious text), which also has a highly distinctive design with multiple “panels” and heavy emphasis of commentary and references. It’s also somewhat confusing and intimidating the the “uninitiated” reader! It is certainly memorable though.
The design is bad because it uses full justification, which hurts readability by making all the lines the same length, which weakens the visual cues for vertical position, and makes the spacing between words inconsistent.<p>But I don't really care, because the site works correctly with Firefox's Reader View, which is better than any custom design because it always looks the same.
Yet again, this is a website that has clearly only been tested on a hiDPI screen.<p>At 100% scaling on Windows, the serif font used doesn't kern or render properly; crossbars in letters such as 't' and 'f' are overweight compared to other strokes, and makes the font look uneven.<p>Designers all seem to think we use 4k screens at 200% scaling, for that ultra smooth look, when in reality, that's far from the case[1].<p>Edit: Example of what I'm seeing: <a href="http://www.jaruzel.com/files/fonts.png" rel="nofollow">http://www.jaruzel.com/files/fonts.png</a><p>---<p>[1] <a href="https://gs.statcounter.com/screen-resolution-stats/desktop/worldwide" rel="nofollow">https://gs.statcounter.com/screen-resolution-stats/desktop/w...</a>
I think there's a negative correlation between detailed and overanalysed design philosophies and actually good design (or at least a tipping point of too much analysis after which it becomes negative). This seems to be a good example of that.
It's clear that a lot of love and attention to detail has gone into the making of this website. I like the typography, I like the layout on desktop, I feel like that's very much complete, apart from one thing I'll mention later.<p>As another person has commented, it does feel inspired by Tufte stuff — though I actually find the Tufte CSS implementation to be preferable to look at aesthetically and preferable for actually consuming content: <a href="https://edwardtufte.github.io/tufte-css/" rel="nofollow">https://edwardtufte.github.io/tufte-css/</a><p>Things I would change:<p>- the pop-up windows when hovering links etc. are incredibly annoying. There is a button to get rid of them, but that button needs to be on the side with the other customisation options <i>imho</i><p>- vertical spacing would look better than indentation for new paragraphs on mobile, it would help the text not look so densely packed, but maybe that's just my preference. It's usable just feels like the text is squashed in (I'm looking at it on an iPhone X). The choice of indentation for new paragraphs looks fine on desktop.<p>but that's just me and I'm no one and my opinion is meaningless.
I like the minimalism of Gwern's site, but the text formatting doesn't feel especially readable. Dan Luu's site has a similar problem <a href="https://danluu.com/nothing-works/" rel="nofollow">https://danluu.com/nothing-works/</a> by the time I get to the end of a line, it's hard to find the beginning of the next one. Also maybe a matter of taste, but it feels to me like serif fonts are good for books but not so great on the web. The most readable text formatting I've seen on the web is PG's website <a href="http://paulgraham.com/submarine.html" rel="nofollow">http://paulgraham.com/submarine.html</a> short lines, sans-serif font, tight paragraphs with space between them.
It's terrible.<p>When browsing this website, one needs to be careful not to move the mouse over anything that will trigger a popup and cover the page they are trying to read. It's quite easy to accidentally get to 3 layers of pupups.<p>Popups are antipattern, at least when they appear automatic, without user interaction.
I'm amazed by Gwern's ability to write. It seems that this guy's writing throughput is higher than my reading throughput. It also reminds me somehow Fravia's SearchLores, it has a similar philosophical feel to it.
Soon after my startup launched, Gwern asked to do a test of our reading-enhancement technology on his site. His test is now described in the Abandoned section on the linked page. [1]<p>I learned a very valuable lesson from our interaction: having someone test out your software in a public way is great, but if they fundamentally disagree with how the UX should function, you can't cede control.<p>Gwern disagreed with us on two fundamental points: (1) which color schemes to use, and (2) whether the user should be aware of (and presumably control) the activation and settings of the technology.<p>We knew from our usage data that practically no one used the greyscale theme — almost everyone used our colored themes. We also suspected that running a test where users were not made aware of the purpose of the color gradients would confuse and possibly annoy users — especially if they couldn't turn it on/off or change the colors.<p>The results were not surprising to us: lots of people were confused, and the color-based themes were more popular than he anticipated. In all of our subsequent partnerships/testing, we firmed up our UX guidelines and didn't so much control of testing procedures.<p>It was perhaps the right move to be flexible in the beginning — who were we, next to the mighty Gwern! But looking back it would have been much better for us (and I think Gwern as well) if the UX had been done in a way that gives users control. One nice looking example of our desired UX is here. [2]<p>1: <a href="https://www.gwern.net/Design#abandoned" rel="nofollow">https://www.gwern.net/Design#abandoned</a><p>2: <a href="https://unreasonable.is/how-to-stop-working-and-be-more-productive/" rel="nofollow">https://unreasonable.is/how-to-stop-working-and-be-more-prod...</a>
I like the formatting adaptation on this page! Especially, the micro-formatting of each indented paragraph and its subtopic. This technique is applied heavily in print books and technical journals (long dense form) even today, where each accent on the "structured text" adds on to the groove of line-tracking on page. Looks great, works great on print.<p>However, online scrolls are terrible at long-form. And that's because scrolls animate in a direction that's orthogonal to the reading direction. A vertically animating scroll rips apart our ability to read along a track. Meaning, no line-tracking. Since scrolling itself works against the grain of saccadic perception, animating structured text vertically only adds on to that difficulty of reading online.<p>I mean, as long as the web is a scrolling paradigm, a poetic structure would work better since its ragged left and right edges would help people track their position on the story better.
Not a fan at all. I'm on a 1080p monitor and the main font is janky and tiring to read.<p>There is far too much going on all over the place, popups and side notes distracting from all directions and apparently it loads ~4Mb of resources to achieve what is largely a text only site.
that thumbnail box appears at random and takes a couple seconds to be populated. Wikipedia has those but they only appear when you hover over some links. When they appear, they are already populated.. Man, that box keeps popping up for no reason..
The content is and has always been interesting, so one can forgive the design, which I feel is poor and irrational in some ways.<p>Poor because the line width is too long and the proportions are unattractive. Complex information that loads on hover can work offline, as in the sioyek PDF reader, when it’s fast, but is a terrible experience over the network. All that apparatus littering the text is distracting, but the ideas behind it are interesting.<p>Irrational because of such things as the fixed elements for site settings that only appear on the first page and fade out as you scroll down. If they're only intended to appear at the top, why give them fixed positioning?
In my experience, all of those features really slowed down my reading: the superscripts, the underlines on all the links, the serifs, and the visually heavy popups that appear immediately after hovering; contrast with Wikipedia's popups, which feel much lighter.<p>Thankfully, the site has a built-in reader mode to make most of this go away, but it also removes the good features, like sidenotes, and I have to wonder: if the reader mode is for reading, what's the "regular" mode for?<p>Also, typo: "epxnesive".
Text is obscured by the floating graphic tool buttons in the top right, on iPad. Once you scroll down far enough for them to <i>slowly fade out</i>, the whole thing is lopsided, with a big white margin on the left and text hugging the edge on the right.<p>Points for the detailed explanation of the principles and whims behind it, but the Design of this Website is poor.
The font hinting there looks quite ugly when viewing this on Windows. The font has some very sharp and thick edges, it's not very smooth and comfortable to read. It's probably much better on macOS or somewhere HiDPI.<p>When I add `* { font-family: georgia!important }` and scale the page down to 75 %, then it's quite comfortable to read.
Dynamic screen resizing has a few bugs. E.g. I dragged right screen border around and at one point (almost minimal width) saw that logo becomes gigantic and takes pretty much all the screen space.<p>Element:<p><pre><code> <use href="/static/img/logo/logo-smooth.svg#logo"></use></code></pre>
gwern tends to test stuff. Nootropics, ideas, and indeed, long-form readability.<p>Read about his AB-testing on the site metrics here.<p><a href="https://www.gwern.net/AB-testing" rel="nofollow">https://www.gwern.net/AB-testing</a>
The first time I saw this website, which was a year ago, I liked it so much that I was reading the code. This looks a new design, it's good but I like the earlier one more.
Try this<p>1. Click on the article link and land on the "Design of this website" page.<p>2. Now click on "Site" on the left navigation to go to "About" page.<p>3. Click the back button on the browser<p>See what you get :)
> A page can be terribly designed and render as typewriter text in 80-column ASCII monospace, and readers will still read it, even if they complain about it.<p>Ha! I would never complain about that. I'm a programmer!