Are we in a  Visual Age? What is Visual Age?
User have come to expect – or derive dual information from type selected & the choice of words  Words represent more than ...
Fonts define Theme & Mood
Type design  Arranging Type  Typography Glyph
Know the   Universal Truths
<ul><li>White on black is easier on the eye than black on white </li></ul><ul><li>Serif fonts are easier to read  </li></u...
Understanding  Fonts
What is san-serif about this font? What is serif about this font?
Vector Font :  Fonts that contain instructions for building outlines from lines and curves which are filled  to create the...
Bitmap Font :  Bitmap fonts contain bitmaps of fonts in them. This a picture of the font at a specific size that has been ...
Post Script Type 1  Open Type  Font Type  No of files req  File extension  Note  .pfb  - Font file  .pfm  - Metric file  ....
Kerning Tracking Line spacing Alignment   Hierarchy Anti-Aliasing Glyphs
glyph names or kerning data  - metadata OpenType fonts may contain more than 65,000 glyphs. An italic 'a' and a roman 'a' ...
 
 
 
 
 
Web-Typography Style guide
Personalization  Font availability  Screen resolution Anti-aliasing available or switched on  Additive vis-à-vis subtracti...
<ul><li>Use fonts which are large compared to more traditional typefaces at same point size </li></ul><ul><li>Alternately ...
 
 
 
How are   you feeling?
I am feeling _ I am feeling -- I am feeling ¯ Brevity brings more focus
Typography  in banners
Space  Text  Animation  Image  Factors at play
Which factor?
 
 
 
 
 
 
 
Web 2.0
 
Is this the beginning?
Nazim Iqbal [email_address]
Upcoming SlideShare
Loading in...5
×

Typography and online communication

3,850

Published on

Studying typography online

Published in: Design, Technology, Art & Photos
2 Comments
7 Likes
Statistics
Notes
  • Hi View my Presentation and Vote if you like :

    http://www.slideshare.net/hairaman/what-makes-a-great-marketer-1864911
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Thank you Nazim. Excellent job. So few slideshares on typography.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
3,850
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
374
Comments
2
Likes
7
Embeds 0
No embeds

No notes for slide

Transcript of "Typography and online communication "

  1. 2. Are we in a Visual Age? What is Visual Age?
  2. 3. User have come to expect – or derive dual information from type selected & the choice of words Words represent more than one meaning Connotative Literary Visual
  3. 4. Fonts define Theme & Mood
  4. 5. Type design Arranging Type Typography Glyph
  5. 6. Know the Universal Truths
  6. 7. <ul><li>White on black is easier on the eye than black on white </li></ul><ul><li>Serif fonts are easier to read </li></ul><ul><li>Sentence in upper case are difficult than sentence case </li></ul><ul><li>Variation of font type, size and color makes it complex </li></ul>Have your own list of universal truth?
  7. 8. Understanding Fonts
  8. 9. What is san-serif about this font? What is serif about this font?
  9. 10. Vector Font : Fonts that contain instructions for building outlines from lines and curves which are filled to create the solid shapes of letters and other glyphs. Can be scaled to virtually any size and still retain smooth edges. Vector formats include TrueType and PostScript Type1 fonts.
  10. 11. Bitmap Font : Bitmap fonts contain bitmaps of fonts in them. This a picture of the font at a specific size that has been optimized to look good at that size. It cannot be scaled bigger without making it look horrendously ugly. Size are usually mentioned.
  11. 12. Post Script Type 1 Open Type Font Type No of files req File extension Note .pfb - Font file .pfm - Metric file .otf - PostScript outlines .ttf - TrueType outlines 2 1 Both .pfb and .pfm must have the same base name. Windows will automatically create the .pfm if a pair of .afm and .inf files with the same base name are used to install the .pfb . Post Script Type 3 Vector / Bitmap True Type .ttf 1 Vector Bitmap 2 .pf3 Vector Vector
  12. 13. Kerning Tracking Line spacing Alignment Hierarchy Anti-Aliasing Glyphs
  13. 14. glyph names or kerning data - metadata OpenType fonts may contain more than 65,000 glyphs. An italic 'a' and a roman 'a' are two different glyphs representing the same underlying character. Kerning is used primarily to fit capital letters, such as T , V , W , and Y , closer to some other capital letters on either side (especially A )
  14. 20. Web-Typography Style guide
  15. 21. Personalization Font availability Screen resolution Anti-aliasing available or switched on Additive vis-à-vis subtractive – eye strain Can you control these factors?
  16. 22. <ul><li>Use fonts which are large compared to more traditional typefaces at same point size </li></ul><ul><li>Alternately use one serif & san-serif font on a page </li></ul><ul><li>Identify consumption pattern Print v/s Web </li></ul><ul><li>Use font from one typographic family </li></ul><ul><li>12px for serif and 14 px for san-serif </li></ul><ul><li>Exaggerated x-heights </li></ul>
  17. 26. How are you feeling?
  18. 27. I am feeling _ I am feeling -- I am feeling ¯ Brevity brings more focus
  19. 28. Typography in banners
  20. 29. Space Text Animation Image Factors at play
  21. 30. Which factor?
  22. 38. Web 2.0
  23. 40. Is this the beginning?
  24. 41. Nazim Iqbal [email_address]
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×