1. Objectives
At the end of this chapter the reader will be able to:
•Recognize the importance of word choice.
•Describe the difference between typeface and a font .
•Find sources for free and shareware fonts.
•Define Hyper media, hypertext, links, anchors.
2. Structure
1. Introduction
2. Power of Meaning
3. About fonts and Faces
4. Using text in Multimedia
5. Computers and Text
6. Font editing and Design tools
7. Hypermedia and Hypertext
4. Using symbols for communication relatively recent - 6,0000 years old
15th Century- Johann Gutenberg printing press revolutionized information.
But today, text and the ability to read are doorways to power and
Knowledge.
Reading and writings are expected necessary skills.
Recently - another revolution - the World Wide Web and its native language
- HTML
7. A typeface is a family of graphic characters that includes many type sizes
and styles (such as Times, Arial, Helvetica)
A font is a collection of characters of a single size and style belonging to a
typeface family (such as bold, italic)
Font sizes are in points 1 point = 1/72 inch
(measured from top to bottom of descenders in capital letter)
X-height is the height of the lower case letter x
11. Computers can
adjust the line spacing (called leading)
leading
and
the space between pairs of letters, called kerning
12. PostScript, TrueType and Master fonts can be altered.
Bitmapped fonts cannot be altered
The computer draws or rasterizes a letter on the screen with
pixels or dots.
13. When type was set by hand, the type for a font was kept in a drawer or case,
The upper drawer held the capital letters, and the lower drawer held the
smaller letters
From this we get the terms uppercase and lowercase
In online messaging, use of all uppercase letters is considered to be
“YELLING” or “SHOUTING”.
14. Password, and paths in a URL are case sensitive ( that is “home” is different
from “HOME”)
It is easier to read words that have a mixture of upper and lower case letters
rather than all upper case.
Placing an Uppercase letter in the middle of the word ,called an Intercap, a
trend that emerged from computer programming community.
Example : middleName,endOfChar
15. Type either has a little decoration at the end of the letter - called
a serif
or it doesn’t - sans serif ( “sans” from the French meaning
without)
Examples ( Times - serif “T” )
( Arial - sans serif “T”)
Use what is appropriate to convey your message
16. WYSIWYG - What you see is what you get!
Aim for a balance between too much text and too little.
Make web pages no more than 1 to 2 screenfuls of text
Bring the user to the destination with as few actions as possible.
Use menu text accompanied by a single action .This requires little training
and is clean and immediate.
Use text for titles, for menus, for navigations, and for content.
17. From a design perspective, your font choice font size no. of headlines you
place on a particular screen must be related both to complexity of your
message and to its venue.
If the messages are a part of interactive website where the user is seeking
information ,lots of information can be packed on to the screen.(too little
text on each page could be annoying, as user requires to unnecessary wait
and click mouse. )
When creating Public Presentations, rather than having lots of text
contents must be organized into small points, large fonts and lots of white
spaces.
18. Use the most legible font available
Use as few different faces as possible
( too many called “ransom-note”) –Typography.
Use bold and italics to convey meaning.
Adjust line spacing ( leading).
Adjust the spacing between letters in headings to remove gaps.
Use colors and background to make type stand out.
Use meaningful word for links and menus.
19. Anti-aliasing or dithering blends colors along the edges of letters to create
gentle effect.
Experiment with Drop Shadows.
Surround headlines with white space.
Try attention grabbing effect with color, word art or large drop letters at
the beginning of text.
Try using Drop Caps and Small Caps.
If one is using centre alignment, Then width of the line should be small.
20. Learn to accept Criticism.(Double check your font style/size with others
opinions.)
Use meaningful words or phrases and for links and menu items.
Text links on web pages can accent your message.(ie avoid using red for
text and iridecent green for underline)
Bold or emphasize the text to highlight ideas or concept but do not make
text look like a hyperlink when it is not.
On web page, put vital text elements and menu in the top 320 pixels.
21. A Multimedia project or web site should include:
content or information.
navigation tools such as menus, mouse clicks, key presses or touch
screen.
some indication or map of where the user is in the presentation
22. Buttons are objects that make things happen when they are clicked.
Use common button shapes and sizes.
Label them clearly
And
BE SURE THEY WORK!
23. Reading from a computer screen is slower than from a book.
People blink 3-5 times/minute, using a computer and 20-25 times/minute
reading a book.
This reduced eye movement causes fatigue, dryness .
Try to present only a few paragraphs per page with font that’s legible.
Display whole paragraph on screen and avoid breaks in between
paragraphs.
24. Monitor use wider-than-tall aspect ratios called landscape.
Most books use taller-than- wide orientation, called portrait.
Don’t try to shrink a full page onto a monitor
Portrait Landscape
25. Four possible solutions to work with a block of text that is taller than what
will fit :
1. Put the text in a scrolling field (Web Browsers).
2. Put text into a single field or graphic image in a project widow and
let the user move up and down based on command.
3. Break the text into fields that fit on monitor – sized pages and
design control buttons to flip through the pages.
4. Design the project for a special monitor that’s taller than its width
26. eBooks are books digitized and formatted to be read using a E-Reader.
E- Readers display text, graphics and multimedia– most using E-Ink
screens between 5” and 10“ diagonal, some with touch screen, some with
WiFi and some with 3G Connectivity.
Ex: iPad, Sony Reader, Google Nexus,CyBook,Jet Book, Kindle …….
The E- Ink screen is a technology for “Electronic Paper”, designed to
imitate the appearance of ordinary ink on paper.
But e-Ink is not required to read books, as they can be viewed on most
computers and many personal Digital Assistants.
27. The standard document format used for displaying text pages on the Web
is called Hyper Text Markup Language.
We can specify typefaces, size,color and other properties by “Marking Up”
the text in document using Tags.
Ex : <B> This Content is Bold </B>
Cascading Style Sheets work in conjunction with HTML and provide Fine
tuning and control of text and layout.
HTML Version 5 is a redesign that stretches into multimedia delivery
tool, making HTML no longer just a text display tool with assorted
attchment and plugged in objects.(+Introduction of <CANVAS>)
28. During the infancy of the Macintosh Computer's monitor H/W, Apple
chose to use a screen resolution of 72Pixels per Inch which was a standard
measurement of printing industry.
Also each pixel was made square shaped, providing even measurements in
all directions.
Later Macintosh provided VGA video standard set for PC with 96 pixels per
inch.
29. Apple - Adobe PostScript page description font language
describes an image in terms of mathematical constructs (Bezier curves)
Can be scaled larger or smaller
PostScript fonts can be drawn much faster than the old fashioned way.
There are 2 kinds of PostScript fonts : * Type3 ** Type1 .
There are over 6000 Type1 fonts and they contain Hints (Special
instruction for grid fitting to help improve resolution.)
30. Apple and Macintosh announced a joint effort to develop a “better and
faster” font methodology – “True Type”.
In addition to printing smooth characters, it could also draw characters to
a low resolution monitor.
It was based on Apple Technology, it was licensed to Microsoft.
Adobe and Microsoft then developed a new and improved font
managament system incorporating the features of PostScript and TrueType
called the “Open Type”.
A free publicly available international standard.
The wars came to an end.
31. Typefaces are created at Foundry, a term much like case, that has carried
over from times, when lead was poured into moulds to make letter faces.
Special Interest Groups (SIG) at America Online where people enjoy
designing and making interesting font, post them online for others to
download.
Ex : CocaCola,Sphagatti,Kerouac
Sites :
www.typequarry.com
www.oldfonts.com
www.myfonts.com
www.will-barris.com
32. The ASCII (American Standard Code for Information Interchange)
Character set :
Is a 7 bit character encoding system commonly used by computer system.
ASCII assigns a number or value to 128 characters, including upper
case, lower case, punctuation marks, Arabic numbers and mathematical
symbols.
It also includes characters used for device control messages like carriage
return, tab and so on.
Was invented and standardized for analog teletype communication early
in the age of bits and bytes.
33. A Byte consists of 8 bits.
ASCII uses only 7 bits to code 128 characters, the 8th bit is left unused.
This extra bit allows to encode another 128 values for an extended
character set.
This was filled by ANSI(American National Standards Institute) standard
characters.
34. Unicode – a 16 bit architecture of Multilingual text and character.
Originally accommodated up to about 65000 characters to include
characters to include characters from all known languages and alphabets
in the world.
Several languages share a set of symbols that have historically related
derivation, the shared symbols of each language are unified into collection
of symbols- Scripts
A single script can work for many languages.
Unicode standard includes more than 180000 Han Characters as well as
obsolete alphabets such as Cuneiform, Hieroglyphs and Ancient Han
Characters.