1. Chapter 2: Text
Eyad Alshareef
Eyad Alshareef

2. Topics: Definition of Text Text elements Text usages Font
Working with text
Eyad Alshareef

3. Temporal & Non Temporal Media
Refer to Multimedia elements.
Two Media types:Temporal and Non-Temporal
Temporal Media
The media has an associated time aspect. Example: its view changes with respect to time.
Examples: Audio, video, animation, music etc.
Eyad Alshareef

4. Temporal & Non Temporal Media
Also known as a static media. It has the same representation regardless of time
Examples: texts, graphics, paintings, book etc
Multimedia applications are typically composed of both media
Eyad Alshareef

5. Definition of Text
Text is words and symbols in any form, spoken or written, are the most common system of communication.
Text is used in most Multimedia applications.
With multimedia technology, text can be combined with other media in a powerful and meaningful way to present information and express moods.
Text is the easiest to manipulate.
Eyad Alshareef

6. Text Elements
Based on creating letters, numbers and special characters.
Text elements can be categories into:
Alphabet characters : A - Z
Numbers : 0 - 9
Special characters : Punctuation [. , ; ‘ …] , Sign or Symbols [* & ^ % $ £ ! /\ ~ .…]
Also known Character Sets
May also include special icon or drawing symbols, mathematical symbols, Greek Letter etc.
Eyad Alshareef

7. Text Usages Heading / Title Bullet / list Paragraph Scrolling text
Navigation
Text as graphics
Eyad Alshareef

8. Eyad Alshareef

9. Typefaces, Fonts and Points
The graphic representations of the alphabet, numbers and special character.
Usually vary by type sizes and styles.
FontsParticular size of typefaces
The sizes are measured in points
- One point is 1/72” or inc”
Measuring distance from the top of a capital letters (e.g. ‘A or P’) to the
bottom of a descenders (e.g. ‘y , ‘p’ , ‘q’).
Eyad Alshareef

10. Font A design for a set of characters.
A collection of characters of a single size and style belonging to a particular typeface family.
There is some basic consistency of look that makes the individual characters, regardless of size and style variations, part of the same family.
Eyad Alshareef

11. Eyad Alshareef

12. Eyad Alshareef

13. Font Size
Users may have difficulty reading small text, seeing small objects or targeting small icons and controls with a mouse.
Small fonts can cause eye-strain and make reading difficult or impossible for many users.
Screen elements with fixed sizes may be too small on high-resolution displays or exceed the screen size on small, hand-held devices.
Eyad Alshareef

14. 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
Eyad Alshareef

15. Font Style Bold Underline italic
Refers to whether text is bold, italicized, underlined, or any combination of the three
The term font styler efers to the particular style of textual characters.
Styles are usually standard.
Bold Underline italic
Eyad Alshareef

16. Font Style-Bold
Use bold fonts for emphasis, to highlight important points.
Eyad Alshareef

17. Font Style- Bold
Whole paragraphs of text set in bold type are hard to read.
Eyad Alshareef

18. Font Style-Bold
In some instances it is useful to readers to have titles, proper names, or key terms in a manual within a block of copy highlighted with bold for ease in scanning.
Eyad Alshareef

19. Font Style -Italic
Use italics to emphasize small amounts of text within a block of text.
Avoid long passages in italics.
It is harder to read than normal roman faces.
Eyad Alshareef

20. Font Style -Italic
When they are not a common part of your language, italicize foreign words and phrases.
Eyad Alshareef

21. Font Style- Underline
Underlines are appropriate for section headings and some bibliographical notations.
In web browsers, default settings typically distinguish hyperlinks by underlining them.
Eyad Alshareef

22. Font Categories Fonts can be characterized as Serif Sans serif
Decorative
Eyad Alshareef

23. Font Categories -Serif
Serif characters have a little "flag" or decoration at the end of the letter stroke.
Serif fonts are usually used for documents or screens that have large quantities of text
This is because the serif helps guide
the reader’s eye along the text
Eyad Alshareef

24. Font Categories –San Serif
Sans Serif (sans is French for "without") characters don't have these decorations.
Eyad Alshareef

25. Types of Fonts
For computer displays, Sans Serif fonts considered better because of the sharper contrast.
Examples of San Serif fonts
Times New Roman
Bookman
Rockwell Light
Courier New
Century
Century Gothic
Arial
Comic Sans MS
Impact
Tahoma
Examples of Serif fonts
Eyad Alshareef

