What size is (should be) the Default Font?

HTML & CSS
1

Is there a “standard” default font size that most browsers use?

I ask this because I am struggling how BIG things should look on my website?! :-/

Originally I figured making things on the bigger side was a good thing for people with higher-resolutions and for older people or who have bad vision.

But the more I surf the Internet, it is like my website is GIGANTIC and maybe I need to make things smaller?!

Also, I noticed that my FireFox is set to a default of Times 16 point and that seems pretty darn big, isn’t it?!

I’m confused! Please help!!

Thanks,

Debbie

2

The default size depends on the screen resolution and how your visitor has their browser configured.

If you specify all the sizes in em (and put 100% on the body to fix an IE bug) then all of the sizes will be automatically made larger for those who have their screen and browser set to make text bigger while leaving it at the size you see it at for those with the same resolution and settings as you have.

3

What size is (should be) the Default Font?
That’s like asking: What station should a radio be set on? :smiley:

The end user should be the one that is in full control of their preferred settings. The text on your site should be able to scale according to their default font-size.

The main content needs to be set in ems or %. I generally set that text at 1em which in turn sets it to the users default font-size. Now when you get into text in sidebars or other areas that are not considered main content then yes you can scale it down, but use ems or %.

Is there a “standard” default font size that most browsers use?
Most browsers are set somewhere around 16 out of the box. But don’t depend on that as any sort of basis though for setting your base font. Most people know how to adjust their browser font settings and I suspect that most people know how to use zoom when they need to.

4

I have been sticking to EMs. I don’t have anything set in my Body.

Debbie

5

I always thought 12pt font was the standard. So when I saw 16pt in FireFox I freaked out and thought maybe I bumped something?!

Here is an interesting article: Relative readability

The end user should be the one that is in full control of their preferred settings. The text on your site should be able to scale according to their default font-size.

And when you set your Body Font to 0.8em you just took away some of that control. Thus my question…

There must be some “Golden Rule” for what makes a good Body Font Size?!

I bet you’d agree that 0.2em is too small and that 3em is too big for Body…

The main content needs to be set in ems or %.

Mine is.

I generally set that text at 1em which in turn sets it to the users default font-size. Now when you get into text in sidebars or other areas that are not considered main content then yes you can scale it down, but use ems or %.

I do.

Here is what I have now…

body{
background: #FFF;
font-family: Helvetica, Arial, Sans-Serif;
line-height: 1.4em;
font-size: 0.9em;
}

After reading that article above, and here: The 100% Easy-2-Read Standard, I am starting to change my opinion 180 degrees and wondering if my Font is NOT too big, but maybe okay.

They seem to stress that larger is better.

Most browsers are set somewhere around 16 out of the box. But don’t depend on that as any sort of basis though for setting your base font. Most people know how to adjust their browser font settings and I suspect that most people know how to use zoom when they need to.

Can you zoom in and out easily with other browsers like in FireFox?

I “command +” and “command -” like crazy when I’m on the web!!!

I think two of my issues with something not looking right might not be the Font Size as much as…

1.) I need to manage my White Space a tad better

2.) It sucks developing a website when you are on a 12.1" MacBook and you have about 10" W by 7" H (Well, at least nobody will ever accuse me of not “designing for above the fold”. My entire laptop is “above the fold” it is so tiny!!)

Debbie

6

You didn’t see 16pt in Firefox - you saw 16px.

Pixels and points are two different measures and are only equal if the screen is set so as to get exactly 72 pixels per inch.

Most screen resolutions now are either 96 pixels per inch or even more and so pixels are usually smaller than points.

At 96 pixels per inch 16px is 12pt - but you are best off not trying to measure things on the screen in points and to save that for printing where 72 points are equal to an inch (on the computer - the printing industry uses or used to use a slightly smaller point size where there are 72.1 to an inch).