You are on page 1of 2

How to use Fonts properly CONTRAST - Text is much easier to read with a high degree of contrast between the

text an d the background. Black text on a white background. Yellow / Green text on a black background. - This high level of contrast makes it easy for users with very low visi on to read. Designers just use tools like Juicy Studio Color Contrast Analyzer. Here are algorithms for determining sufficient contrast: Color Brightness Formula: [(RED * 299) + (GREEN * 587) + (BLUE * 114)] / 1000 Color Difference Formula: (maximum (Red value 1, Red value 2) - minimum (Red value 1, Red value 2)) + (ma ximum (Green value 1, Green value 2) - minimum (Green value 1, Green value 2)) + (maximum (Blue value 1, Blue value 2) - minimum (Blue value 1, Blue value 2)) FONT SIZE - Don't custom font size for websites. The browser to default to the appropriat e size for the user. - Don't use a smaller font then 85% of the original font size. Relative Units (better than absolute) - Percentages (%) or "ems" (em) Absolute Units (Not to be used) - points (pt), pixels (px), centimeters (cm), millimeters (mm) and inches (in). Fonts are broken up into families - SERIF - identified by flared extensions or strokes on the tips of the letters. - Times New Roman, Georgia, Book Antiqua - SANS-SERIF - have plain endings (right-angled) - Arial, Helvetica, Tahoma, Trebuchet MS, Verdana - Verdana makes it easy to differentiate between lower case l and an upp er case i - with Arial there is no difference. - CURSIVE - resemble hand-written pen or brush strokes.."more difficult to read" - Amazone, BT, BernhardTango BT, Embassy BT, BarkAvenue BT, TypeUpright BT - Comic Sans MS is the most commonly available - FANTASY - Primarily decorative and not intended for primary use. - MONOSPACE - Each letter takes up the same wideth of space including spaces. - Courier and Courier New. - Typically used to display computer code or scripts and other technical content. Serif and sans-serif are the most common. SERIF Georgia - Pro - Not the default text of the browser. makes it easier for users to see a difference in the website.

- Georgia looks more artistic than Times New Roman Georgia - Con - Takes more space than Times New Roman SANS-SERIF Verdana - Pro - Verdana makes it easy to differentiate between lower case l and an upper case i with Arial there is no difference. Verdana - Con Verdana takes up more space than Arial Tahoma - Pro - Smaller than Verdana (still larger then Arial) Tahoma - Con - Spacing is tighter than Verdana or Arial Trebuchet MS - Pro Trebuchet MS - Con - has some subtle embellishments on certain characters. - Lower case l looks the same as an upper case i.