Typography ty·pog·ra·phy (t -p g r -f ) n., pl. ty·pog·ra·phies. Abbr. typ., typo. Printing 1.The art and technique of printing with movable type. a.The composition of printed material from movable type. 2.The arrangement and appearance of printed matter * Source dictionary.com © Dale Krasnoff-Bromberg 2001
Terms Font describes one style such as Sans Serif. The word font is derived from foundry. A font is one style, with one weight, width & posture. Typeface can mean the same thing or an entire family of fonts of the same style with varying attributes. For the latter this means varying weights, widths & postures. Type design houses are still called foundries. © Dale Krasnoff-Bromberg 2001
Font Styles Weight: lightness or darkness which is produced by the design & thickness of the line. Standard levels are: extralight, light, semilight, regular, medium, semibold, bold, extrabold, and ultrabold (also referred to as black, e.g. Arial Black.
Roman & other terms Roman weight dates back to the mid- 1400’s. It is “normal” weight, and is the most common. Bold is a 20 th century invention. Width refers to the amount of horizontal space a typestyle utilizes. If a character is narrower than Roman it is referred to as condensed or compressed. This is Garamond Book Condensed versus Garamond. Wider than Roman are called expanded or extended. –© Dale Krasnoff-Bromberg 2001
More terms Posture refers to the angle of the letter. So if a letter is not straight up and down as in having Roman posture, it is in italics oblique. Italics comes from cursive script and the earliest examples are from the late 15 th or early 16 th century. © Dale Krasnoff-Bromberg 2001
HTML tags associated with text through for varying size headings, H1 is the largest. We can use the tag which sets the type one font size larger and for one size smaller will make the text flash on & off. is used to affect the typeface, color & size. We have: color= face=typeface (or list of typefaces) size=value (1 – 7) © Dale Krasnoff-Bromberg 2001
More HTML tags associated with text for italics for strike-through, underlined or for bold and for sub script & super script, respectively. © Dale Krasnoff-Bromberg 2001
Spacing & Positioning The beginning & end of a Paragraph creates a new line, but doesn’t add extra space as the does above to center text. We can also have align right or left, ALIGN=“right” or ALIGN=“left” an item list a numbered list, an unordered list with a bullet style © Dale Krasnoff-Bromberg 2001
Graphics GIF stands for Graphic Interchange Format. Usually used for drawings & line art. Handles flat colors. 256 colors GIF file compression Interlaced GIF Transparent GIF JPEG (Joint Photographic Experts Group) used for photographs and doesn’t handle flat colors well. Disadvantage is it’s a lossy process. PNG (Portable Network Graphics) –© Dale Krasnoff-Bromberg 2001
If you’ve created graphics Scanned graphics yield TIFF, PICT, BMP, or EPS files. You will need to convert this. Graphics can be created with digital cameras, or using graphic software packages such as Adobe Photoshop (raster images), AutoCAD, Macromedia Fireworks, Microsoft Paint, etc. Just changing the file extension won’t do. You can use debabelizer from © Dale Krasnoff-Bromberg 2001.debabelizer.com/
HTML Image Tags Adds a horizontal rule on the page places a graphic, and is used as <IMG SRC=“image file” ALT=“alternate text” Here again we can use ALIGN to place the image. We can set the HEIGHT=value & WIDTH= value to set the dimensions. We can also place an image as a background using <BODY BACKGROUND=“image file” © Dale Krasnoff-Bromberg 2001