You chose a font that is better suited for headings than for body text. And BTW, on white-on-black, the author had intended that you would use a slightly bolder version of the font.
No argument here…
Your choice of large blocks of saturated colour is harder to read and harder on the eyes, not better.
Ehh? I didn't change any of the colors…
Some sizes are more than twice as large as others, which is harder to read.
This is intentional. This way I know where to look at… So at least for me it's easier to read.
Some text is too large for me on my 100 PPI screen/70 cm viewing distance. You should use the unit pt instead of px, so that font size is relative to the resolution of the user's monitor and settings.
You are right. On my own version I indeed use pt. The problem of using points is that it doesn't work on Windows, because MS insists that all screens are 72dpi (at least for the last time I checked, maybe things are better in Win10). And there maybe inconsistency among browsers as well.
My own dev environment involves only Apple devices and Safari, so I can use pt without problem. Texts are the same physical size across all the monitors and iPads. But outside my environment, I cannot rely on pt to give meaningful result.
It's kinda sad that today when 200dpi+ monitors are popular, people still say things like "Generally, 1em = 12pt = 16px = 100%"… This was said in a blog post in 2008, and people are still quoting it in stackoverflow and tutorials…
BTW do you know that all CSS colors displayed in Chrome are wrong…?
https://bugs.chromium.org/p/chromium/issues/detail?id=44872
