Font Size units

**Andy Dingley** · Jan 23 '07, 12:35 PM

Re: Font Size units

Mark wrote:

Which is best practice and why?

Searching the newsgroup archives. This is a _very_ FAQ

Also, I generally specify a font size for the body only, and the rest of
the elements as percentages (eg h1 { font-size: 200%; }). Any suggestions?

That's fine -- you're "specifying font sizes" for all of them here. A
percentage is still a font size.

Best practice is to set the font size in either percentages or ems
(these are effectively the same) although using percentages avoids an
IE bug.

The only differences of best practice from your stated practice are
these:

* Always set the screen font sizes in relative units such as em or %
and never in pixels. If they ought to be different, that's the user's
choice and leave it with them. Only use absolute units (points or mm)
for printed output to a device with a clear physical mapping of sizes.
Even then it's unnecessary -- someone might _want_ a large text copy.

* Set the size of body text to 1em or 100% and DO NOT MESS WITH THIS as
it kills usability to do so. Generally setting it for <bodyis
easiest, but the important thing is that the "body text" of the main
content ends up as 1em, not necessarily <body>

* Don't go far below 1em, 0.8em is OK for "small" and maybe even
0.67em. Anything less is pretty much guaranteed to be unreadable.

* You _might_ set the default size to 80% or 70% for IE alone, as
there's a Windows bug that screws up the default size on high-res
screens with large fonts selected in the Windows desktop display. This
is a compromise though, because you are breaking the site for lo-res
Windows users. Life sucks, and IE sucks more than most.

**Beauregard T. Shagnasty** · Jan 23 '07, 03:05 PM

Re: Font Size units

Mark wrote:

Sorry if the question is a bit basic.

Asked often.

I generally express my font sizes in pixels, originally to handle the
Macintosh/Windows font size differences (though I believe that they
both now treat points the same way, at least within the browser
window).

Points are for printing. Neither points nor pixels are resizable by IE
users.

It has been suggested that one should use ems to allow browsers to
increase or decrease the text size. However, I have never had trouble
with pixels.

Please invite a person with impaired vision to use Internet Explorer,
then, and see what happens with your site when they attempt to increase
the font to a readable size, for them. (Hint: nothing happens.)

Which is best practice and why?
>
Also, I generally specify a font size for the body only, and the rest
of the elements as percentages (eg h1 { font-size: 200%; }). Any
suggestions?

http://k75s.home.att.net/fontsize.html

--
-bts
-Motorcycles defy gravity; cars just suck

**Mark** · Jan 24 '07, 12:25 PM

Re: Font Size units

Thanks Beauregard & Andy for your comments.

I'm still a bit fuzzy on these em things.

OK, so an em is the same as the point size of the font, or something
like that. That's still a relative font size.

What happens if I want a particular font size, while somebody else wants
a different font size, at least to start off with. We both want to use
the same font-family. So how do we express this in ems? I can't see how
I wouldn't start this with a size in pixels ... ?

Mark

**Harris Kosmidhs** · Jan 24 '07, 01:35 PM

Re: Font Size units

Mark wrote:

Thanks Beauregard & Andy for your comments.
>
I'm still a bit fuzzy on these em things.
>
OK, so an em is the same as the point size of the font, or something
like that. That's still a relative font size.
>
What happens if I want a particular font size, while somebody else wants
a different font size, at least to start off with. We both want to use
the same font-family. So how do we express this in ems? I can't see how
I wouldn't start this with a size in pixels ... ?
>
Mark

Somebody correct me if I'm wrong but 1em=<default font size of user's
browser>

Setting body font size as 1em is supposed to be a good thing, but for me
is way to big. And I find it frustrating to have a font: rule in every
css element. So usually I set
body{font-size:0.8em}

**p.lepin@ctncorp.com** · Jan 24 '07, 02:05 PM

Re: Font Size units

On Jan 24, 3:17 pm, Harris Kosmidhs
<hkosm...@remov e.me.softnet.tu c.grwrote:

Mark wrote:

I'm still a bit fuzzy on these em things.

>

OK, so an em is the same as the point size of the font,
or something like that. That's still a relative font
size.

