Minimum Font Size?

[pulsewidth947]

I'm designing me a new website, but I want to ensure it looks good on Macs, specifically the 12" screens.

I use a font size of 9px (font family in dreamweaver is geneva, arial etc), which looks fine at 1024x768 on my 15", but is it too small on a 12"? What size is too small for that? i'm guessing 10px is the lowest you shoudl go on a 12".

There isnt going to be lots of text, only a few links to download some of my music, and look at my art..

Thanks guys

 

[Mitthrawnuruodo]

Not having seen the site in question, I will just say that generally 9px is very small for text blocks...

Unless you run out of space very quickly you actually should go for 12pt (or at least 10pt), pt, by the way, is better to use than px when sizing fonts...

 

[pulsewidth947]

right thanks. i assumed pt and px were the same. i'll do some googling to find out the difference!

i just think small text looks neater and cleaner.. but not if people have to strain to see it ey!

 

[munkle]

ems would be even better than px. Using ems will allows those using IE (why?!!) to resize text.

 

[dornoforpyros]

yeah 9 is definatly too small. The smallest I ever go is 10 but it's ussually 11 or 12.

 

[Rower_CPU]

...
pt, by the way, is better to use than px when sizing fonts...

Not really - pts are best suited for print styles, since there is no screen equivalent for them. Since IE can't resize text set with px values for size, the best things to use are relative font sizes such as ems (as munkle mentioned), percents, keywords, or some combination of them (e.g. sane css typography).

 

[Mitthrawnuruodo]

Not really - pts are best suited for print styles, since there is no screen equivalent for them. Since IE can't resize text set with px values for size, the best things to use are relative font sizes such as ems (as munkle mentioned), percents, keywords, or some combination of them (e.g. sane css typography).

Maybe, but I don't like using em or ex for fontsizes, there's something wrong there to set fonts sizes relative to... æææh... fontsizes...

I often use em and ex when sizing other elements, though...

 

[Rower_CPU]

Maybe, but I don't like using em or ex for fontsizes, there's something wrong there to set fonts sizes relative to... æææh... fontsizes...

I often use em and ex when sizing other elements, though...

So you have something against your text looking as close as possible to the same size on various browsers?

 

[Mitthrawnuruodo]

So you have something against your text looking as close as possible to the same size on various browsers?

Well, you still have to set the font-size somewhere not using em... I don't really care if that's done in body or p...

Because "The 'em' unit is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element.", from the CSS standard...

 

[virividox]

iv seen 8, and its hard to read, 10 -11 is pretty good

 

[Rower_CPU]

Well, you still have to set the font-size somewhere not using em... I don't really care if that's done in body or p...

Because "The 'em' unit is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element.", from the CSS standard...

You're missing my point - that is, pt values don't render very similar across browsers and are better suited for print styles than for screen display.

And you absolutely can use em for all font-sizing - body will inherit it from the browser's default font size if you don't give it an explicit value. The section of the spec you quoted doesn't state that it must be explicitly stated in the parent element.

 

[pulsewidth947]

Now i'm confused... nothings ever simple with computers is it..

So the general consensus is that i should use ems? Size 1 ems on dreamweaver roughly equates to size 14 px, which is huge :O

I hate to think how big that'd look on 800x600 on my parents 15" CRT poster size..

Oh well if thats what i gotta do thats what i gotta do..

 

[Mitthrawnuruodo]

You're missing my point - that is, pt values don't render very similar across browsers and are better suited for print styles than for screen display.

And you absolutely can use em for all font-sizing - body will inherit it from the browser's default font size if you don't give it an explicit value. The section of the spec you quoted doesn't state that it must be explicitly stated in the parent element.

I did not say that you couldn't use em for fontsize, just - as you apperently understood but for some reason choose to ignore - that if you use em, and just 'em p), you have no control over which size the fonts on your site will be displayed in, as it's ultimatly inherited from the browser display, which can be sat at anything...

I don't really care if you use points, pixles, picas or millimeters, for that matter, but if you want control you have to set the size non-relative to font-size somewhere... that was my point... nomatter what you chose you'll have issues with certain browsers who are bad at following standards, but that doesn't necessarily mean you should give up on the standards recommendations, either...

 

[Rower_CPU]

Now i'm confused... nothings ever simple with computers is it..

So the general consensus is that i should use ems? Size 1 ems on dreamweaver roughly equates to size 14 px, which is huge :O

I hate to think how big that'd look on 800x600 on my parents 15" CRT poster size..

Oh well if thats what i gotta do thats what i gotta do..

The ems value doesn't have to be an integer - for instance you can set your base value to .7 ems (equivalent to 70%) and then adjust from there.

 

[Rower_CPU]

I did not say that you couldn't use em for fontsize, just - as you apperently understood but for some reason choose to ignore - that if you use em, and just 'em p), you have no control over which size the fonts on your site will be displayed in, as it's ultimatly inherited from the browser display, which can be sat at anything...

I don't really care if you use points, pixles, picas or millimeters, for that matter, but if you want control you have to set the size non-relative to font-size somewhere... that was my point... nomatter what you chose you'll have issues with certain browsers who are bad at following standards, but that doesn't necessarily mean you should give up on the standards recommendations, either...

OK, we're going in circles here - please take a look at the article I linked above on CSS typography. In the extensive testing the author did he found a set of values that work pretty well across most browsers using % on the body and ems for the rest.

I was only disagreeing with your first statement about using pt values instead of px before we went off on this tangent.

 

[ChicoWeb]

11px is probably the smallest you should use. Think about your users and who they are. If you are catering insurance, casino, or things where you may have an older crowd definatly, go for at least 12, because chances are your viewers will be older in age. I usually go 12 px myself.

 

[Mitthrawnuruodo]

OK, we're going in circles here - please take a look at the article I linked above on CSS typography. In the extensive testing the author did he found a set of values that work pretty well across most browsers using % on the body and ems for the rest.

I was only disagreeing with your first statement about using pt values instead of px before we went off on this tangent.

Not trying to be difficult, well not too difficult, anyway...

And it seems like the others in the thread are ignoring us, so we'd better stop this silly argument over nothing... even though I like circles...

To get back on the issue: I still think 9px is too small, and that 12px (or even 12pt, which is 2pt larger than the fonts here at macrumors forums) or, assuming most has set their browser's default proporsional font size to 16, 75% or .7em or .8em, right...?

 

[Rower_CPU]

Not trying to be difficult, well not too difficult, anyway...

And it seems like the others in the thread are ignoring us, so we'd better stop this silly argument over nothing... even though I live circles...

To get back on the issue: I still think 9px is too small, and that 12px (or even 12pt, which is 2pt larger than the fonts here at macrumors forums) or, assuming most has set their browser's default proporsional font size to 16, 75% or .7em or .8em, right...?

Same here.

As far as relating it back to the original topic - I usually set my body element to 76% and leave the p at 1em.

One thing you'll want to double-check is how it looks at various resolutions. I work at 1280x1024 and it can be easy to forget that the fonts that look OK or sorta small on my normal screen can look garish on small ones. Find something middle of the road that works with your design and make users can resize the text up a couple of notches without breaking anything and you'll be set.

 

[ChicoWeb]

And it seems like the others in the thread are ignoring us, so we'd better stop this silly argument over nothing... even though I like circles...

To each is in their own. Peronsonally, I don't like font sizes that are going to vary with resolution, just like I don't like dynamic outlining sites. I like all my viewers to see the same design, because that way I can control it. Just me 1/200th of a dollar.

 

[rendezvouscp]

As far as relating it back to the original topic - I usually set my body element to 76% and leave the p at 1em.

I suggest this too. I use 75%, but it's practically the same. I've read that it's important to set a certain percentage for the body element because of some weird bug in IE, and the combination of 75% and 1em works pretty well.
-Chase