First, to address your point. Paper is not pure white, and ink is not pure black. Books are also not backlit. If you want to recreate the experience of reading a book, use a slightly off-white color and a dark colored ink (for example, a very dark blue or brown).
Second, most everything on the page is way too cramped.
Third, you need to constrain text width. It's a lot of work to scan 1000 pixels for each line.
I made some quick changes in CSS to address the basic readability problems, and uploaded a screenshot:
(I was playing around with the links before I decided I was getting too far into the weeds, but the links in #content should have the underline. The links on the side shouldn't.)
> Third, you need to constrain text width. It's a lot of work to scan 1000 pixels for each line.
It's funny you criticize that, because it's one of the only parts of my site design that I actually have A/B tested: http://www.gwern.net/a-b-testing#max-width The smaller widths did not do well.
> Books are also not backlit. If you want to recreate the experience of reading a book, use a slightly off-white color and a dark colored ink (for example, a very dark blue or brown).
Hm, this sounds plausible.
html {
background-color: #FCFCFC;
}
html, a {
color: #303C3C;
}
Done.
blockquote {
font-style: italic;
}
No; I use blockquotes too much and they're too long to make them italics. The background shading seems like enough for now.
First, to address your point. Paper is not pure white, and ink is not pure black. Books are also not backlit. If you want to recreate the experience of reading a book, use a slightly off-white color and a dark colored ink (for example, a very dark blue or brown).
Second, most everything on the page is way too cramped.
Third, you need to constrain text width. It's a lot of work to scan 1000 pixels for each line.
I made some quick changes in CSS to address the basic readability problems, and uploaded a screenshot:
http://new.tinygrab.com/d5ac58cc253b078fa42a97b3c35417d28563...
(I was playing around with the links before I decided I was getting too far into the weeds, but the links in #content should have the underline. The links on the side shouldn't.)
CSS changes: