|
|
Typography and Website Design - Style
Uppercase, bold, italic, underlined, subscript and superscript text as well as font color and size.
|
Typography on the Web
StyleOnce you have decided on the "appearance" of web page text; what about the "style" of the text? Style refers to -uppercase, bold, italic, underlined, subscript and superscript text as well as font color and size.Avoid uppercase textA good rule of thumb is to avoid using uppercase text as much as possible; it's difficult to read when you are skimming a page. (Plus, on the Internet, capital letters symbolize "SHOUTING"!) Save the bold, italics and underlining for very important text and use it in small doses.Sans-serif fonts are bestIt is best to use a sans-serif font for all of your website text styles. This not only provides easy reading for your website visitor but also gives an appearance of uniformity and professionalism to the site. |
|
Font Color vs BackgroundThe color of font you use for the bulk of your pages should be one that contrasts sharply with the background for easy readability. If the background is too colorful or dark, use a graphics program to lighten it.Contrast text with the backgroundThe example given below shows the need to contrast your text with it's background. In order for your web text to be easily readable you must consider the web page background vs the text color. Do they contrast effectively? Are your visitors going to be able to read your content without trouble?
Shown is an example of web page background graphics vs text color and readability.
Font SizeFont size is a matter of preference and is often determined by the type of web site you have. However, it's usually pretty easy to spot a web site by someone new to the Internet ... the font size is very large and is the same for everything. This is because most of us are conditioned to use a size 12pt font for creating printed correspondence and we transfer that habit to a web site. To compare, A 10pt font is used for these pages with a larger 12pt for headers.
Here is what a 12pt font looks like on the web. You can imagine how fast this would fill up a web page. Plus, text this large is unnecessary on the web, except as headers.Text size and colorRather than using bold, italics or underlining, a slightly larger or different colored font can call attention to important information. And smaller text, as in the links at the bottom of this page, let the reader know this is something different from the rest of the web page. |
Avoid harsh font colorsDon't get carried away with a lot of different text colors; too many and a web site can take on a circus-like appearance. Also, this type of color use is unprofessional.Simple is always the best betThe colors red and yellow will draw the eye's attention, but they also tire the eyes. So use these colors sparingly - just to emphasize something you really want your visitors to see. Simple is always the best bet.A lot of text in either red or yellow, and your visitors will move on not even realizing it's because the color has tired their eyes. Keep your visitors happy and you will be happy you did.
|
|
|