5 ms·

This article is basically unreadable for me 48 y/o on desktop). In the dev tools I added the following to the body to make it readable: font-size: 18px;

This article is basically unreadable for me 48 y/o on desktop). In the dev tools I added the following to the body to make it readable: font-size: 18px; line-height: 1.5em; max-width: 38rem; Now look how readable (and beautiful) it is. I read a lot of Dan Luu's posts, and each time I have to do this sort of thing to make it readable. Seriously, techies, it's an extra 64 Bytes to make your page more readable.

hmottestad 3y ago
It’s pretty terrible on my phone too. Almost no margins and small font. Thankfully Reader Mode works in Safari, which fixes everything.
- db48x 3y ago
  This page doesn’t specify _any_ font size. It relies on your browser to choose an appropriate size instead. If the text is too small for you to read, then your browser settings for default font size are wrong.
extra88 3y ago
I agree that they should add some minimal CSS. But using your browser's Reader View also works, a click rather than multiple steps in DevTools.
db48x 3y ago
Why don’t you just change your browser’s default font size?
jagged-chisel 3y ago
Do you have any idea of the layers of tooling you must use these days to produce those 64 bytes, and how each of those layers change and remove was was fed from all the other layers? To get exactly those bytes out the other end of the tools would be a herculean effort. Because we can’t just go around trying to understand basic web-based development without the frameworks … can we?
blehn 3y ago
I think your mods are sensible, however if Dan Luu added those CSS rules himself, there would be comments on here lamenting the low density and "excess whitespace". Luu's audience, on the whole, probably prefers the relatively unstyled approach.
gnicholas 3y ago
The first time I saw this blog posted on HN I wondered how it could possibly be popular with such horrendous layout. The conclusion I came to is that the audience is very tech-savvy and is used to activating Reader Mode when they encounter pages like this.
- lstamour 3y ago
  Actually when I hit pages like this, I use the increase font size buttons. I tend to do this on phones too, especially. Yes, reader mode is also an option, but just bumping up the font size works too. You could also go back to the days when we had 800x600 monitors and 16px tended to be just the right size for that. ;-)
- chmod775 3y ago
  I went with the other techie solution: resizing my browser window.
  - mardifoufs 3y ago
    How do you do that on mobile?
    - skydhash 3y ago
      Who read article like this on mobile? In a pinch, I'd just activate Reader Mode (Safari, iOS), or more likely save it for reading on a bigger screen (tablet, laptop,…)
      - ParetoOptimal 3y ago
        I just read it on Firefox mobile without reader mode.
      - pbronez 3y ago
        Read it on iOS Safari, without reader mode. Worked great. Only thing that annoyed me is that there are very lengthy appendices. Thus the scroll bar suggests the main article is much longer than it actually is.
gerdesj 3y ago
I'm 53 and I'm at least five years behind getting my specs sorted out - they are currently perched right on the end of my nose now and I have to get the angle right sometimes (astigmatism). That page is nearly fine for me but I just hit CRTL + to scale up. That works for me. That page is pure text with no or at least minimal fiddling. You have your solution for your use case and I have mine. A blind reader will also have their solution, so they can even access it. Thanks to the simplicity of the source: all solutions to accessibility are also going to be reasonably simple. I think that Dan understands how to communicate effectively - keep it simple and don't assume that eyes will read your words. You can trivially (and you do) fiddle with the presentation yourself for your own purposes. I think that if you don't like the presentation of something like this then you could reformat it yourself, prior to engagement. Dan has kindly provided his message as a simple text stream that can be trivially fiddled with.
- solatic 3y ago
  > That page is nearly fine for me but I just hit CRTL + to scale up. That works for me. How do you do CTRL++ on a mobile phone?
  - gerdesj 3y ago
    I assume you use some sort of gesture. Hit F1 to find out how to do it.
  - gerdesj 3y ago
    Pass the page through a screen reader and listen to the ensuing podcast. Try using some imagination!
  - gerdesj 3y ago
    > How do you do CTRL++ on a mobile phone? No idea but you seem to have managed it 8)
  - aembleton 3y ago
    Click on reader view. Then you can customise reader view from the menu and set it to how you want it. Then every time you click on reader view you can read in the font and size that works for you.
