Kuliah 4

Text and Color

Pokok bahasan: Coky Fauzi Alfi
1. Type function
e-mail : coky.fauzi.alfi@gmail.com
2. Categories of type
weblog : cokyfauzialfi.wordpress.com
3. Type contrast mobile : 0812.192.67.985
4. Text in multimedia
5. HTML character encoding standard
6. Colour theory and models
7. Colour characteristic and theme
8. Colour correction
 Text
...is the basic element of multimedia


Text Function

1. Titles
2. Menus
3. Navigation or Link
4. Content


Printed Page versus Multimedia

Paper-and-Pen Multimedia-and-the Internet

Linear: We turn pages Nonlinear: We can jump back and forth
Single mode: Written Multiple channels: Writing, pictures, sound, animation, and so on.
Black text on white paper Color


Dynamic Relationship

Concordant
Conflicting
Contrasting


Concordant

Life’s but a walking shadow, a poor

player that struts and frets his hour
upon of stage, Using only one type of font without
and then is heard no more; much variety in style, size and weight
it is a tale told by an idiot , full of sound
and fury, signifying nothing.


Conflicting

Life’s but a walking shadow, a poor

player that struts and frets his hour Using two or more type of font that are
upon of stage,
and then is heard no more;
similiar—not really different and not
it is a tale told by an idiot , full of really the same
sound and fury, signifying nothing.


Contrasting

Life’s but a walking shadow, a poor

player that struts and frets his hour
upon of stage,
and then is heard no more; Combining distinct type of font
it is a tale told by an idiot , full of
sound and fury, signifying nothing.


Broad Categories of Font

Serif Sans Serif

Times New Roman Arial
Garamond Myriad
Baskerville Tahoma


Broad Categories of Font

Decorative Script
Algerian Caflisch
Curlz Edwardian
Chiller Segoe

10
Type Contrasts

weight
weight form Direction
Size

Size
form

Direction
weight

Direction
weight FORM
weight FORM

11
Selecting Fonts

Readability
Focus

12
Readability

Using mixed uppercase and lowercase letters

Static text more ease to read than moving text
Reading double-spaced text faster than single-spaced text
Choose a simple typeface
Be consistent

13
Focus
Important information must stand out.

• Use different font or text effects, such as text animation.

• Movement in our peripheral vision attracts attention.
• Use font size to indicate the relative importance of the content.

14
Hyperlinking

A hyperlink is a link between some point in one hypertext

document to a point in either another document or another
place in the same document.

15
Hypertext links are useful in two cases:

1. When the amount of information is very large

2. When the user needs only a small part of the information at any one time

16
Advantages of Hypertext

• Bookmarks
• Easy for search
• Hyperdocuments
• Documents worldwide can be linked

17
Disadvantages of Hypertext

• Need a computer to access the documents

• If navigation aids are not provided, a heavy cognitive load is placed on the
reader; the reader can also become disoriented

18
Navigation Aids

• Backtrack
• Sneak preview
• Highlighting link
• Bread crumbs
• History
• Overview maps
19
Colors
+ =
+ =
+ =
+ + =
- =
- =
- =
20
The Classification of Color

Hue
Color circle, degrees ( )
o

Brightness or Lightness
From white through the grays, %
Saturation
...is a measure of the difference from a gray of the same lightness, %

21
Color in Image Files
GIF
• Produce smaller files
• 256 different colors max.
• Lossless compression
• Sharpness in original image
• Transparent
• Animated
• Poor in gradations of color and
drop shadow
JPG
• Compression/quality
• The file sizes can be very small
• Gradients and soft edges look
good
• Don’t support animation and
transparency
PNG
• 20 % smaller than GIF
• 16.7 million color images
• Faster and better than GIF
• Don’t support animation and
transparency
22
 Terima Kasih
cokyfauzialfi.wordpress.com

23