>

What happens if I want a particular font size, while
somebody else wants a different font size, at least to
start off with. We both want to use the same
font-family. So how do we express this in ems? I can't
see how I wouldn't start this with a size in
pixels ... ?

>
Somebody correct me if I'm wrong but 1em=<default font
size of user's browser>
>
Setting body font size as 1em is supposed to be a good
thing, but for me is way to big. And I find it
frustrating to have a font: rule in every css element. So
usually I set body{font-size:0.8em}

Somebody correct me if I'm wrong but what you just said
seems to amount to (exaggerating somewhat): 'So the user
chose the default font size that he/she finds comfortable
to read, but *I* think it's way too big for them,--I'll
just make the font noticeably smaller, because, hey, I'm
tha duh-signer here; screw the stupid users and their
bloody eyes.'

My default font size is 18pt, and any site that thinks 8px
fonts look cool or something won't ever get more than one
hit from me.

I just hope you're not a professional web-developer. If you
are, I just hope someone either makes you see the light or
fires you real soon.

--
Pavel Lepin

**David Dorward** · Jan 24 '07, 02:15 PM

Re: Font Size units

>Somebody correct me if I'm

>wrong but 1em=<default font
>size of user's browser

Setting body font size as 1em is
supposed to be a good thing, but
for me is way to big.

So the font size in YOUR browser is too big for YOU. Why are you
changing the page and not the browser? I don't know any graphical
browser that doesn't have an option to let the user pick their font
size.

**Beauregard T. Shagnasty** · Jan 24 '07, 02:15 PM

Re: Font Size units

Harris Kosmidhs wrote:

Mark wrote:

>Thanks Beauregard & Andy for your comments.

You're welcome.

>I'm still a bit fuzzy on these em things.
>>
>OK, so an em is the same as the point size of the font, or something
>like that. That's still a relative font size.
>>
>What happens if I want a particular font size, while somebody else
>wants a different font size, at least to start off with. We both
>want to use the same font-family. So how do we express this in ems?
>I can't see how I wouldn't start this with a size in pixels ... ?

Pixels - in the most popular browser-like operating system component -
cannot be resized by any visitor who has vision problems. My page gave
you a sample. Did you try it with IE?

Somebody correct me if I'm wrong but 1em=<default font size of user's
browser>

1em (or 100%) is the user's preferred size.

Setting body font size as 1em is supposed to be a good thing, but for
me is way to big.

Then set your own browsers' defaults to something a bit smaller. Simple
as that.

And I find it frustrating to have a font: rule in
every css element. So usually I set body{font-size:0.8em}

You don't need to set font size for every element. I detailed a
rudimentary setting on my page.

http://k75s.home.att.net/fontsize.html

body { font-size: 100%; }
h1 { font-size: 175%; } /* Adjust heading sizes as appropriate */
h2 { font-size: 150%; }
h3 { font-size: 135%; }
h4 { font-size: 125%; }
..legalese { font-size: 85%; } /* Footers and the "fine print" */

Using percentages instead of em units solves a problem with IE, where if
the user changes from, say, "Smaller" to "Medium", the browser *doubles*
the displayed size.

--
-bts
-Motorcycles defy gravity; cars just suck

**Harris Kosmidhs** · Jan 24 '07, 02:45 PM

Re: Font Size units

p.lepin@ctncorp .com wrote:

>Setting body font size as 1em is supposed to be a good
>thing, but for me is way to big. And I find it
>frustrating to have a font: rule in every css element. So
>usually I set body{font-size:0.8em}

>
Somebody correct me if I'm wrong but what you just said
seems to amount to (exaggerating somewhat): 'So the user
chose the default font size that he/she finds comfortable
to read, but *I* think it's way too big for them,--I'll
just make the font noticeably smaller, because, hey, I'm
tha duh-signer here; screw the stupid users and their
bloody eyes.'
>
My default font size is 18pt, and any site that thinks 8px
fonts look cool or something won't ever get more than one
hit from me.
>
I just hope you're not a professional web-developer. If you
are, I just hope someone either makes you see the light or
fires you real soon.
>

Why is everybody so ironic in this newsgroup?

And why everybody thinks that users do setup their programs they way
they want it to act? Most of the people I know don't even know where the
Settings... menu is. Yeah! Too bad, but that's the way it is...sorry...

Even I don't change the default values just to see what others see.

I stopped using px so that the user can increase/decrease the fonts, but
default font size (*I emphasize again* : the default px size the
browser has after installation) is too big.

PS: To avoid the ironic comments: No I don't think users are idiots.
They just *DON'T* care (the vast majority) learning how to customize
their computer from hardware to software.

**Andy Dingley** · Jan 24 '07, 02:55 PM

Re: Font Size units

On 24 Jan, 12:19, Mark <m...@comparity .not.example.ne twrote:

OK, so an em is the same as the point size of the font, or something
like that. That's still a relative font size.

Something like the opposite of that!

The user's browser has a concept of "default size". This is based on a
complex cascade of screen resolution, monitor physical size, operating
system, user's OS desktop setting for "Larger fonts please, I bought
this snazzy new video card and now everything is tiny". Then you have
the browser, which has the browser vendor's idea of default sizes,
together with a clueful user's customised stylesheet. If you're really
unlucky you work for <foo>Bank where the admins push a badly-done one
of these onto every users' desktop and force them to use it !

On the whole though, an ideal "1em" is always the perfect size for
large blocks
of readable text and we assume that if it isn't, the user will fix
it for themselves.
(Print this out and frame it)

There's still an unworkable-around IE bug on big-res displays with
small screens where this is on the big side. Worse then that, you don't
even know how much in error IE is. I also make it a rule to never break
a site for compliant web browsers just to work with IE, so I use an IE
conditional comment to get round this, the only time that I do.

If 1em is "perfectabl y readable" than 2/3rd of this is the lower limit
before unreadability.

% and em are much the same on font-size. Use % if you're happier that
way.

Points are more like mm. They're an absolute unit, just one based on
the width of Gutenberg's thumb or something. It's just _wrong_ to use
them on screen, because screens of text are considered to care more
about user-friendliness and user-selectable defaults than they are
about absolute sizes. Maybe, if you're lucky, then your system is
configured so than an "inch" of absolute CSS units actually measures
that on the glass. If you are, you're a minority. If you are, then you
probably don't want have to adjust this careful adjustment just so that
you can make things readable.

Pixels have the disadvantges of everything, with only the advantage of
being how images are sized (unless you descend into scaling them).
They're handy for setting widths of screen elements that need to play
well with images, but otherwise avoid them. Even for vertical heights,
you're usually better leaving these unspecified and letting the browser
flow content into them than you are trying to control them around image
sizes.

What happens if I want a particular font size, while somebody else wants
a different font size, at least to start off with.

They should win. Either that or you should offer to go round and read
it for them. You just don't know what a good size is, in advance of
slapping it onto their screen and having them stare at it. This is why
Harris' approach is so wrong, it's forcing your choices onto the wrong
person.

**Andy Dingley** · Jan 24 '07, 02:55 PM

Re: Font Size units

On 24 Jan, 13:17, Harris Kosmidhs <hkosm...@remov e.me.softnet.tu c.gr>
wrote:

Setting body font size as 1em is supposed to be a good thing, but for me
is way to big. And I find it frustrating to have a font: rule in every
css element. So usually I set
body{font-size:0.8em}

Do you use IE?
Do you have a high-resolution screen with "Large Fonts" selected under
desktop Display|Propert ies ?

**Jukka K. Korpela** · Jan 24 '07, 03:15 PM

Re: Font Size units

Scripsit Beauregard T. Shagnasty:

Pixels - in the most popular browser-like operating system component -
cannot be resized by any visitor who has vision problems.

Actually they can be resized - by changing the monitor resolution. Of course
it's far from ideal solution to vision problems, but I wanted (in addition
to my usual nitpicking) to refer to the fact _no_ unit in CSS is really
absolute.

You probably meant to say that IE users cannot change a font size if the
author has set it in pixels. That's no quite true either. The user can use
the "Accessibil ity" options and make the browser ignore _all_ font sizes
specified on web pages. He can also use a user style sheet that sets font
sizes using the !important specifier.