XorNot 3y ago
I'd prefer to see the grey text trend die honestly. I think my number one style-rewrite is just setting `font-color: black` on things.
zzo38computer 3y ago
I disagree. The user can change the window size, font size, colours, etc according to their own preferences. > I read a lot of Dan Luu's posts, and each time I have to do this sort of thing to make it readable. You shouldn't have to. You should be allowed to add a CSS file which can apply to multiple files, and then use that, instead of having to do it for each file individually.
ordu 3y ago
> In the dev tools I added the following to the body to make it readable For cases when you don't agree with styles there is Reader Mode. Your way works also, but Reader Mode just simplier, it is just one click away.
- gnicholas 3y ago
  True, although not all browsers have Reader Mode. Chrome didn't have it until last year, and the version they built is a sidebar, unlike most Reader Modes. This is probably because they want to make sure ads are shown alongside the Reader Mode.
- gitaarik 3y ago
  In reader mode the colors in the table disappear. Ironical the author does style that.
userbinator 3y ago
Then adjust your browser settings to your preference, because that certainly isn't mine either. I've had to remove "max-width"'s from a ton of sites using my filtering proxy. My window is this big, I expect your content to fill it!
dchest 3y ago
If you can't read font-size: 14px, you got your resolution/scaling/screen size wrong. The default text size is similar to the standard text size of OS UI controls. If you can't read them, I'd suggest to reconfigure your setup: change resolution, change scaling, or configure the default zoom level.
progval 3y ago
You can change your browser's default font size if you find it too small. It's in Firefox's main settings page. Websites shouldn't force "font-size: 18px;" because it then makes the font smaller for users who picked a larger font in their browser.
nottorp 3y ago
> max-width: 38rem; Now look how readable (and beautiful) it is. How is it readable when you're limiting text width and not taking advantage of the whole screen you paid for? [Turning 48 next month and wearing glasses.]
- wraptile 3y ago
  FYI the optimal line length is 50-75 characters and that has been the standard for text since the type writers. You don't want to move your neck when you read a single line that's kinda silly.
  - db48x 3y ago
    If you have to move your head when reading text in your web browser, then your web browser’s window is too wide. Narrow it until you are comfortable, but don’t try to impose your limitations on other people.
  - nottorp 3y ago
    > that has been the standard for text since the type writers I have a feeling it was the standard because they used the minimum font size to make the letters readable, and that's how much it fit on the physical page width. Which was standardized before typewriters for unknown historical reasons? > You don't want to move your neck when you read a single line that's kinda silly. I don't have to move my neck to read the article spread across the full width of my monitor. On 13" laptop or 24" desktops. Are you using a 21:9 utrawide?
    - wraptile 3y ago
      It's been this way forever because it's not particularly difficult science and is extremely easy to test for so there are probably thousands of papers covering this. Here's a good summary by Baymard Institute[1]. Also WCAG recommends line length set to <80 characters too [2]. I'm not sure what else could make this more convincing or official. 1 - https://baymard.com/blog/line-length-readability https://baymard.com/blog/line-length-readability 2 - https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html https://www.w3.org/WAI/WCAG21/Understanding/visual-presentat...
BlackFingolfin 3y ago
I just activate reader mode on his pages, works great. (Not disagreeing with you, just stating another workaround) Also wish his pages had dates on them (one or both of first posted / last updated) AFAIK he intentionally leaves them out, I don't get why.
- lifthrasiir 3y ago
  > AFAIK he intentionally leaves them out, I don't get why. Some people like to brag about the timelessness of their articles [1], and that might be one reason. (I personally don't fully agree though, even the linked original WikiWikiWeb page has a last edited date.) [1] https://wiki.c2.com/?WikiNow https://wiki.c2.com/?WikiNow
