Multimedia Systems and

Applications

Lecture 5 – Text and Fonts

Introduction to Multimedia 1
Objectives
 To understand how computer handles text.

 To understand what is a font and its measurement.

Introduction to Multimedia 2
Contents
 Character Sets
 Typefaces and fonts
 Using Text in multimedia

Introduction to Multimedia 3
Text
 Text is a vital element of multimedia presentations.
 Words and symbols in any form, spoken or written, are
the most common system of communication. They
deliver the most widely understood meaning to the
greatest number of people— accurately and in detail.
 It is very important to choose the suitable words and
symbols in your multimedia presentation.
 “You will reward yourself and your users if you take the
time to choose the right words”.
Introduction to Multimedia 4
Because of associations that we have visually, type and
typography are powerful in their own rights.

Powerful
Powerful

Powerful
Powerful
Introduction to Multimedia 5
Text
 Text is a visual representation of language, as well as
a graphic element in its own right.
 The study of how to display text is known as
typography. It concerns the precise shape of
characters, their spacing, the layout of the lines and
paragraphs, and so on.
 However, we are concerned in another aspect of text,
namely its appearance in multimedia presentation.

Introduction to Multimedia 6
 Character Sets
 As we may already recognized that, the
visual appearance of a piece of text can be in
many different forms, the basic meaning of
the text will not change.
 Fundamentally, a piece of text consists of
letters, digits, punctuations and other
symbols. These can be considered as
abstract characters.
 Abstract characters in a particular language
are grouped into alphabets. For example,
The alphabet of English contains the upper
case letters A to Z, the lower case letters a to
z, the digits and a number of punctuations.
Introduction to Multimedia 7
Character Sets
 To represent text digitally, it is necessary to define a
mapping between (abstract) characters and the values
that are stored in a computer system. We call this
mapping a character set.
 The domain of this mapping, i.e., the abstract
characters are called character repertoire and the
values to be stored are called the code values or code
points.

Introduction to Multimedia 8
Standardization
 Clearly, if any systems want to communicate with each other,
they have to have a common language. Text is the most widely
used means of communication among computer systems.
 Therefore, a common character set is essential.
 The earliest widely accepted character set is ASCII which
stands for American Standard Code for Information
Interchange.
 The code range of ASCII is 7-bit, meaning that the code value
can be store in 7 bits. Therefore, at most 127 characters can be
coded. However, the character repertoire of ASCII only
comprises 95 printable characters. The values 0 to 31 and 127
are assigned to control characters. Later, ISO adopted ASCII
as an standard (ISO 646).
Introduction to Multimedia 9
 Standardization
 Obviously, 127 values are not enough to code many of the world’s
languages.
 ISO produced a new standard ISO-8859 with 8-bit characters.
Actually, ISO-8859 has many parts. Each part specifies a number
of character sets.
 The lower 127 characters in all parts are identical to ASCII.

Introduction to Multimedia 10
Unicode
 produced a standard The Unicode Standard,
Version1.0 in 1991. The latest version uses 4 bytes to
encode each character.

 Unicode attempts to specify a character set to

embrace all languages of the world. It is gaining
popular support nowadays.

Introduction to Multimedia 11
Typefaces and fonts
 To display text, we need to have a visual representation of the
characters stored as codes in the computer. In fact, each character
may be represented by many different glyphs.
 A typeface is a family of graphic characters with a coherent
design and usually includes many sizes and styles.
 A font is a set of graphic characters with a specific design in a
specific size and style.
 For example,
 The typeface used in this paragraph is ‘Times New Roman’.
 The font is ‘Times New Roman Bold 24 point’.

Introduction to Multimedia 12
Introduction to Multimedia 13
Introduction to Multimedia 14
 Measurements of the type
 When putting characters on to a page,
we need to know some basic
measurement of the types we use.
 Each character has a bounding box.
This is the rectangle enclosing the
entire character.
 Each character has an origin. It is
usually place on the baseline. The
width of the character determine where
the origin of the next character will be.
 The distance between the origin and the
