Hacker News new | ask | show | jobs
by nodesocket 4787 days ago
My recommendations, for a more pleasurable reading experience:

    body {
      width: 70%;
      font-size: 20px;
      margin: auto;
      font-family: sans-serif;
      line-height: 30px;
    }
2 comments

Pedantic nitpick incoming

Sans-serifs are generally harder to read. Note, for example, how virtually all books are set in serifs. The primary reason sans-serifs are widely used in computers is the lack of decent display resolution required to display the actual serifs. So if you are using a larger font size to read something off the screen, there is no reason not to use a serifed typeface.

This might very well be a myth. See e.g. http://alexpoole.info/blog/which-are-more-legible-serif-or-s....
Everything that has to do with the perception might very well be a myth :)

However, in typography and type designer circles it is commonly accepted that Serifs are superior for consuming large quantities of text. Also in layman terms - serifs make the glyphs more distinct and easier to recognize at a glance, in contrast to the sans where there are several glyph pairs that look virtually the same.

"Commonly accepted" isn't worth much when it conflicts with actual science. Lots of things commonly accepted are simply incorrect.
Please don't pull a Wikipedia on me here. As an old physicist joke goes -

  Experimental physicist comes to a theoretical physicist office,
  bring a graph from a recent experiment and asks for a help with
  interpreting the results. 

  - Well, it's all rather obvious. Here's a peak, here's a dip,
    because of this, that and third.

  - Hold it, hold it... you are looking at it upside down.

  - Ah, right, right. *Rotates the graph*. Oh, it's now even more 
    obvious than before.
In other words, the "actual science" you are referring to frequently ends up to be nothing more than a matter of interpretation and a subject to all sorts of biases. Especially when it concerns something as unquantifiable as "comfort of reading". Just pick up a couple of fiction books, one set in serif and another in sans-serif, go through a pageful of text and see for yourself.
You can't just dismiss science and fact when it's inconvenient. Well, you can, but then your beliefs have no more backing than those of astrologers, and you're guilty of willfully spreading misinformation. You asserted a falsifiable statement as fact ("Sans-serifs are generally harder to read") and in the face of fairly compelling evidence that it is in fact a false statement, you immediately appealed to "common knowledge". It's also "common knowledge" that Einstein failed math as a kid and that eating before swimming will give you cramps, but these are both untrue statements.

Comfort of reading is very quantifiable. You can present text to a bunch of people in serif and sans serif fonts (double-blind and randomized) and ask them to rate how pleasant the text was. You can be clever and ask questions that measure understanding and retention, or you can ask them how much they enjoyed reading the passage, and these will give you indirect measures of reading comfort. Or you can be blunt and ask if they enjoy reading in the font, though this will pick up biases more. Either way is significantly more scientific than an appeal to common knowledge, though.

> Just pick up a couple of fiction books, one set in serif and another in sans-serif, go through a pageful of text and see for yourself.

This isn't science. This is just bias confirmation. ("Wow, I prefer the one I expected to prefer!")

But for the record, my e-reader font is set to Gill Sans.

My university teacher who was a fan of LaTex, taught web development and actually had a job outside the uni, told us that Serif fonts look bad and unreadable on computer displays. He said the reason is resolution. Books don't have DPI limits, and you can have a serif font look good to the tiniest detail.
I think `width: 70%;` is a bad idea. If you have a very wide screen, 70% of it is too much and on a mobile device you don't want to waste 30%.
It's a catch-22 pretty much. If you set it as pixels, it can be either too narrow (600 px on a full hd in full screen, though lines that are too wide/long suck too) or too wide (which leads to scroll bars).

Setting it as a percentage will obviously always make it look the same since it scales. However, a percentage on a huge screen usually makes it too wide to read lines comfortably.

You pretty much have to pick your poison, though IMO about 600 px is the maximum width for a line before it's horrible to read on a full hd screen.

This is a solved problem.

   max-width: 600px;
This stops your text from being excessively wide, but also doesn't prevent smaller screens from making it more narrow.
Thats a pretty good way, but it's not dpi independent.
That's partially true. A CSS pixel isn't necessarily the same as a screen pixel. A Mac with a retina display set to "native" resolution, for example, should actually make that 1200 pixels wide (max). In general, though, I think most browsers will treat a css pixel as a screen pixel.

Of course you could also use points or ems if you prefer.