11 or 12px ?

[Beauregard T. Shagnasty]

Quoth the raven named Jim Royal:

Actually, no. I'd be catering to your personal taste, rather than
the needs of the majority of my valuable visitors.

Ah, alright...

I consider setting default size (100%) to be a usability problem.
In my experience, most people are not comfortable reading
default-sized text (which is typically 16px/96ppi). Most people are
also unfamiliar with the font scaling controls in their browsers,
and thus are unable to fix things to their liking.

After looking at the site in your sig, we now know why you think 100%
is too large. You specify fonts that are larger than most, so you have
to scale them down.

http://jimroyal.com/includes/jimroyal_basic.css
<quote>
body {
background-color:#2d3366;
font-family:"Lucida Grande","Lucida Sans nicode",
Verdana,Lucida,Arial,Helvetica,sans-serif;
color:#dddddd;
font-size:0.9em;
}
</quote>

Your visitor who does not have any of those Windows fonts ends up with
(maybe) Arial or Helvetica - fairly common - or plain sans-serif.
These are smaller than all the Lucidas and Verdana. Why sure, you need
0.9em.

A far better solution is to size the font intelligently using
percentages or ems so that the chosen size suits the content of a
given page. People who need large type to read comfortably can
still resize it, and they are also more likely to know about the
font scaling controls, as they have a personal reason to look into
it.

If you'd read my post, you'd have noticed that I specifically
advised against using pixel-based font sizes, and recommended using
percentages or ems.

I read your post. I am in agreement with percentage or ems, as I said
in my posts.

We're arguing in circles here. I advocate 100% and only sans-serif.
You advocate 0.9em (90%) and large fonts. It works out to be the same.

Except those who do not have your large fonts need to resize...

 

[Beauregard T. Shagnasty]

Quoth the raven named Toby A Inkster:

It's also horribly mixed up: is it serif or sans-serif?

Open up your word processor, switch to Verdana, put the font up big
and type in capitals: JUPITER.

Look at the I and J: they have serifs! Compare that with other
sans-serif fonts.

http://www.goddamn.co.uk/tobyink/scratch/verdana-is-strange

<lol> Hey, I was just looking at Jim's fonts in the font viewer, and
never noticed that, now or before.

Of all his Lucida fonts, I only have the Lucida Sans Unicode, which
appears to be about twice as *fat* as Arial, at 12pt on my monitor.

 

[Michael Wilcox]

Vast personal experience. Trust me on this.

I'd rather know. What vast personal experience of other people's opinions
has led you to believe that the default size for each browser in each font
for each resolution is too big for that person?

 

[Michael Wilcox]

The default medium size of 16 pixels is too large for
comfortable reading by most people.

So IE's default supercedes all?

If I specify no font sizes, letting the browser settings handle it, I
am actually creating a usability problem for the vast majority who do
not know how to resize their default font.

Are you kidding? Overriding the user's preferences to impose your own
*fixes* usability problems? You know, there are people (probably more than
you think), that have their own preferences that you're just overriding.

 

[Rafal 'Raf256' Maj]

(e-mail address removed)

sans-serif, available *every*where.

How do I use it?

font-family: sans-serif,arial,courier,times,verdana;
uses Arial (not sans serif)


font-family: serif,arial,courier,times,verdana;
uses serif... but sans-serif is much better for screen IMHO

 

[Rafal 'Raf256' Maj]

(e-mail address removed)

font-family: sans-serif,arial,courier,times,verdana;

problem solved - sansserif

 

[Beauregard T. Shagnasty]

Quoth the raven named Rafal 'Raf256' Maj:

(e-mail address removed)

How do I use it?

font-family: sans-serif,arial,courier,times,verdana;
uses Arial (not sans serif)

No, just specify: body { font-family: sans-serif; }

The reason you see Arial in /your/ browser is because it is /your/
default font, for the browser's sans-serif setting.

font-family: serif,arial,courier,times,verdana;
uses serif...

The "serif" in this line is the .. generic catch-all. If you put it
first, that is what the browser will use. You should put the generic
last (if you are going to assign other real fonts).

In your sample, you've mixed
serif fonts (the generic, Times)
sans-serif fonts (Arial, Verdana)
and
proportional fonts (Arial, Times, Verdana)
monospace fonts (Courier)
Not a good idea.

but sans-serif is much better for screen IMHO

Agreed. Numerous articles have been published stating this. Can't find
a link at the moment.

 

[Jim Royal]

You don't make something easier for people who don't know what they're
doing at the expense of people who do.

Like, for example, ABS on cars?

Such tradeoffs are part of being a designer.

Provide some instructions for setting font size in various browsers
if you like, but don't stop me from getting the font size I chose.