left side of the bounding box is called
left side bearing.
Introduction to Multimedia 15
Introduction to Multimedia 16
Measurements of the type
 As we all know, some of the lower case letters extend
upward, like b and h, while others extend downward,
like g, p and q.
 The height of the lower case letter without ascender
and descender is called the xheight.
 The height of the upper case letters is called the cap-
height.

Introduction to Multimedia 17
Font Attributes
 There are many fonts available. Five attributes are often used for
specifying a font:
 Family — fonts in the same family have a coherent design, a
similar look and feel. Here are some of the common families:

 Shape — refers to the different appearance within a family.

Compare the following shapes:

Introduction to Multimedia 18
Font Attributes
 Weight — measures the darkness of the characters, or the
thickness of the strokes. The names used to distinguish weight
are not uniform between type suppliers. The commonly used
names are: ultra light, extra light, light, semi light, medium,
semi bold, bold, extra bold, … etc.
 Width — the amount of expansion or contraction with respect
to the normal or medium in the family.
 Size — unit is point. 1 inch = 72.27 point in printing industry.
1 inch = 72 point in PostScript systems.

Introduction to Multimedia 19
Fonts Effects
 A numbers of effects that are useful for bringing viewer’s
attention to content:

 Case: UPPER and lower letter

 Bold, Italic, Underline, superscript or
subscript
 Embossed or Shadow
 Colours

Strikethrough


Introduction to Multimedia 20
Classification of Typeface
 Typefaces can be classified in many ways. One
classification is understood universally: serif
and sans serif.
 Serif is the little flag or decoration at the end of Serifs
a stroke.
 On printed pages, serif fonts are used for body
text while sans serif fonts are used for headline
because the serifs helps guide the reader’s eye Sans Serifs
along the line of text.
 Multimedia presentation are displayed on low
resolution screen where sans serif fonts will be
far more legible.
Introduction to Multimedia 21
Types of Fonts
 For computer displays, Sans Serif fonts considered
better because of the sharper contrast.

Examples
Examplesof
ofSan
SanSerif
Seriffonts
fonts

Times
TimesNew
NewRoman
Roman Century
CenturyGothic
Gothic
Bookman
Bookman Arial
Arial
Rockwell
RockwellLight
Light Comic
Comic Sans
Sans MS
MS
Courier
Courier New
New Impact
Impact
Century
Century Tahoma
Tahoma

Examples
Examplesof
ofSerif
Seriffonts
fonts
Introduction to Multimedia 22
Bitmap Fonts

Introduction to Multimedia 23
Bitmap Fonts Versus Outline
Fonts
 Font formats can be divided into two main categories:
bitmap fonts and outline fonts.
Bitmap fonts come in specific Outline fonts contain the
sizes and resolutions. outline of the characters.
They can be scaled to a large
Because the font contain the range of different sizes and
bitmaps of the character shapes. still have reasonable look.
The result will be very poor if They need a rasterizing
they are scaled to different sizes. process to display on screen.

Introduction to Multimedia 24
Bitmap Fonts Versus Outline Fonts
screen

screen
Introduction to Multimedia 25
Bitmap Fonts Versus Outline
Fonts
 Nowadays, outline fonts are much more common than
bitmap fonts. There are two kinds of outline fonts:
PostScript and TrueType.

 All version of Windows support TrueType fonts.

Windows3.1 and Windows95 require Adobe Type
Manager (ATM) to display PostScript fonts.
PostScript printers have a number of resident
PostScript fonts.

Introduction to Multimedia 26
 Measurements for Text Layout
 Leading (Line Spacing ) is the distance between the baselines of
two adjacent lines. Common used leadings are 14 points for 12
points text, 12 points for 10 points text.

 Tracking (Universal) is the spacing between characters in text

lines. Loose tracking means the space between characters are
wider. Less words can be put in a line of text.

 Kerning (Specific) is the extra adjustment between two specific

characters. Normally, characters are place one next to the other,
i.e., the distance between the origins of the adjacent characters is
equal to the character width. But due to the shape of the
characters, the space between certain characters may look
uneven, e.g., the A and v in the figure. Therefore, we need to kern
the characters.
Introduction to Multimedia 27
Tracking, Kerning and Leading