erichdongubler 3y ago
Funnily enough, Dan calls out the differences of opinion of the styling of his site starting at this paragraph: > Just as an aside, something I've found funny for a long time is that I get quite a bit of hate mail about the styling on this page (and a similar volume of appreciation mail). …

hmottestad 3y ago

It’s pretty terrible on my phone too. Almost no margins and small font. Thankfully Reader Mode works in Safari, which fixes everything.

db48x 3y ago
This page doesn’t specify _any_ font size. It relies on your browser to choose an appropriate size instead. If the text is too small for you to read, then your browser settings for default font size are wrong.

extra88 3y ago

I agree that they should add some minimal CSS. But using your browser's Reader View also works, a click rather than multiple steps in DevTools.

db48x 3y ago

Why don’t you just change your browser’s default font size?

jagged-chisel 3y ago

Do you have any idea of the layers of tooling you must use these days to produce those 64 bytes, and how each of those layers change and remove was was fed from all the other layers? To get exactly those bytes out the other end of the tools would be a herculean effort. Because we can’t just go around trying to understand basic web-based development without the frameworks … can we?

blehn 3y ago

I think your mods are sensible, however if Dan Luu added those CSS rules himself, there would be comments on here lamenting the low density and "excess whitespace". Luu's audience, on the whole, probably prefers the relatively unstyled approach.

gnicholas 3y ago

The first time I saw this blog posted on HN I wondered how it could possibly be popular with such horrendous layout. The conclusion I came to is that the audience is very tech-savvy and is used to activating Reader Mode when they encounter pages like this.

lstamour 3y ago
Actually when I hit pages like this, I use the increase font size buttons. I tend to do this on phones too, especially. Yes, reader mode is also an option, but just bumping up the font size works too. You could also go back to the days when we had 800x600 monitors and 16px tended to be just the right size for that. ;-)
chmod775 3y ago
I went with the other techie solution: resizing my browser window.
- mardifoufs 3y ago
  How do you do that on mobile?
  - skydhash 3y ago
    Who read article like this on mobile? In a pinch, I'd just activate Reader Mode (Safari, iOS), or more likely save it for reading on a bigger screen (tablet, laptop,…)
    - ParetoOptimal 3y ago
      I just read it on Firefox mobile without reader mode.
    - pbronez 3y ago
      Read it on iOS Safari, without reader mode. Worked great. Only thing that annoyed me is that there are very lengthy appendices. Thus the scroll bar suggests the main article is much longer than it actually is.

gerdesj 3y ago

I'm 53 and I'm at least five years behind getting my specs sorted out - they are currently perched right on the end of my nose now and I have to get the angle right sometimes (astigmatism). That page is nearly fine for me but I just hit CRTL + to scale up. That works for me. That page is pure text with no or at least minimal fiddling. You have your solution for your use case and I have mine. A blind reader will also have their solution, so they can even access it. Thanks to the simplicity of the source: all solutions to accessibility are also going to be reasonably simple. I think that Dan understands how to communicate effectively - keep it simple and don't assume that eyes will read your words. You can trivially (and you do) fiddle with the presentation yourself for your own purposes. I think that if you don't like the presentation of something like this then you could reformat it yourself, prior to engagement. Dan has kindly provided his message as a simple text stream that can be trivially fiddled with.

solatic 3y ago
> That page is nearly fine for me but I just hit CRTL + to scale up. That works for me. How do you do CTRL++ on a mobile phone?
- gerdesj 3y ago
  I assume you use some sort of gesture. Hit F1 to find out how to do it.
- gerdesj 3y ago
  Pass the page through a screen reader and listen to the ensuing podcast. Try using some imagination!
- gerdesj 3y ago
  > How do you do CTRL++ on a mobile phone? No idea but you seem to have managed it 8)
- aembleton 3y ago
  Click on reader view. Then you can customise reader view from the menu and set it to how you want it. Then every time you click on reader view you can read in the font and size that works for you.

