4 ms·

Agreed, but a max-width on the content would do wonders for readability.

by kauffj 11y ago

dkersten 11y ago
And bigger font size. Luckily, because of his minimal style, zooming works perfectly fine, unlike some media-rich sites. :)
sampo 11y ago
> max-width on the content would do wonders for readability. Or you can resize your window?
- mahouse 11y ago
  Or you can resize the screen of your phone with your fingers?
  - tedunangst 11y ago
    And constantly pan left and right? Pass.
    - vollmond 11y ago
      I think he was being facetious (pointing out that "resize your browser window" isn't really an option on most mobile devices).
- alkonaut 11y ago
  Feels a bit silly to resize a 20-tab browser window because one site failed to have proper content width. I'm very happy with having a 1920px maximized browser window. I don't like having non-maximized windows (in windows), it's just clumsy without a good layout system. You can have windows snapped at half width but I also want content centered on the screen. So no: failing to set max width on a web page is not a good way to just present a clean page of information rather than an experience. It's just a bad webpage.
  - sampo 11y ago
    You are spending 100s of seconds reading a webpage, so spending 1 second to resize the text width to your liking is a very small overhead.
    - alkonaut 11y ago
      For a longform page it may be worth doing for readability, but the whole idea of fiddling with the borders of my browser window (which is shared between all the tabs) back and forth as I switch tabs is silly.
- s73v3r 11y ago
  That's a terrible idea, because most of the other tabs I have open in my browser fit just fine with the size I have the window at.
Symbiote 11y ago
A little Javascript bookmarklet should do that nicely. I'll write one tomorrow, if I don't find one.
- Buge 11y ago
  You had better license it as free software.
  - Symbiote 11y ago
    Is CC0 OK? http://git.io/vTmEc http://git.io/vTmEc I'm not sure if HN will accept the link: <a onclick="alert('Drag this link to your bookmarks bar'); href="javascript:(function(){var body = document.getElementsByTagName('body')[0];var style = body.style;var ss = [55,34,21,13,8];var sx = ('bodyMaxWidthIndex' in body) ? body.bodyMaxWidthIndex : 1;style.setProperty('max-width', ss[++sx % ss.length]+'cm', 'important');style.setProperty('line-height', '1.5');style.setProperty('margin-left', 'auto');style.setProperty('margin-right', 'auto');style.setProperty('font-family', 'sans-serif');body.bodyMaxWidthIndex = sx;})();">→🖺←</a>
- dzhiurgis 11y ago
  I was experimenting with HN and for some reason this only works in console > javascript:document.getElementById("hnmain").width="50%"
  - dzhiurgis 11y ago
    Can't edit old comment. Made it work as a bookmarklet with following code: javascript:(function(){document.getElementById("hnmain").width="50%"})();
205guy 11y ago
Wonders for YOUR readability. Other people have different viewports and screen sizes/resolutions and that would most likely interfere with some of them. Some people might even prefer dense text and long lines (doesn't bother ME). As others have pointed out, you should be able to adjust your browser to get the reading experience you want. Turn your tablet vertically if reading in landscape. Open current tab in new window and make it as narrow as you want. Or have smart browser extensions that do it automatically for YOU.
- dredmorbius 11y ago
  Define the width in em units. Max width of 30-45em is usually ideal. A 2-4em padding keeps text out of the gutters entirely. Browsers used to have controls to toggle CSS stylesheets on or off. Frankly, I'd prefer they still did.
collinmanderson 11y ago
body { max-width: 800px; line-height: 1.5; font-size: 1.5em; margin: auto; } Maybe add in the trendy color: #222.

Agreed, but a max-width on the content would do wonders for readability.

by kauffj 11y ago

Agreed, but a max-width on the content would do wonders for readability.

And bigger font size. Luckily, because of his minimal style, zooming works perfectly fine, unlike some media-rich sites. :)

sampo 11y ago

> max-width on the content would do wonders for readability. Or you can resize your window?

mahouse 11y ago
Or you can resize the screen of your phone with your fingers?
- tedunangst 11y ago
  And constantly pan left and right? Pass.
  - vollmond 11y ago
    I think he was being facetious (pointing out that "resize your browser window" isn't really an option on most mobile devices).
alkonaut 11y ago
Feels a bit silly to resize a 20-tab browser window because one site failed to have proper content width. I'm very happy with having a 1920px maximized browser window. I don't like having non-maximized windows (in windows), it's just clumsy without a good layout system. You can have windows snapped at half width but I also want content centered on the screen. So no: failing to set max width on a web page is not a good way to just present a clean page of information rather than an experience. It's just a bad webpage.
- sampo 11y ago
  You are spending 100s of seconds reading a webpage, so spending 1 second to resize the text width to your liking is a very small overhead.
  - alkonaut 11y ago
    For a longform page it may be worth doing for readability, but the whole idea of fiddling with the borders of my browser window (which is shared between all the tabs) back and forth as I switch tabs is silly.
s73v3r 11y ago
That's a terrible idea, because most of the other tabs I have open in my browser fit just fine with the size I have the window at.

Symbiote 11y ago

A little Javascript bookmarklet should do that nicely. I'll write one tomorrow, if I don't find one.

Buge 11y ago
You had better license it as free software.
- Symbiote 11y ago
  Is CC0 OK? http://git.io/vTmEc http://git.io/vTmEc I'm not sure if HN will accept the link: <a onclick="alert('Drag this link to your bookmarks bar'); href="javascript:(function(){var body = document.getElementsByTagName('body')[0];var style = body.style;var ss = [55,34,21,13,8];var sx = ('bodyMaxWidthIndex' in body) ? body.bodyMaxWidthIndex : 1;style.setProperty('max-width', ss[++sx % ss.length]+'cm', 'important');style.setProperty('line-height', '1.5');style.setProperty('margin-left', 'auto');style.setProperty('margin-right', 'auto');style.setProperty('font-family', 'sans-serif');body.bodyMaxWidthIndex = sx;})();">→🖺←</a>
dzhiurgis 11y ago
I was experimenting with HN and for some reason this only works in console > javascript:document.getElementById("hnmain").width="50%"
- dzhiurgis 11y ago
  Can't edit old comment. Made it work as a bookmarklet with following code: javascript:(function(){document.getElementById("hnmain").width="50%"})();

205guy 11y ago

Wonders for YOUR readability. Other people have different viewports and screen sizes/resolutions and that would most likely interfere with some of them. Some people might even prefer dense text and long lines (doesn't bother ME). As others have pointed out, you should be able to adjust your browser to get the reading experience you want. Turn your tablet vertically if reading in landscape. Open current tab in new window and make it as narrow as you want. Or have smart browser extensions that do it automatically for YOU.

dredmorbius 11y ago
Define the width in em units. Max width of 30-45em is usually ideal. A 2-4em padding keeps text out of the gutters entirely. Browsers used to have controls to toggle CSS stylesheets on or off. Frankly, I'd prefer they still did.

collinmanderson 11y ago

body { max-width: 800px; line-height: 1.5; font-size: 1.5em; margin: auto; } Maybe add in the trendy color: #222.