Font Size - Point or Pixel?

[Greenguy]

This may be a dumb question, but what do you use for font size when you're building a page? Point or Pixel?

My editor (Namo) defaults to Point, so that's what I've used for the most part. But looking around the the source code for a lot of sityes, I see more & more using Pixel.

So is one better than the other? Are there actually pros & cons for this?

I know - I worry about silly things

[pc]

point is relative to the parent container
pixel is relative to the screen resolution

iThink

[ArtWilliams]

I find this page very useful for figuring that stuff out:

http://net.jasonpearce.com/tools/cssfontsizes.html

[dunc]

I use pixels cos I can't figure out that relative stuff with ems, points and so on - pixels work for me

[Simon]

My take on this is that unless you're creating a stylesheet that will be called when someone wants to print your page there's no good reason to use points.

Point sizes are for print medium.

Pixels are for display on a screen.

(There are also percentages and ems for sizing, but unless you're designing a "liquid layout" there's not much reason to use those.)

My suggestion is to use pixel sizes in most cases.

HTH

[flowersgone]

There seems to be a preference by those with a bent for css to prefer the 'em's and they are a recommended 'best practice' by w3.org (http://en.wikipedia.org/wiki/Em_(typography) and http://www.w3.org/WAI/GL/css2em.htm).

I have gotten comfortable with 'em's and fwiw at this point I find them convenient for describing font related sizes like font-size and line-height and font proportional padding/margins.

I found two more interesting links discussing the matter here http://css-tricks.com/css-font-size/ and here http://www.w3.org/Style/Examples/007/units.en.html.

The line of business connected to this forum has, how should one say (?), an emphasis on image presentation and web image sizes are described in px. This may more often make px a more intuitive measure here...

[Cleo]

Coming from print I was use to using points and ems but doing static web pages I find it easier to use pixels since my images are measured in pixels but on blog templates and other fluid pages ems are the way to go.

[Voltar]

I use pixels, long time back use to use size 3 as standard, but nowdays size 4 and 5 are standard for me..with larger ones for impact...also a few well placed headline tags can do wonders sprinkled in..and SEs base codes all started with headline codes being super important and given a bit more weight...and i find they still are..if used correctly..

[LD]

I can't get pages to work right when there is text and images unless I use pixels. With relative sizes, some combination of screen resolution and browser always gets screwed up. Switching to pixels makes it right.

This seems to go against what people who write css reference books recommend...oh well.

[Simon]

This seems to go against what people who write css reference books recommend

Yeah, one day someone should do an ebook "CSS+XHTML for Porn Pages"

... because there's a lot that applies to mainstream design that just doesn't work for what most of us do here.

[Toby]

Whichever way you choose, be consistent.

[spookyx]

Originally Posted by Simon

My take on this is that unless you're creating a stylesheet that will be called when someone wants to print your page there's no good reason to use points.

Point sizes are for print medium.

Pixels are for display on a screen.

(There are also percentages and ems for sizing, but unless you're designing a "liquid layout" there's not much reason to use those.)

My suggestion is to use pixel sizes in most cases.

HTH

what simon says

[GigglesWorld]

I generally prefer to use pixels.

[housekeeper]

Originally Posted by Simon

there's a lot that applies to mainstream design that just doesn't work for what most of us do here.

ain't it da truth, ain't it da truth...

px seem to be the most common and easy to work with

[raymor]

Point or Pixel?

No! It's none of your business how many pixels my screen has, nor how
big I need it in order to see it clearly. Your business is to emphasize or
de-emphasize text by making one part larger or smaller.

Any of the following CSS size codes are appropriate for a designer.
For example on a copyright notice "smaller", "small" or "x-small" might be
good, but it's none of your business how many pixels is "x-small" to me:

x-small 	Sets the font-size to an extra small size
small 	Sets the font-size to a small size
medium 	Sets the font-size to a medium size. This is default
large 	Sets the font-size to a large size
x-large 	Sets the font-size to an extra large size
xx-large 	Sets the font-size to an xx-large size
smaller 	Sets the font-size to a smaller size than the parent element
larger 	Sets the font-size to a larger size than the parent element

Also a percentage size such as "125%" might make sense, or maybe "70%".
That let's you say you want this text a bit bigger or smaller than the rest,
without making it invisible through my coke bottle glasses. This is especially
important with the recent rise of mobile, though we've seen the same thing
in prior years with WebTV, Playstation, etc. 20 pixels on a TV is 8% of the screen.
20 pixels on most monitors is closer to 2%, so on the TV it's four times times as tall.
On my "dumb" phone, you have no idea what 20 pixels is, but you know that
"larger" will be exactly that - larger than normal.

While writing this, I was on the phone with a guy who has his browser to set
about 32point font by default, because he doesn't see well. If you set either
a point size or a pixel size you'll lose him.

See also:
http://www.w3schools.com/css/pr_font_font-size.asp

[davion]

For me choose the pixel as what they say depends on the screen resolution. Cheers.

[raymor]

Originally Posted by pc

point is relative to the parent container
pixel is relative to the screen resolution

iThink

Point is NOT relative to the parent. "larger" and "smaller" are relative to the parent.
Point is a number of pixels which varies by system.

(There are also percentages and ems for sizing, but unless you're designing a "liquid layout" there's not much reason to use those.)

Where "liquid layout" means "a site that works on your customer's screen as well as your own.
Agreed, there's not much reason to use percentages or ems if you are the only one viewing the site.
On the other hand, if have, or want to have customers, and want your site
to look good for potential customers, that when you want ems or percentages.

[Cleo]

My images are in pixels so I make my fonts in pixels so that they will be relative to the images.

[pc]

Originally Posted by raymor

..........

While writing this, I was on the phone with a guy who has his browser to set
about 32point font by default, because he doesn't see well. If you set either
a point size or a pixel size you'll lose him.

See also:
http://www.w3schools.com/css/pr_font_font-size.asp

combination of ctrl and + should do the trick in most cases

[Toby]

Originally Posted by raymor

While writing this, I was on the phone with a guy who has his browser to set about 32point font by default, because he doesn't see well. If you set either a point size or a pixel size you'll lose him.

Yes, that would be true IF we were selling something technical or complex that required some explanation. But we're not.

We're selling porn. Pics and vids of tits, ass and pussy. The text is there to enhance the pics and for SE spiders, not as the main content.

[raymor]

Originally Posted by Toby

Yes, that would be true IF we were selling something technical or complex that required some explanation. But we're not.

We're selling porn. Pics and vids of tits, ass and pussy. The text is there to enhance the pics and for SE spiders, not as the main content.

or if there is any use to having the text in the first place.
Whether the text is there as the primary content or to enhance the pics,
it should be readable, or it should be gone.

[Toby]

Originally Posted by raymor

or if there is any use to having the text in the first place.
Whether the text is there as the primary content or to enhance the pics,
it should be readable, or it should be gone.

I'll trust my 50+ year old eyes to be a pretty good judge of whether the text on my pages is readable or not for the overwhelming majority of my visitors.

[Greenguy]

I don't understand this "none of your business" part of this - plus why would I want to limit myself to 6 font sizes? When building my sites, I use anywhere from 10 pixels to 50 pixels.

[Sable]

I used point a while ago, but changed it to pixels because there is a flaw in Firefox. When setting the font size in windows to 125% or more. IE scales the font based on windows settings, while Firefox ignores the windows settings and displays the font with the point size defined.

To get a consistent layout regardless of browser and windows settings it's better to use pixels.

Haven't tested it for Firefox 4.x yet, but there are still so many ppl using older Firefox versions, I think it will not change soon.

Sable