26. FD xhp Text Characteristics
This example shows the Times New Roman font
Ascender
Capital Height
x-Height
FD xhp
Point size
p -Height
Serif
Descender
Eyad Alshareef

27. Tracking, Kerning and Leading
Tight
tracking
Loose
tracking Av v A
Kerned
Unkerned
Eyad Alshareef

28. Tracking, Kerning and Leading
Reading Line One
Leading
Ascender : an upstroke on a character
Descender : the down stroke below the baseline of a character
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
Eyad Alshareef

29. Paragraph Alignment The arrangement of text relative to a margin.
Four types of alignment:
Flush left
Flush right
Centered
Justified
Eyad Alshareef

30. Paragraph Alignment –Flush Left
The text is aligned along the left margin, also known as ragged right.
In English and most European languages where words are read left-to-right, text is often aligned ‘flush left’, meaning that the text of a paragraph is aligned on the left-hand side with the right-hand side ragged.
This is the default style of text alignment on the World Wide Web for left-to-right text.
Eyad Alshareef

31. Paragraph Alignment –Flush Right
The text is aligned along the right margin, also known as ragged left.
In other languages that read text right-to-left, such as Arabic and Hebrew, text is commonly aligned ‘flush right’.
Additionally, flush-right alignment is used to set off special text in English, such as attributions to authors of quotes printed in books and magazines, and is often used when formatting tables of data.
Eyad Alshareef

32. Paragraph Alignment -Centered
Text is aligned to neither the left nor right margin; there is an even gap at the end of each line.
This is often used for the title of a work, and for poems and songs.
As with flush-right alignment, centered text is often used to present data in tables.
Eyad Alshareef

33. Paragraph Alignment -Justified
Text is aligned along the left margin, and letter- and word-spacing is adjusted so that the text falls flush with the right margin, also known as full justification.
Eyad Alshareef

34. Sources - Font Software: Word processor Image Editor Hardware: Scanner
OCR-Optical Character Recognition
Other:
Internet
Eyad Alshareef

35. Working with Text
Following are some considerations and guidelines to keep in mind when working with text :
Be Concise
Use Appropriate Fonts
Make it Readable
Consider Type Styles and Colors
Use Restraint and be Consistent
Eyad Alshareef

36. Working with Text -Be Concise
Text should be kept to a minimum unless the application includes a great deal of reference material.
Reading volumes of text on a computer screen is difficult and tiring.
From a design standpoint, text should fill less than half the screen
Eyad Alshareef

37. Working with Text -Use Appropriate Fonts
Fonts are useful in focusing attention on certain test on the screen, enhancing readability, setting a tone (serious, lighthearted), and projecting an image (progressive, conservative).
When choosing a font, always consider the objectives and the audience.
Eyad Alshareef

38. Working with Text -Use Appropriate Fonts
Eyad Alshareef

39. Working with Text -Make it Readable
Although a decorative font maybe attractive but it may also hard to read.
The size of text depends on the application.
Heading and subheadings are used to attract attention and provide the user with quick identification of the screen contents, while text blocks provide the substance.
Eyad Alshareef

40. Working with Text -Make it Readable
Suggested guidelines are as follows :
Eyad Alshareef

41. Working with Text -Make it Readable
Eyad Alshareef

42. Working with Text -Consider Type Styles and Colors
Three common type styles are bold, italic, and underline.
These styles are often used for emphasis in print materials.
In multimedia applications, however, there are more often used to indicate hypertext, or hot words.
Eyad Alshareef

43. Working with Text -Consider Type Styles and Colors
Contrast between the lettering and background also is a very important factor in legibility and readability.
Eyad Alshareef

44. Working with Text -Use Restraint and be Consistent
Although it may be tempting and certainly easy to use various typefaces, sizes, and styles, it is important to exercise restraint.
Be careful to avoid a busy and difficult to read design resulting from too many fonts and type styles on one screen.
In addition, try to maintain consistency in the use of text.
Eyad Alshareef

45. Bitmapped and vector fonts
Fonts can either be stored as bitmapped or vector graphics
Bitmaps font depend to the size and the pixel numbers - File size increases as more sizes are added
Vector fonts can draw any size by scaling the vector drawing primitives mathematically
- File size is much smaller than bitmaps
- TrueType and PostScript are vector font formats

46. Bitmapped and vector fonts
A bitmapped font
A vector font

47. 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

48. 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=“ It uses the rich text format shown above but adds the ability to hyperlink to other documents.<hr><img src=“logo.gif”>

49. Eyad Alshareef