Av
Unkerned
Av
Kerned
Introduction to Multimedia 28
Tracking, Kerning and Leading

Reading Line One

Leading
Reading Line One
 Leading : spacing above and below a font or Line
spacing

 Tracking : spacing between characters

 Kerning : space between pairs of characters, usually

as
an overlap for improvement appearance
Introduction to Multimedia 29
Using Text in Multimedia v1
Picking the fonts to use in a multimedia presentation may
be difficult. Here are some suggestions:
 For small type, use the most legible font available,
decorative fonts are useless.
 Use as few different faces as possible in the same work, but
vary the weight and the size and using italic or bold styles.
 In text block, adjust the leading for the most pleasing line
spacing. Lines too tightly packed are difficult to read.
 Vary the size of a font in proportion to the importance of the
message.
 In large size headline, do proper kerning so that the spacing
feels right.
 Explore the effects of different colors and of placing the text
on various backgrounds.
Introduction to Multimedia 30
Using Text in Multimedia v2
Picking the fonts to use in a multimedia presentation may
be difficult. Here are some suggestions:
 For small type, use the most legible font available, decorative
fonts are useless.

 Use as few different faces as possible in the same work, but

vary the weight and the size and using italic or bold styles.

 In text block, adjust the leading for the most pleasing line
spacing. Lines too tightly packed are difficult to read.

Introduction to Multimedia 31
Using Text in Multimedia v2
(cont.)
 Vary the size of a font in proportion to the importance
of the message.
 In large size headline, do proper kerning so that the
spacing feels right.
 Explore the effects of different colors and of placing
the text on various backgrounds.

Introduction to Multimedia 32
Good Screen
 One idea per slide: little text and aren’t overcrowded.

 Use simple diagrams/pictures where possible.

 Use a good, clear typeface

 44 36 24 18 14 12 10

 44 36 24 18 14 12 10
-
-
-

 Highlight your keywords to be remembered.

Introduction to Multimedia 33
Pitfalls of Animations

 Use animation carefully to guide you through your

project.

 Think carefully about any diagrams you use and make

sure they are readable.

 Don’t forget to use the spelling chekker.

Introduction to Multimedia 34
Text Data Files
 The common data encoding schemes for text are:

 Plain text (ASCII) is text in an electronic format that can be

read and interpreted by humans

 Rich text is similar but it also embeds special control

characters into the text to provide additional features

 Hypertext is an advance on rich text which allows the reader

to jump to different sections within the document or even
jump to a new document
Introduction to Multimedia 35
Text Data Files
Plain text
This is plain text. It is readable by humans. It can contains numbers
(01234) and punctuation (.,#@*&) since it uses the ASCII character set.

Rich text
This is <bold>rich text</bold>.<br><center>It is also readable by
humans but contains additional tags which control the presentation of
the text.</center>

Hypertext
This is <a href=“http://www.w3c.org/”>hypertext</a>. It uses the rich
text format shown above but adds the ability to hyperlink to other
documents.<hr><img src=“logo.gif”>
Introduction to Multimedia 36
Cross Platform Issues
When you build your multimedia project on Windows
platform, and play it back on a Macintosh platform , there
will be some differences.
 Fonts are perhaps the greatest cross-platform concern. If a
specified font does not exist in the target machine, a substitute
must be provided. Some cross-platform applications, e.g.,
Director, allow the developer to specify the mapping of fonts.
 Different encodings on different platform is also a big
problem. Special characters may need to be converted to
bitmaps in order to be display correctly on different platforms.
Different systems and font manufacturers encode different
symbols in the extended character set.
Introduction to Multimedia 37
Advantages and Disadvantages
of using texts

 Advantages
 Is relatively inexpensive to produce

 Present abstract ideas effectively

 Clarifies other media

 Is easily changed or updated

 Disadvantages
 Is less memorable than other visual media

 Requires more attention from the user than other media

 Can be cumbersome

Introduction to Multimedia 38