Let’s be honest. Typography and the web do not go hand-in-hand. You’re limited to a choice of about 5 fonts, most of which are cheap knockoffs of ‘proper’ typefaces. You’ve got practically no fine control over kerning or line spacing, and – worst of all – there’s a very good chance that no matter what you do, no matter how hard you try – your type is going to look different on every single browser and operating system. So what is an avid graphic designer-cum-web designer to do when faced with the seemingly insurmountable task of making web type look good?

Tip 1: Don’t limit your size options

Once upon a time, we were limited to a mere 7 sizes via use of the <font> tag – thankfully current incarnations of CSS grant us much better control, so quite a fine level of control over the size can be had.

Figure 1: Newer methods of specifying sizes in CSS allow for more flexibility when choosing type size. Don’t stick to standard sizes – experiment!

Relative sizes work best- don’t forget your visitors may have a different font size setting to the default, so specifying fixed point or pixel values may make things look awfully strange. ‘Em’ units – so called as 1em is equal to the width of the lowercase ‘m’ character, are one of a few ways to scale your text proportionally. All things being equal, at default settings 1em is the same size as 12 points.

You’re not limited to while numbers, either – 0.8em is a good body font size, typically being rendered at 10pt. You can specify any number you like, and as large as you like – don’t limit yourself to sub-24pt sizes if the design warrants a larger size. Read the rest of this entry »

The proper selection of typography in a design can set the appropriate theme and mood that the designer is going for. There are a lot of free fonts on the web – created by talented designers and type foundries.

In this collection, you’ll find 45 first-class, downloadable fonts for your use.

Clean, Modern, Web 2.0

Eurofurence

Cicle

Share

Reznor Broken

Read the rest of this entry »