I'm not preventing you from sizing the text on my site as you choose.
Were I using pixel-based fonts, and you using IE/Win, then that's what
I'd be doing.

 

[Jim Royal]

I'd rather know. What vast personal experience of other people's opinions
has led you to believe that the default size for each browser in each font
for each resolution is too big for that person?

a) Dealing with every client I've ever had.

b) Learning for the experience of professionals. Zeldman discovered the
same thing is his last redesign. Check his blog.

c) Studies I'd read that indicate reading speed and comprehension goes
down when column widths are too short. Larger fonts means fewer words
per line. Conversely, reading speed does not decrease as quickly as
column widths get unreasonably long.

 

[Jim Royal]

Errr... no. That calculation was used to convert between points and
pixels. It has nothing to do with default browser font sizes.

Doesn't say that here:

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

 

[Jim Royal]

Are you kidding? Overriding the user's preferences to impose your own
*fixes* usability problems? You know, there are people (probably more than
you think), that have their own preferences that you're just overriding.

I agree in theory. But it doesn't work out well in practice.

 

[Jim Royal]

This is a kind of holy war. Neither the hard-core print-thinking
designers nor the new-world-hailing-coders will give in

Hey, I'm not a hard-core print guy. Given that specifying no font sizes
and specifying absolute font sizes are both unworkable solutions, I'm
just trying to be practical, and seek a middle ground.

You want hard core? I know a guy who insists on micro-adjusting the
font size of his <H1> tags on EVERY SINGLE PAGE on his site so that
each headlines fit the column widths perfectly, as they did in his
newspaper days...

 

[Jim Royal]

After looking at the site in your sig, we now know why you think 100%
is too large. You specify fonts that are larger than most, so you have
to scale them down.

Indeed. This is the point I am trying to make. As designers, we have
the responsibility to make intelligent choices on behalf of our users.
Adamantly refusing to specify font sizes is plaing roulette with your
page's readability.

Choice of font and font size depends on the content of the page. One
size does not fit all circumstances.

We're arguing in circles here. I advocate 100% and only sans-serif.
You advocate 0.9em (90%) and large fonts. It works out to be the same.

There are circumstance where 100% and only sans-serif is entirely
appropriate. There are circumstance where that choice is inappropriate.

 

[Steve Pugh]

Doesn't say that here:

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

Where on that page does it mention a "16 pixel default font size"?
96dpi is referenced as a baseline for pixel densities on desktop
displays, but that has nothing at all to do with the defualt font
size.

Steve

 

[Leif K-Brooks]

Indeed. This is the point I am trying to make. As designers, we have
the responsibility to make intelligent choices on behalf of our users.
Adamantly refusing to specify font sizes is plaing roulette with your
page's readability.

How so? If my choice of font size is bad, that's _my_ fault. You don't
stop me from making my own choices just because some people make bad ones.

Choice of font and font size depends on the content of the page. One
size does not fit all circumstances.

Agreed. Headings should be larger and copyrights smaller, but the main
content of a page should *always* be the font size I've chosen.

 

[Toby A Inkster]

Doesn't say that here:
<http://www.w3.org/TR/CSS21/syndata.html#length-units>

Yes it does. It suggests a mapping of 1/96 inches to a pixel. Thus 16px
is 16/96 inches (which cancels down to 1/6 of an inch).

Also we know that 12pt equals 1/6 of an inch too (by the definition of a
point as 1/72 inches).

Thus the page suggests a way of converting between points and pixels: 16px
is equivalent to 12pt.

 

[Duende]

While sitting in a puddle Jim Royal scribbled in the mud:

c) Studies I'd read that indicate reading speed and comprehension goes
down when column widths are too short. Larger fonts means fewer words
per line. Conversely, reading speed does not decrease as quickly as
column widths get unreasonably long.

Ane idea what an ideal column width is?

 

[Greg Schmidt]

Like, for example, ABS on cars?

Some people are trying to get ABS banned because of studies that show
that accident rates have actually increased because of them. Too many
people that suddenly think they can stop on a dime in any weather, just
because they have ABS.

Somebody pointed out, in one of the many other rehashings of this same
debate, that stating that most people don't know how to resize their
browser fonts, while simultaneously claiming that anyone who finds the
font too small can just change their settings to fix it, is rather
disingenuous. Not accusing you of this, Jim; I just thought it was a
very good point that deserved to be repeated.

 

[Toby A Inkster]

Ane idea what an ideal column width is?

Roughly 70 characters is usually considered most readable.

 

[Toby A Inkster]

Or better, a link explaining how the user can adjust the default font size
for their browser.

I've decided to do this for my site.

Here is a mock-up of the instructions:
http://www.goddamn.co.uk/tobyink/scratch/chtxtsz/instructions

Any ideas for improvement?

[Cross-posted, followups to a.h.critique]