Pixels and Accessibility(joshwcomeau.com) |
Pixels and Accessibility(joshwcomeau.com) |
(Or, ideally, "make small text and fiddly diagrams bigger, but leave most images alone", but let's walk before we try to run.)
So maybe "rems for body text, px for headings" is the way to go.
what's probably a little more useful is that headings scale up slower than body text, using different clamp() functions, e.g., https://www.aleksandrhovhannisyan.com/blog/fluid-type-scale-...
Ideally what I want in an accessibility-settings dialog is "minimum font size that I can comfortably read", and a way for UI authors to say "this is normal body text".
Instead what we tend to get is blanket advice like Android's "use sp dimensions for text", which simply scales everything up.
iOS's preferredFontFor textStyle stuff seems like the right approach in principle, but they still seem to have the idea that if I want large body text I must also want huge headings (which is terrible, because if I have large body text I also have less space than usual).
Far from always!
“For screen displays, it traditionally represents one device pixel (dot). However, for printers and high-resolution screens, one CSS pixel implies multiple device pixels. 1px = 1/96th of 1in.”
And this multiple isn't necessarily an integer, it's specified as a floating point number (though I've in practice only seen fractional parts of .5 (on a samsung galaxy IIRC) )
( https://developer.mozilla.org/en-US/docs/Web/API/Window/devi... )
And yeah, the plan is to keep providing a bunch of free content, knowing that a small % of people who read the blog will go on to buy the course. Way more sustainable than it used to be, when this was something I did outside of my job.
The reference pixel is the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm’s length. For a nominal arm’s length of 28 inches, the visual angle is therefore about 0.0213 degrees. For reading at arm’s length, 1px thus corresponds to about 0.26 mm (1/96 inch). - https://www.w3.org/TR/css-values-4/#absolute-lengths
This explains why 1px is small on phones and large on televisions; the physical size varies by expected reader distance. The angle tries to stay constant, though in practice it gets rounded to the nearest multiple of the physical pixel size.
Even in theory, this has never been true AFAIK. Pixels (px) are relative to the properties of the viewing device, the user's OS and browser settings, etc. The author appears to be confusing "physical pixel" with "logical pixel".
This is important. If you're rendering images/graphics with a pixel as your smallest unit then you're not going to look good on most modern devices.