XorNot 3y ago

I'd prefer to see the grey text trend die honestly. I think my number one style-rewrite is just setting `font-color: black` on things.

zzo38computer 3y ago

I disagree. The user can change the window size, font size, colours, etc according to their own preferences. > I read a lot of Dan Luu's posts, and each time I have to do this sort of thing to make it readable. You shouldn't have to. You should be allowed to add a CSS file which can apply to multiple files, and then use that, instead of having to do it for each file individually.

ordu 3y ago

> In the dev tools I added the following to the body to make it readable For cases when you don't agree with styles there is Reader Mode. Your way works also, but Reader Mode just simplier, it is just one click away.

gnicholas 3y ago
True, although not all browsers have Reader Mode. Chrome didn't have it until last year, and the version they built is a sidebar, unlike most Reader Modes. This is probably because they want to make sure ads are shown alongside the Reader Mode.
gitaarik 3y ago
In reader mode the colors in the table disappear. Ironical the author does style that.

userbinator 3y ago

Then adjust your browser settings to your preference, because that certainly isn't mine either. I've had to remove "max-width"'s from a ton of sites using my filtering proxy. My window is this big, I expect your content to fill it!

dchest 3y ago

If you can't read font-size: 14px, you got your resolution/scaling/screen size wrong. The default text size is similar to the standard text size of OS UI controls. If you can't read them, I'd suggest to reconfigure your setup: change resolution, change scaling, or configure the default zoom level.

progval 3y ago

You can change your browser's default font size if you find it too small. It's in Firefox's main settings page. Websites shouldn't force "font-size: 18px;" because it then makes the font smaller for users who picked a larger font in their browser.

nottorp 3y ago

> max-width: 38rem; Now look how readable (and beautiful) it is. How is it readable when you're limiting text width and not taking advantage of the whole screen you paid for? [Turning 48 next month and wearing glasses.]

wraptile 3y ago
FYI the optimal line length is 50-75 characters and that has been the standard for text since the type writers. You don't want to move your neck when you read a single line that's kinda silly.
- db48x 3y ago
  If you have to move your head when reading text in your web browser, then your web browser’s window is too wide. Narrow it until you are comfortable, but don’t try to impose your limitations on other people.
- nottorp 3y ago
  > that has been the standard for text since the type writers I have a feeling it was the standard because they used the minimum font size to make the letters readable, and that's how much it fit on the physical page width. Which was standardized before typewriters for unknown historical reasons? > You don't want to move your neck when you read a single line that's kinda silly. I don't have to move my neck to read the article spread across the full width of my monitor. On 13" laptop or 24" desktops. Are you using a 21:9 utrawide?
  - wraptile 3y ago
    It's been this way forever because it's not particularly difficult science and is extremely easy to test for so there are probably thousands of papers covering this. Here's a good summary by Baymard Institute[1]. Also WCAG recommends line length set to <80 characters too [2]. I'm not sure what else could make this more convincing or official. 1 - https://baymard.com/blog/line-length-readability https://baymard.com/blog/line-length-readability 2 - https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html https://www.w3.org/WAI/WCAG21/Understanding/visual-presentat...

BlackFingolfin 3y ago

I just activate reader mode on his pages, works great. (Not disagreeing with you, just stating another workaround) Also wish his pages had dates on them (one or both of first posted / last updated) AFAIK he intentionally leaves them out, I don't get why.

lifthrasiir 3y ago
> AFAIK he intentionally leaves them out, I don't get why. Some people like to brag about the timelessness of their articles [1], and that might be one reason. (I personally don't fully agree though, even the linked original WikiWikiWeb page has a last edited date.) [1] https://wiki.c2.com/?WikiNow https://wiki.c2.com/?WikiNow

erichdongubler 3y ago

Funnily enough, Dan calls out the differences of opinion of the styling of his site starting at this paragraph: > Just as an aside, something I've found funny for a long time is that I get quite a bit of hate mail about the styling on this page (and a similar volume of appreciation mail). …