
16 pixels For Body Copy. Anything Less Is A Costly Mistake - m1nes
http://www.smashingmagazine.com/2011/10/07/16-pixels-body-copy-anything-less-costly-mistake/
======
Chris_Newton
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 with each one so we can achieve a similar optical result. (CSS3's
font-size-adjust might be intended to help here, but seems overcomplicated and
underpowered to me.)

For another thing, these days pixel densities can vary by at least a factor of
3 between devices. The latest iThings sometimes do better than the 300dpi that
used to the be benchmark for a laser printer. For a classic CRT or cheap and
cheerful TFT, something more like 96dpi is common. At least you can detect
this to some extent in CSS, because the new devices with very high densities
also tend to support media queries so you can present larger text (in pixel
terms) and higher resolution graphics accordingly.

If we're going to improve the way we present text (and graphics) on the web
for people whose vision isn't perfect, it's going to take a much more flexible
styling system for the web and probably a lot more real world experience of
what works and what doesn't as well. As much as I respect people taking a
stand on behalf of those who can't see as well as some, I'm not sure
advocating a fairly arbitrary 16px guideline is helping.

~~~
blahedo
> _For another thing, these days pixel densities can vary by at least a factor
> of 3 between devices._

It pains me to point this out, but the solution to this particular problem is
that CSS has redefined what "pixel" means, or rather, they've made "px" stand
for something slightly different. Specifically, the "px" specifier now is a
scaled length unit, and corresponds to whatever length subtends the same arc
in a user's field-of-view as would a single pixel on a typical desktop display
at about two feet away. So technically, in order to know how many pixels a px
is, you need to know the resolution of the display, the size of the display,
and the distance from it that the user will be sitting.

(Argh)

~~~
Chris_Newton
Yes, CSS has an unhelpful definition of pixels, which AFAICS is almost
universally ignored. No doubt it was well-intentioned, but in the real world,
pixels have fixed sizes and display devices do not have infinite resolutions.
The difference between professional quality web design and an amateurish mess
can be as simple as paying attention to the real pixel grid that your
beautiful vector icon/font/whatever will be drawn on and
shifting/hinting/whatever accordingly.

Given that CSS also recognises length units such as pt, which make far more
sense if you really want to specify a physical size for something like a font,
distorting the meaning of "pixel" doesn't seem very useful. It's a little like
idealised fluid layouts, which quickly gave way to the practical benefits of
more controlled layouts and more recently to responsive designs that are
specifically tailored to the strengths and weaknesses of different browsing
environments. Good design often requires an element of precision, which you
simply can't specify if browsers keep moving the goalposts.

~~~
bzbarsky
> which AFAICS is almost universally ignored.

Safari on iPhone uses that definition (that's the whole "resolution doubling"
thing, in a nutshell).

Gecko uses that definition, including on mobile devices.

In fact, that definition is almost universally _used_ in cases where it
matters (i.e. high-dpi displays).

> Given that CSS also recognises length units such as pt

Which are nowadays defined in terms of CSS px, because otherwise sites break.
So 1pt == 1.3333px in CSS in most modern browsers.

