change serif graphic

Author: John Daggett

css3-fonts/Fonts.html

@@ -79,7 +79,7 @@
 
    <h1 id=css-fonts>CSS Fonts Level 3</h1>
 
-   <h2 class="no-num no-toc" id=longstatus>Editor's Draft 22 May 2008</h2>
+   <h2 class="no-num no-toc" id=longstatus>Editor's Draft 23 May 2008</h2>
 
    <dl id=authors>
     <dt>This version:
@@ -336,11 +336,59 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
 
   <h2 id=introduction><span class=secno>1. </span>Introduction</h2>
 
-  <p>Font properties determine which fonts are used during rendering. Fonts
-   represent collections of letterforms, or glyphs, that uniquely describe
-   the visual appearance of the underlying characters. Typographic traditions
-   vary across the globe so there is no unique way to classify all fonts
-   across languages and cultures. For even common Latin letters, wide
+  <div class=note>
+   <p>Rework into different sections, change emphasis more to how CSS relates
+    to fonts.</p>
+
+   <ul></ul>
+
+   <p>Introduction</p>
+
+   <ul>
+    <li>Introduction
+
+    <li>Font families as groups of faces with different styles.
+
+    <li>Common style variations, weight, width, italics
+
+    <li>CSS uses separates font family name from style characteristics
+
+    <li>Allows webpages to appear similarly with different sets of available
+     fonts
+
+    <li>Set of available fonts can be expanded using @font-face
+
+    <li>Defines a set of resources that can be downloaded when needed
+
+    <li>Can also be used to create composite fonts for different scripts
+   </ul>
+
+   <ul></ul>
+
+   <p>Typography Background</p>
+
+   <ul>
+    <li>Wide variation in character forms, glyphs
+
+    <li>Use of diacritics adds complications to even "simple" alphabets
+
+    <li>Examples from Czech, Slovak, African romanizations
+
+    <li>Vietnamese stacking example
+
+    <li>General use of ligatures
+
+    <li>Required for languages such as Arabic
+
+    <li>Problems with creating "universal fonts"
+   </ul>
+  </div>
+
+  <p>Font properties in CSS determine which fonts are used when rendering
+   text. Fonts represent collections of letterforms, or glyphs, that uniquely
+   describe the visual appearance of the underlying characters. Typographic
+   traditions vary across the globe so there is no unique way to classify all
+   fonts across languages and cultures. For even common Latin letters, wide
    variations are possible:
 
   <div class=figure><img src=aaaaaa.png>
@@ -350,11 +398,15 @@ <h2 id=introduction><span class=secno>1. </span>Introduction</h2>
   <p>Differences in the anatomy of letterforms is one way to distinguish
    fonts. For Latin fonts, flourishes at the ends of a character's main
    strokes, or serifs, can distinguish a font from those without. Similar
-   comparisons exist in non-Latin fonts. For Japanese fonts, a Mincho face
-   contains tapered strokes while a Gothic face does not:
+   comparisons exist in non-Latin fonts between fonts with tapered strokes
+   and those using primarily uniform strokes:
 
   <div class=figure><img src=serifvssansserif.png>
-   <p class=caption>Classifying by letterform style</p>
+   <p class=caption>Letterforms with and without serifs</p>
+  </div>
+
+  <div class=figure><img src=minchovsgothic.png>
+   <p class=caption>Similar groupings for Japanese typefaces</p>
   </div>
 
   <p>Fonts contain letterforms and the data needed to map characters to these
@@ -738,12 +790,12 @@ <h3 id=font-weight><span class=secno>2.2 </span>Font weight: the &lsquo;<a
    common variations in different locales:
 
   <p>Quite often there are only a few weights available for a particular font
-   family. When weights other than ones available are specified they are
-   automatically mapped onto one of the available weights. In general, bold
-   weights map to faces with heavier weights and light weights map to faces
-   with lighter weights. For the precise defintion, see the section below on
-   font matching. Weights for which no faces exist are shown in grey in the
-   examples below:
+   family. When a weight is specified for which no face exists, a face with a
+   nearby weight is used. In general, bold weights map to faces with heavier
+   weights and light weights map to faces with lighter weights (see the font
+   matching section below for a precise definition). The examples here
+   illustrate which face is used for different weights, grey indicates a face
+   for that weight does not exist so a face with a nearby weight is used:
 
   <div class=figure><img src=optimaweights.png>
    <p class=caption>Weight mappings for a font family with 400, 700 and 900