51–60 of 146 posts
I agree completely with this article. As I've gotten older (now 43) I have had more and more trouble reading web sites. In fact, I've noticed lately that I don't even try on some sites that have "small" fonts, I just close the tab. There are some sites that I really like and I generally depend on my browser to help me out. Chrome has a good habit of remembering my page zoom on a particular site so I don't even notice…
Earlier quoted context omitted.
Can we get over specifying text size by pixels already? You don't know what DPI monitor I will have when I look at your pages.
Unfortunately we can't. Maybe for copy text it's ok, but not for other page elements, ones that we want to align in a specific way to bitmap images, no. The page-zoom style resizing is our best bet --it's the "resolution independent" way to have your pixels and eat them too. Now, if we could provide bitmap assets that could be zoomed in the same way, instead of just showing bigger but more pixelated (as we can in app…
The most common way (used for icons) is to provide multiple bitmaps and load the right one depending on screen DPI. You can do this on your site too.
And there's of course vector graphics (SVG), if you don't mind some extra processing on the client for rendering...
Did anybody else have trouble understanding what "body copy" means? I know such things as "body font size" or so...
Earlier quoted context omitted.
16px you mean?
The rest of the site is 12px — only this article had a body copy size of 16px.
See this for example, (at 12px)
http://www.smashingmagazine.com/2011/10/05/smashing-coffee-m...
Why "16 pixels"? Wouldn't scaling fonts based in cm/inch make more sense to be resolution independent, especially important on mobile devices?
Many mobile devices ignore these units - to my annoyance - in favour of the "reference pixel" as defined in CSS. http://www.w3.org/TR/CSS2/syndata.html#length-units Crazy-speak IMO, and I suspect I'm not the only one... perhaps someone in the standards community could explain the rationale.
I guess to do it correctly you'd have to write javascript to reliably detect the DPI on all platforms/browsers (as far as possible, if not make some educated guess) then adapt your text sizes to that :(
So I can certainly understand 'just choose 16px and be done with it'.
This is an important issue to consider, but talking about "pixels" alone doesn't get us far in this context. For one thing, different fonts have different design characteristics. In particular, the x-height of one sensible body font at a nominal 16px could easily be 50% more than the x-height of another. Sadly, while CSS lets us specify a stack of fonts to try, it doesn't yet let us specify a different size to go wit…
BTW: Different fonts do work better at different sizes, and the article specifically mentions that fact.