Typography in Web Design: What’s in Your Face?

Typography is an integral part of web design. A website is not a website without textual content. The presentation of this textual content is as important (if not more important) than how well the images are placed on the page.

There are two very basic families of typefaces and they are serif and sans serif. A serif is the embellishment or extra stroke you’ll see at the end of the font’s main stems. A serif font style has extra “legs” or “tails” at the edges. A sans serif font style, on the other hand, is simpler and would not have these extra strokes.

As much as possible, web designers only use one font style family in a single web page. This creates some sort of uniformity throughout the layout. Using too many font styles is also a big no-no in web design because it looks amateurish and too busy.

Of course, there are exceptions to the rule. For example, web designers may purposefully use a gamut of font styles to make the web design wild because it’s the mood they’re trying to express. These are very rare, though, as business websites prefer to look refined. Hence, only two or three font styles are used at a time.

Proper use of typography also involves balancing. A page is well balanced if the concentration of textual content and images are equal all throughout the page. The font’s sizes are also important. There’s no hard rule about assigning font size values. Most of the time, it would depend on the taste of the layout artist. This is why it’s very important to hire a website designer who has a good “eye” for things like these.

Outside the aesthetics, though, it’s really about readability. It’s very difficult to read from a webpage. Compared to reading from a printed page, an online page would strain the eyes more. Generally, the font size should be bigger when you’re designing a page online compared to when you’re designing a page for print. The lines and paragraphs should also have enough white space in between them. Well-spaced text is easier to read.

Another factor which web designers should consider is the color of the website’s background compared to the color of the text. To ensure readability, use a background image which has a uniform or close-to-uniform color, at least on one side of it. This way, you’ll have a place to set your textual content. It’s not advisable to adjust the color of the text body just so it can be contrasted with the background image. The text should always be more striking than the background image.