Font

Font is the name for a text format including shape, size, and decoration. In CSS, font is defined as font-family, font-size, and font-style. Most fonts are designed for print and struggle on the lower resolution of a computer display or a smartphone. Here is some inside information to help you cut through the myths, save, time and produce better Web pages.

Myths

Fonts are always important

Fonts are important when they are in headings. Fonts are not important in small text on a computer screen. Some types of printing can produce fonts accurately at small sizes but not the current generation of computer screen.

LCD screens do not have the resolution to show the difference between similar fonts. Some of the elaborate decorations on expensive commercial fonts make text harder to read because the slight bits of extra details blow out to pixel size and distract the reader from the true shape of the letters.

Anti-aliasing is a trick used to make shapes more readable at small resolution and it works only for some shapes on some screens. Think about those small pixels as black and white dots similar to a chess board. In very fine resolution printing, you can make the dots so small that the chess board pattern appears as an area of smooth grey. You can produce a similar effect in the highest resolution LCD screens when viewed from a distance, they way you watch a movie. The grey screen no longer looks grey when you lean in to read text, you are back to the chess board pattern.

On a lot of computers with their standard supplied Web browser, reading is easiest with the default operating system or Web browser fonts. If the default is a serif font, the reader might benefit from a switch to sans-serif. The reader rarely benefits from a switch to a more expensive sans-serif font.

You must use Helvetica

Helvetica was important when your grandmother printed stuff. Arial is the font hated most by kids out of college looking for a better font. Arial was developed to look as close as possible to Helvetica and to work on the first dot matrix printers. Arial adjusts to different resolutions. At medium resolution, Arial is similar to Helvetica. At low resolution, Arial is better than Helvetica. Plus one other important factor, if Helvetica was used more often than Arial, the kids fresh out of college would rebel against Helvetica and choose something else, possibly Arial.

Font size

Font size is selected in a Web page using CSS. In CSS you can choose a fixed font size using the following example.
font-size: 24px;

You can combine several settings into one font line as shown next. When you start out formatting text, use the separate font-size specification to make your CSS easier to read and change.
font:italic bold 24px Verdana, sans-serif;