~~~
Chris_Newton
> Safari on iPhone uses that definition (that's the whole "resolution
> doubling" thing, in a nutshell).

That's my point, though: no-one is really implementing CSS-px. What they're
doing is implementing approximations, like doubling everything up on a high-
dpi screen because the pixel pitch is roughly twice what you get on a typical
desktop monitor, which is close enough to be workable.

If browsers implemented CSS-px as specified, then on all the monitors in front
of me, the text on most pages I have open right now would look the same size
in Firefox, and not noticeably smaller on some monitors than others. Also, all
those beautiful, crisp _n_ -pixel borders on mobile-friendly sites would look
terrible (because they would be rendered with different degrees of fuzziness
due to the antialiasing on different mobile devices) and everyone's
photographs on Facebook would be blurry. Of course, that's a silly idea, and
no browser actually does it (other than when zooming).

Most of the major mobile browsers (possibly all by now) support restricting
the viewport and zoom so you can match your site to real, physical screen
properties instead of whatever virtual viewport size they pretend to have by
default. IME, a fairly high proportion of mobile-specific and responsive pages
now start by switching this on. No-one's going to change this functionality
any time soon, because vast numbers of mobile-optimised sites would
immediately break. Fortunately, that means we can go into real-physical-
dimensions modes and then use media queries to select an appropriate layout
(including text sizes) for smaller, high-dpi devices as part of a design,
without sacrificing precision in cases where the time and money is there to
work on the fine details for best results on that kind of device.

~~~
bzbarsky
> What they're doing is implementing approximations

The definition of CSS-px (for low-res devices, which includes all the mobile
stuff so far; high-res in this context is print) is:

    
    
      it is recommended that the pixel unit refer to the whole
      number of device pixels that best approximates the
      reference pixel
    

and the reference pixel is defined as:

    
    
      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.
    

See <http://www.w3.org/TR/CSS2/syndata.html#length-units>

So the whole point is to approximate the reference pixel by doubling your
device pixels (or tripling, or whatever).

I think you may be thinking of a different definition of CSS pixel that used
to exist a number of years ago (when "px" and reference pixels were the same
thing). That definition is no longer in the spec, and hasn't been in a while.
And that's precisely because of the antialiasing issues you mention.

~~~
Chris_Newton
Yes, the official W3C recommendation changed to CSS2.1 earlier this year, and
they did effectively redefine a CSS pixel at that stage. I'm not sure this did
more than swap one problem for another, though: as I read the (current)
wording, we shouldn't get fractional physical pixels any more and basic
arithmetic still works on pixel lengths, but now you can only scale up by a
factor of 2x, 3x, etc.

Given that the point we're debating here is the merits of setting a minimum
16px body text size, that would mean the next alternative was 32 physical
pixels on a display of roughly 200dpi resolution. While that might be useful,
you could still find that depending on the physical properties of your
devices, 16px text needed to render at say 24 physical pixels to look the same
size to the reader.

When you've got that kind of uncertainty to work with, I stand by my earlier
comments that an arbitrary 16px size without reference to either the specific
font or the physical properties of the device isn't a particularly useful
guideline. The design considerations for devices with such different physical
properties are too complicated to dismiss with a simple scale factor.

~~~
bzbarsky
Yeah, I agree that saying "use 16px font-size" without mentioning at least the
font family is completely useless.

------
Corrado
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 the font problem on subsequent visits.

~~~
leif
I'm 23 and I zoom in on plenty of sites.

~~~
aaronblohowiak
Get glasses!

~~~
leif
I have contacts that correct my vision to just about 20/20. Maybe I just have
higher than average DPI screens, but most sites (hn included especially) are
simply too small for me to sit at a comfortable distance and read comfortably.
I don't know where the rest of you eagles come from.

~~~
umjames
Agreed. Eyesight doesn't get better as you get older, it only gets worse. Why
strain your eyes trying not to "look old"? Your eyes should be relaxed when
you read.

------
SimonPStevens
On the surface the statements seems to make sense and the arguments are well
put across, but unless someone actually A/B tests it and proves that it makes
a difference to readership, or conversions (or whatever your goal is) then
it's currently just unsubstantiated theory.

~~~
patio11
5 points of karma says null result, but I'll have at least one anecdotal data
point for you in a few days.

~~~
SimonPStevens
Awesome. I'd be interested to see results. Email me if you get any data your
happy to share (details in my profile).

------
mikeleeorg
I find myself zooming nearly 80% of the sites I visit now, including Google
Docs. And I'm always a little bummed that Google's Spreadsheets give me this
warning:

"Your browser's current zoom setting is not fully supported. Please reset to
default zoom."

~~~
_delirium
Same here; since Chrome remembers your zoom settings per-domain, I sometimes
forget which sites I'm viewing zoomed versus in the default sizes, so when I
use a fresh browser or a different computer it comes as a surprise how
unreadable some of my frequently visited sites are (HN being one).

------
frankiejr
Working closely with designers and observing client requests over the past
decade or so, I've seen another pattern that also leads to the "small type"
problem: Client requests to get as much above the fold as possible. Granted,
the majority of the projects I've worked on in the past four or five years
have been very large organizations. When client committees make decisions,
it's much harder to teach them or even steer them in the right direction.

I'm seeing a growing number of comments here that read like "I can..." or "I
prefer..." The article clearly states this is a decision arrived at by
considering the end-user. It's all relative; all sites don't need to be that
way. You should be user-testing every project with your target market anyways,
and if you were and it was a problem you'd hear about it. I know I have, many
times.

Another great article on this subject is one "Relative Readability" by Wilson
Miner:

[http://www.wilsonminer.com/posts/2008/oct/20/relative-
readab...](http://www.wilsonminer.com/posts/2008/oct/20/relative-readability/)

~~~
mkr-hn
I think if you need to shrink things to fit it above the fold, it's time to
reconsider what you're putting there. I've never had trouble fitting
everything important comfortably above the fold, but I'm only working with my
own projects.

~~~
frankiejr
I absolutely agree. I also agree with the theory that you should teach, coach
and influence your clients with what your team has learned over the course of
your career.

The clients I mentioned are organizations with thousands of employees, and (at
the very least) dozens of very large departments. Their decisions are always
made by committees made up by representatives from these departments, and they
all want equal or more attention. You just can't teach clients like that and
stay within a tasteful budget. All you can do is creatively mitigate.

It's not all bad, though. It's just another puzzle to solve, only this time
the solution isn't in code.

(Sorry for straying so far off topic from the original article)

------
danmaz74
I'm 37 and I zoom almost every website I use - I also like to be distant
enough from the screen. I also very often use ctrl+A to have white text on
blue background (I know, most designers will hate me at this point - but keep
in mind that I usually sit in front of a screen 12 hours a day, 10 hours a day
on weekends...).

Last thing, I just _hate_ sites that use facebook comments - eg techcrunch -
because fonts don't scale there. As a matter of fact, I never read comments on
those websites.

~~~
bilban
Seriously consider an alternative. Tweak your browser to your liking. You can
always break out into a different browser, if you want to see the site the way
the author intended.

I use my own style sheet with opera, and customise firefox flipping between
the two, and occasionally breaking out into chrome.

I also find the terminal more readable than the browser, so have made my
browser look like the terminal - I even use a monospaced font. Because that is
what I'm comfortable with.

W3m and Elinks are actually really nice to use, readability wise.

Funny to read your highlight method, I use that when away from my computer.

~~~
danmaz74
Thanks for the suggestion, but I prefer to give the designers at least a
chance to impress me ;)

------
xyzzyz
I'm all for it. I zoom 70% of websites I visit, and I'm only 20 and don't have
particularly bad sight -- I'm able to read unzoomed websites, but it's too
wearisome.

------
guard-of-terra
Most web sites break down when fonts are upscaled. Sad but true. I configured
my mother's firefox to do that, it works, but most of the web doesn't look
good.

Which is sad. My eyes aren't very good too and they prefer bigger fonts. In
fact, most people have vision problems those days.

~~~
ivank
You can use NoSquint to upscale entire pages globally (much like Firefox's
built-in per-site zoom). It doesn't mess up layout like font-only scaling,
though it can do that too, if you want.

~~~
kellishaver
The problem with scaling the entire layout is that you end up with a lot of
horizontal scrolling, in a lot of cases, which is more annoying than a semi-
broken layout.

Of course, that all depends on how much you need to zoom in. For me, that's
about 6x.

------
clintavo
"At age 40, only half the light gets through to the retina as it did at age
20."

Well, at least now I know why I'm constantly having to turn the fucking lights
on when reading something on paper - that seemed like a new development. I'm
42.

~~~
biot
Is there a reference for this? The link on the site only goes to another site
that makes the claim. I'm very close to 40 and haven't noticed this... though
perhaps the brain compensates for it.

~~~
clintavo
I didn't verify it. I can tell you anecdotally that when I was 39.9 I didn't
notice any issues, the change started very soon after 40. Mainly just the
typical "my arms are too short" syndrome, I can still see like an eagle
further than 2 feet in front of me. However, lately I've noticed in low light
I have a harder time than I used to.

------
bilban
Interestingly the browser defaults have changed over time.

When we used to use 640x480 and 800x600 monitors, the browser defaults - for
something like a h1 took up most of the screen. That's half the reason
designers (before the advent of CSS) didn't use semantic markup. They'd just
use bold to mark up a heading at the body text size. We had pixel images used
for text in navigation at 10px. With something like 12px for body text (and
tables for layouts.)

There were also radical inconsistencies between the browsers, with their text
size rendering defaults.

I'm also pretty sure that the 16px default font size was a late edition.
Either way a bit of history would help the article.

Plus, as many have pointed out, the fact that 16px appears differently
depending on screen resolution, distance from the display is an important
point that should have been stated.

The article may have been better arguing that making a website more readable
is better for users and sustained readership.

------
blahedo
I think I need to put together a form email, or possibly a webpage to link to,
to send to web designers who pontificate about web design and reaching your
audience---on a webpage that _doesn't fit_ in my window AND has _disabled my
scrollbar_. Meaning I literally cannot read it without sending it off to
Readability or otherwise adjusting my browsing setup.

This fault is honestly an order of magnitude more common among webpages that
are specifically discussing user-oriented design. Argh.

~~~
bilban
Opera has a nice fit to width toggle.

------
Simon_M
Am I missing something? The physical size of a 16px font will surely vary
based on resolution and screen size.

So claims such as '16px is the same as most books' are clearly nonsense.

~~~
dextorious
He means "for the most common monitor DPIs", duh.

The problem is: due to the need to mix and align with bitmap graphics, web
design is most convenient when specifying font sizes in pixels (except for
simple pages, like HN and such, fluid designs cannot cover most cases in a
mainstream enough fashion).

So, given that, he had to mention a specific _pixel_ setting. But he took into
account most common DPIs. For the majority of users they do not vary that
much, around 100-120 dpi.

(Btw, have you read the article? He is aware of that, and he even gives
examples of 16px in different DPI screens).

~~~
Thrymr
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.

~~~
ugh
What’s the alternative? I know of no PPI-aware way of specifying font size.

~~~
Thrymr
Display PostScript - circa 1987 (thanks, Steve Jobs).

I know there isn't a good current alternative in the web world, but shouldn't
it be a goal to not have to specify pixels anymore? Obviously mobile browsers
already largely ignore/change pixel font sizes.

~~~
ugh
It’s a valuable goal but just that. A goal. It’s necessary to be pragmatic in
the meantime. No point in dreaming.

(If you didn’t notice, we are talking about the web here.)

~~~
Thrymr
I understand the difference between pragmatism and dreaming.

In the short term, that pragmatism should include web devs not trying to lay
everything out pixel-perfect so it breaks if the user hits "zoom". The
diversity of screen sizes and browsers and DPIs is greater than it has ever
been, and will only increase.

~~~
Chris_Newton
> The diversity of screen sizes and browsers and DPIs is greater than it has
> ever been, and will only increase.

That may be true, but beyond a certain point, it doesn't matter.

In terms of physical size, it makes sense to have a single-column layout for
small devices, where layout techniques like using multiple columns are never
going to be very useful no matter how high the resolution gets. You might
prioritise some content more highly and reduce or eliminate less valuable
material to go with this. It also makes sense to allow for layouts that do
have wider areas and/or multiple columns if the content can benefit and the
display medium can support it. I doubt anyone is going to want to render most
web pages with dozens of columns any time soon, though, no matter what
physical size a screen might reach. Most content isn't going to benefit from
that, because the human eye and brain can only take in so much at once anyway.
So the big question here is how many discrete layouts are useful in practice,
with a whole load of secondary questions about the balance between showing
more content at once vs. allowing user interaction to navigate content in
different ways.

In terms of resolution, the consideration is different, but there is still a
general case. At low resolutions, it is worth having specific, pixel-perfect
designs. At somewhat higher resolutions, it is worth having different pixel-
perfect designs, to give sharper results at a similar physical size. Sometimes
it is best if pixel-based designs don't try to copy all the detail of the
"true" designs as they get smaller, but present simpler, cleaner versions of
the same basic idea instead. At some point, your resolution gets high enough
that scaling vectors representing the "true" designs by default and using
techniques like antialiasing and font hinting becomes a viable alternative.
Somewhere beyond that, vectors alone would be sufficient, as the eye isn't
powerful enough to see any more detail anyway. The big questions are where on
this scale you change from one pixel-perfect format to another, and how many
such formats you produce before you switch to using scalable vectors.

In the real world, of course, these two ideas interact at times, and there is
a cost/benefit trade-off as well. Perhaps you would prefer to have three sizes
of pixel-perfect versions of all your custom graphics plus a vector, but in
reality you might have only one or two and accept that content will appear at
significantly different physical sizes on different devices. Perhaps you would
like to have a responsive design with four different layouts, but in reality a
mobile-friendly version and a regular site will do. You'll still be able to
cater well to many different devices with only a small number of combinations
if they are well thought-out, though.

------
nickknw
I generally agree with his argument, but I don't appreciate the way some of
the examples were framed. They were a bit misleading.

Specifically the paragraph where he inserts smaller fonts into the middle of
his paragraph, hoping to shock you with the difference in size.

Here is a screenshot of that paragraph with the body text actually set to
16px: <http://i.imgur.com/mcdNI.png>

10px is still tiny, but 14px doesn't appear nearly so 'weaksauce' any more.

As I said, I DO like larger font sizes and think he has a good point. But
misleading comparisons like this bug me and I felt I had to set it straight.

------
FilterJoe
If you ask a variety of people how readable they find a typical web site,
you'll receive almost uniform responses that many (or most) pages are
difficult to read. Font size is a factor but there are many more factors,
which I outline here:

[http://www.filterjoe.com/2009/03/25/filters-for-reading-
on-t...](http://www.filterjoe.com/2009/03/25/filters-for-reading-on-the-web/)

and suggest solutions for web design here:

<http://www.filterjoe.com/2009/03/23/site-design-for-reading/>

A main theme of my site is how to read without distraction on the web. As has
come up a number of times on Hacker News, the tools readable and readability
are a terrific way to reformat web pages in order to make them more readable:

[http://www.filterjoe.com/2011/04/11/web-page-reformatting-
se...](http://www.filterjoe.com/2011/04/11/web-page-reformatting-services-
readable-and-readability/)

One last trick is to arrange a high pixel density monitor vertically and place
it far away from your eyes. You can calculate the distance needed to attain
the equivalent of a retina display:

[http://www.filterjoe.com/2011/02/26/the-best-monitor-
setup-t...](http://www.filterjoe.com/2011/02/26/the-best-monitor-setup-to-
reduce-eye-fatigue-and-distraction/)

Whether this makes a difference in terms of readership, conversions, etc. I
have no idea. But the proliferation of tools in the past few years to help
people read web content suggests that a lot of web users are struggling with
reading web pages.

------
ori_b
Or, better yet, don't set the font sizes or font faces on your web site. I
picked defaults that work for me. Don't override them.

------
inflatablenerd
The biggest failing I see this is argument is hierarchy. Sure, 16 point
Georgia looks sexy as hell. If you have a text heavy website with little
navigation, I'd definately recommend it. But in real world design situations,
it's a mess. Even the Information Architects site looks flat. There's no easy
way to guide the eyes because everything is ultra readable. There's no
structure. It's an idealistic shortcut to readability.

For me, the most pleasurable reading experience I can think of is Instapaper
on an iPad. What's the default size on that? I could be wrong, but I doubt
it's anything larger than 14-16.

Besides, is it really a "costly mistake"? Is Facebook is failure because the
text is small? Is Apple's website is design disaster? Both sites (and many
more) feature a mix of large and small text with modest sized body. They're
navigation is thought out and structured.

The 16 pixels argument encourages the opposite of that.

~~~
ricardobeat
> _Information Architects site looks flat_

Incidentally, that makes it perfect for, you know, _reading_. Are your books
too flat?

While we're at it (and I still find their layout beautiful): "Good branding is
not pretty; it’s bold, sweet and simple" -
[http://www.informationarchitects.jp/en/ugly-ugly-coca-
cola-m...](http://www.informationarchitects.jp/en/ugly-ugly-coca-cola-makes-
nice/)

------
parfe
I installed the <https://addons.mozilla.org/en-US/firefox/addon/stylish/>
addon for firefox and have set news.yc to use the following stylesheet:

@namespace url(<http://www.w3.org/1999/xhtml>);

@-moz-document domain("news.ycombinator.com") {

    
    
        .title{
            font-size: 16px !important;
            padding: 0.5em !important;
        }
    
        .subtext{
             font-size: .8em !important;
             padding-left: 0.5em !important;
        }
    
        .comment {
             font-size: 16px !important;
        }
    
        .comhead{
            font-size: 1em !important;
        }
    
        .pagetop{
            font-size: 16px !important;
        }
    

}

I mixed px and em as I tried different settings, but just stopped when I found
something I liked.

~~~
bilban
This is a great one site solution, but it get's a bit tedious personalising
each and every site individually.

------
sunkencity
Interesting, but at that size of font used on that webpage I read at half
speed and I'm 37. For the hacker news site I can read a full line in 3 focus
movements. It's much easier to switch focus to the right than to find the next
row in text. Not convinced but YMMV.

~~~
pietro
For what it's wortjh, I used to be able to read small fonts comfortably when I
was 37. Not that I'm 44, I can't. I read Hacker News with Ctrl-+, and I'm
happy that Chrome remembers my zoom setting between visits, or I probably
wouldn't have visited very often.

~~~
mikeleeorg
I love that feature from Chrome too. I zoom about 80% of the sites I visit
now, and I love how Chrome remembers that preference for some of my most
frequented sites.

------
wushupork
I have been reading HN zoomed for quite a while now. I also code with larger
than the default fonts because it's less wear on my eyes and I'm not 40 yet. I
agree with what's being said but it would be helpful to show some study or
research or A/B testing.

------
ctuite
Some interesting facts in the article, however, saying a font is hard to read
because it's too small is a bit of a loose statement. Font family, color,
line-height and width (anything over 500px wide is a strain) all contribute to
the readability of text. So a pink font at 16px stretching the full width of
the screen (let's say 1400px) with default line-height might be easier to read
if it were 13px, dark grey, 450px wide with 20px line-height.

The article doesn't target a specific type of site. Article sites or news
sites rely on readability far more than startups. The article seems to suggest
that you NEED copy to guide users. This statement is incorrect. You can guide
users with whitespace, color, images, buttons, hover states etc.

If you have a startup landing page with lots of copy on it, regardless of
font-size...you've already failed.

------
mise
Does this equate to setting the base font size to 1em in CSS?

~~~
notjoeflynn
Yes, unless (if I'm not mistaken) the user has changed their default font
size.

------
km3k
Maybe I'm just different, but I like smaller font sizes. It makes it easier to
take in more text quicker and do it with less scrolling. I am 26 though. I'll
probably change that opinion when I'm 40. I think having the browser zoomed
out one level looks best to me on some sites.

~~~
prof_hobart
I'm 41 and I've not changed my mind yet. But I guess I've been lucky with my
eyesight so far.

~~~
slantyyz
I'm also 41, and I've recently had to take my glasses (for near-sightedness)
off for anything at reading distance.

But I still prefer the smallest fonts on my e-reader, and relatively small
fonts on my iPad and laptop computer.

While I don't mind larger fonts at 16px, I'm not willing to make that tradeoff
for improved readability vs. not having to scroll as much.

------
lawlorg
He gives some interesting data points, but ultimately fails to prove the
headline that "anything less is a costly mistake". In order to do that, he'd
have to take a sample of websites and show a correlation between copy size and
profitability.

------
michaeledge
Personally I'm a fan of bigger font sizes. Interesting though that Facebook
actually reduced their body copy down to 11px, and apparently they are doing
pretty well ;)

~~~
tomkinstinch
Does the median Facebook user have younger eyes than the rest of the web?

A counterpoint: NYTimes.com sets their article paragraph font size at 1.5em
(with a roughly equal line height).

~~~
lukeschlather
I'm 24 and I still even zoom NYT (though that may be just so that the article
fills my view.)

------
YeeHaw
I thought the article was impossible to read at 16 px - just not enough
density - too few words per line and too few lines per screen to read
comfortably. I'm 46.

~~~
mruser
Seconded, and I'm 26.

------
wladimir
Why "16 pixels"? Wouldn't scaling fonts based in cm/inch make more sense to be
resolution independent, especially important on mobile devices?

~~~
jimworm
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.

~~~
wladimir
Yes it's sad how in software development, the most straightforward ways to do
something (just specify cm) are usually broken. It's always exception built on
exception, different per platform, different per browser.

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'.

------
asto
I agree! Have been doing this on my sites for a while now. Another thing to
note is that when the font size is small, the number of words that fit into
one line increases. It's easier to read lines with less words (which is why
newspapers use columns of short width) and using larger fonts in the same
horizontal space achieves that.

------
aquarin
Just checked. I read HN zoomed twice.

------
xentronium
I zoom most of the sites I read mostly due to the number of characters per
line. When it is greater than 120-140, I can't focus on the line I'm reading.

And that is by the way another reason I love fixed size layouts: you can zoom
them however you like.

~~~
bilban
Re: fixed size layouts, I don't get this. You might be able to zoom these on
the iphone, and scroll around the page easily with your finger. But I find
fixed sized layouts can be a pain. Preferring fluid. Because at least I can
resize the browser window - to get a good line length etc. It's annoying if
you do zoom in and the text flows out the side of the browser. I don't enjoy
side scrolling.

------
jimktrains2
Why px and not pt? I thought fonts are traditionally done in pts.

------
sgdesign
Ironically, Smashing Magazine itself is not set in 12px…

~~~
mgrouchy
16px you mean?

~~~
webfuel
The rest of the site is 12px — only this article had a body copy size of 16px.

~~~
shabda
Yeah, that page is using a custom css.

See this for example, (at 12px)

[http://www.smashingmagazine.com/2011/10/05/smashing-
coffee-m...](http://www.smashingmagazine.com/2011/10/05/smashing-coffee-mug-
photo-contest/)

------
michaelchisari
I don't know how well it works for sites that are effectively applications,
but I wholeheartedly agree when it comes to blogs, articles, and essays.

------
rshm
I am not as old as 40, still. My wikipedia, forbes are all zoomed up. I
settled on 16/Serif at-least for personal sites and blog.

------
brandonkshepard
Do you think that we need to see changes in current social networks using
12-14 pixels for their body copy?

------
grannyg00se
It's just as easy to hit [ CTRL + ] as it is to hit backspace. If you are
worried about your users' ability or knowledge, then you can simply include a
link that says "adjust text size up / down" and let them click that to get the
desired effect. Browsers allow users to customize the font for a reason. It's
impossible to claim a default size that everyone is going to like.

~~~
john_flintstone
Just as most users don't know about Ctrl+, most users wouldn't know what
"adjust text size up / down" meant either. My 60 year old father uses the
Internet a lot, but he wouldn't be able to identify your use of the word
'text' with the words he reads on a website. Up or down to him would mean
scrolling.

~~~
grannyg00se
That's interesting. How else would one describe the words that you read on a
website? It's text. Or copy. But text is probably more universally understood.

If he were reading a magazine and you said "do you find the text to be too
small", you think he might turn to you and say "what do you mean by text, I'm
reading a magazine here, there is no text."

------
thenduks
Oh please yes. _cough_ Posterous

------
davidandgoliath
Just confirmed I use hacker news @ 298% zoom. Impressive :) Wondering what you
all utilize?

~~~
tuhin
Or you could use this tool I wrote:
[https://chrome.google.com/webstore/detail/ofjfdfaleomlfanfeh...](https://chrome.google.com/webstore/detail/ofjfdfaleomlfanfehgblppafkijjhmi)

------
bostonvaulter2
Is there a way to use javascript to detect how far zoomed in most of your
readers are?

------
subbu
This is what I always think whenever I visit John Gruber's blog
(daringfireball.net).

------
mise
Does anyone use this rule for setting their text editor's text size for
programming?

------
njharman
pixels? Pixels are not a standard size, they vary across screens/devices. 16
pixels is anything from too tiny to read to giant.

------
hugh3
Too large; didn't read

------
FJim
tb;dr

------
gcb
stopped reading when he started comparing pixel measurements with printed
books.

------
perlgeek
Did anybody else have trouble understanding what "body copy" means? I know
such things as "body font size" or so...

~~~
ugh
Body copy is a commonly used term.

~~~
perlgeek
Thanks. Seems to be common in typography, not so common in the HTML world.
Guess where I'm coming from...

~~~
newsoundwave
It's been a common phrase to describe generated textual content on an HTML
page for a _while_ now.