However, this is _more difficult_ and clumsier than just using the View/Font
size setting or the font size control button.

>Somebody correct me if I'm wrong but 1em=<default font size of user's
>browser>

>
1em (or 100%) is the user's preferred size.

Technically, 1em (or 100%) is - for font-size - the font size of the
enclosing (parent) element. By default, there is an initial
(browser-default) font size setting for <bodythat can usually be changed
from the browser controls. Thus, it can be called the user's preferred size,
though the preference is often implicit and not very conscious.

--
Jukka K. Korpela ("Yucca")

http://www.cs.tut.fi/~jkorpela/

**p.lepin@ctncorp.com** · Jan 24 '07, 03:45 PM

Re: Font Size units

On Jan 24, 4:31 pm, Harris Kosmidhs
<hkosm...@remov e.me.softnet.tu c.grwrote:

p.le...@ctncorp .com wrote:

[0.8em]

Somebody correct me if I'm wrong but what you just said
seems to amount to (exaggerating somewhat): 'So the
user chose the default font size that he/she finds
comfortable to read, but *I* think it's way too big for
them,--I'll just make the font noticeably smaller,
because, hey, I'm tha duh-signer here; screw the stupid
users and their bloody eyes.'

>
And why everybody thinks that users do setup their
programs they way they want it to act?

Do you have any idea why they don't? Because programs tend
to come with 'reasonably good' default settings for an
average user out of the box.

Now, I'm visually impaired. I set up my browser to use 18pt
fonts by default so that I can read text without straining
my eyes.

But *of course* you know better and force 0.8em upon me.
(Well, honestly, since I've set up minimum font size as
well, you don't, - but not for the lack of trying! Now,
that's kinda fun. Thanks to the best intentions of
web-developers thinking in a similar vein I've had to jump
through some hoops to set up a comfortable browsing
experience where I should've gotten away with simply
choosing the appropriate default font size. Thanks guys, I
really appreciate the effort.)

Most of the people I know don't even know where the
Settings... menu is.

Some people certainly don't know that. And some of the
people that don't know that might find the default settings
uncomfortable. If that is the case, even the stupidest of
them will ask their support staff/IT
admin/computer-literate buddy for help.

It's not your job fixing imaginary problems with default
settings by forcing your own idiosyncratic preferences onto
other people. You're not doing any good. You're doing the
opposite of good.

The web is going to be viewed by dozen of different
browsers on dozens of different platforms, with users
setting up zillions of possible configurations for
comfortable browsing experience. Deal with it. Saying, 'I
think 1em is too big' is, frankly, clueless, because 1em is
a reference point to be set up by the user. By bloody
*definition* of it.

Even I don't change the default values just to see what
others see.

What 'others'? Me, with the setup I described above? Or me,
reading news on my PDA? Or my mother, who has 20/20
eyesight and loves to see as much text on the page as
possible, so she switches to font size so tiny I can't
friggin' recognize it as text.

Clueless.

I stopped using px so that the user can increase/decrease
the fonts, but default font size (*I emphasize again* :
the default px size the browser has after installation)
is too big.

Browser? Which one?

Oh. THE browser. Using what kind of display, resolution and
system-wide fonts?

Clueless.

--
Pavel Lepin

**Andreas Prilop** · Jan 24 '07, 04:55 PM

Re: Font Size units

On Wed, 24 Jan 2007, Harris Kosmidhs wrote:

Somebody correct me if I'm wrong but 1em=<default font size of user's browser>

You are wrong. It's not the "default size", but the "reader's size" in
the reader's browser.

What's are the default settings of the rear-view mirrors in your car?
Have you ever changed them?

**Andy Dingley** · Jan 24 '07, 06:06 PM

Re: Font Size units

On 24 Jan, 14:31, Harris Kosmidhs <hkosm...@remov e.me.softnet.tu c.gr>
wrote:

And why everybody thinks that users do setup their programs they way
they want it to act? Most of the people I know don't even know where the
Settings... menu is. Yeah! Too bad, but that's the way it is...sorry...

So you should punish the ones that do?

Font Size units

Font Size units

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment