So I was wondering about what your opinions are on what the best fonts and font sizes are to use for the body of a website. What size it too small? Does it depend on who the visitors to your site are (age group?)? Please share your opinions and discuss!

 

 

I mostly use verdana or georgia size 8pt or 10pt.

"pt" is not a unit you should be using for the web; it's designed for printed material rather than web-based material.

 

I would also say that 8pt is a bit too small. I can't speak for everyone, but I LIKE BIG TEXT because it's easier to read. I'd be more likely to go with 11-12pt.

working in em's is the best (normally).

There's a good list of web safe fonts here - http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

I think comic sans is the best font ever!!.......well not really! I do however have a soft spot for Lucida Sans.

 

Try this fun and topical link: Font Conference

I would also say that 8pt is a bit too small. I can't speak for everyone, but I LIKE BIG TEXT because it's easier to read. I'd be more likely to go with 11-12pt.

 

That's why you need glasses love

 

As for font size, Racheal's right. Points aren't what you should be using in your code, but Mark Boulton has a great article that you should read call "Five simple steps to better typography - size" and scroll down to Application of the scale. Gives you some CSS code to help that takes a point or em value and converts is to an appropriate size hierarchy.

 

Personally anything under 11pts is too small. As for the best font, it depends on your headings. Arial is safe, but bland. Verdana is ok. Helvetica is good if you have it installed. A personal favourite is Trebuchet. Also read this article about font stacks.

I think comic sans is the best font ever!!

 

Don't make me drive round the corner to open a can of woopass on you!

I think comic sans is the best font ever!!.......well not really! I do however have a soft spot for Lucida Sans.

 

Try this fun and topical link: Font Conference

 

hi check out this http://limitsnomore.blogspot.com/

I usually use a family of FreeSans, Helvetica, Arial and a generic Sans.

Should one use PX, % or Em when defining the font size?

Not px. It's an "absolute" size, which unfortunately means that people using IE6 to view your site won't be able to resize your text. As for % / em, I think that's down to personal preference.

is there any significant advantages to using either % or em...ive tried to google this but havent really found any decent articles stating the difference.

I'm always using ems. If you are setting the font size to 62,5% in body, you can very easily calculate how big it would've been in pxs. 10px = 1em. 15px = 1.5em; You get it? It gives you a very easy way to set text size if you are not quite familiar with ems

 

body { font: 62.5%/1.3 Arial, Helvetica, Sans-Serif; }

#something { font-size: 1.3em; /* 13pxs */ }

Nice tip Sono, thanks

http://www.typetester.org/

 

enjoy

http://www.typetester.org/

 

enjoy

 

Looks like a nice little tool, thanks for that!

Sometimes your font can be an essential part of your design. I also am a fan of smaller text as it looks more professional to me for some reason.

As long as your leading is large enough, you can use big text and it still looks profesional. (To some point of course)

I'm always using ems. If you are setting the font size to 62,5% in body, you can very easily calculate how big it would've been in pxs. 10px = 1em. 15px = 1.5em; You get it? It gives you a very easy way to set text size if you are not quite familiar with ems

 

body { font: 62.5%/1.3 Arial, Helvetica, Sans-Serif; }

#something { font-size: 1.3em; /* 13pxs */ }

 

 

This is a great tip I learned not so long ago, seems simple now really. There's just one thing you need to watch out for and that's when you set font sizes in em's when you have nested div's, you can end up with them doubling up and getting completely the wrong size, that's usually blatantly obvious though when you look at your site.

Any "containing" tag with a font set in ems will inherit on the nested tag. <b>Be <i>careful</i> here</b>

 

 

Sometimes your font can be an essential part of your design. I also am a fan of smaller text as it looks more professional to me for some reason.

I disagree. Font is always an essential part of a design if it has copy, as I see it. And small or large font size really depends on the context and font used.

<b>Be <i>careful</i> here</b>

<strong>Be <em>careful</em> here</strong>, accutally.

I'm always using ems. If you are setting the font size to 62,5% in body, you can very easily calculate how big it would've been in pxs. 10px = 1em. 15px = 1.5em; You get it? It gives you a very easy way to set text size if you are not quite familiar with ems

 

body { font: 62.5%/1.3 Arial, Helvetica, Sans-Serif; }

#something { font-size: 1.3em; /* 13pxs */ }

 

Aiiii ...that's the one...as good as the browser reset for your CSS this is.

 

1 - 1.2em or 10 - 12px for me on content...then 1.3 - 1.8em or 13 - 18px on headers. makes setting up <h><p><a>M<li> etc sizes a doddle.

 

If you are insterested in some Css tricks, I recomend you to take a look here: http://www.webdesignerforum.co.uk/index.ph...ic=4726&hl=