Browse Source

Further refinements ahead of Q3 launch (#5464)

* Excerpt for “CJK”

* Rel. lesson for “CJK”

* related_lessons for “Alphabet”

* Excerpt for “Alphabet”

* related_lessons for “Designspace”

* Excerpt for “Designspace”

* related_lessons in “Tofu”

* Excerpt for “Tofu”

* related_lessons for “Rag”

* Excerpt for “Rag”

* related_lessons for “Letters”

* Excerpt for “Letters”

* related_lessons for “Reflow”

* Excerpt for “Reflow”

* related_lessons for “Emoji”

* Excerpt for “Emoji”

* Correcting case in `type_history` topic

* Revised content for `variable_fonts_are_here`

* Revised content for `web_font_comparisons_variable_vs_static`

* Revised content for `optimizing_typographic_space_with_variable_fonts`

* Revised content for `interactive_animations_with_variable_fonts`

* Revised content for `factors_that_influence_the_efficiency_of_variable_web_fonts`

* New VF image files from Nick

* Turning full GFK URLs into proper internal format

* Placing Nick’s new VF illustrations

* Excerpt for “Switching...”

* Editing placeholder ALT text everywhere

* Fixing broken URLs in Nick’s articles

* Fixing “legibility” and “readability” URLs in Darrell’s article

* New `thumbnail` SVGs for Nick’s module

* New module ordering for homepage

* New thumbnails (+ references) for History module

* Updating `color` term to differentiate from color fonts

* Correcting `related_terms` for Hangeul articles

* Module desc. for Hangeul

* Numerous copy (mainly punc.) tweaks to Hangeul articles

* 5 × Hangeul article `excerpt`s

* All ACTUAL alt text, everywhere!

* All ACTUAL `excerpt`s, everywhere!

* Renaming “Hangeul” module to “Designing Hangeul”

* More format tweaking for Hangeul articles

* Prev/next lessons for Nick’s module

* Temporarily removing problematic GIFs

* Adding `thumbnail.svg` back in

* Formatting fixes for Nick’s VF table Markdown

* VF module excerpt from Nick

* Additions to `kerning` glossary term from Thomas Phinney

* New URLs for contributors
Elliot Jay Stocks 2 years ago
parent
commit
9597beeca3

+ 11 - 11
cc-by-sa/knowledge/contributors.textproto

@@ -4,7 +4,7 @@ contributors {
 }
 contributors {
   name: "Ben Weiner"
-  personal_site: ""
+  personal_site: "https://readingtype.org.uk"
 }
 contributors {
   name: "Bram Stein"
@@ -16,7 +16,7 @@ contributors {
 }
 contributors {
   name: "Cassidy Curtis"
-  personal_site: ""
+  personal_site: "http://otherthings.com"
 }
 contributors {
   name: "Cosimo Lupo"
@@ -24,7 +24,7 @@ contributors {
 }
 contributors {
   name: "Darrell Penta"
-  personal_site: ""
+  personal_site: "https://linkedin.com/in/darrellpenta"
 }
 contributors {
   name: "Dave Crossland"
@@ -64,7 +64,7 @@ contributors {
 }
 contributors {
   name: "Hilary Palmen"
-  personal_site: ""
+  personal_site: "https://twitter.com/hilarypalmen"
 }
 contributors {
   name: "Jamie Clarke"
@@ -112,15 +112,15 @@ contributors {
 }
 contributors {
   name: "Minjoo Ham"
-  personal_site: ""
+  personal_site: "http://minjooham.com/"
 }
 contributors {
   name: "Min-Young Kim"
-  personal_site: ""
+  personal_site: "https://www.instagram.com/mintoming/"
 }
 contributors {
   name: "Nick Sherman"
-  personal_site: ""
+  personal_site: "https://nicksherman.com"
 }
 contributors {
   name: "Niteesh Yadav"
@@ -128,11 +128,11 @@ contributors {
 }
 contributors {
   name: "Oliver Schöndorfer"
-  personal_site: ""
+  personal_site: "https://pimpmytype.com"
 }
 contributors {
   name: "Piper Haywood"
-  personal_site: ""
+  personal_site: "https://piperhaywood.com"
 }
 contributors {
   name: "Richard Rutter"
@@ -148,7 +148,7 @@ contributors {
 }
 contributors {
   name: "Saki Mafundikwa"
-  personal_site: ""
+  personal_site: "http://www.sakimafundikwa.com"
 }
 contributors {
   name: "Santiago Orozco"
@@ -176,7 +176,7 @@ contributors {
 }
 contributors {
   name: "Tom Muller"
-  personal_site: ""
+  personal_site: "https://www.hellomuller.com"
 }
 contributors {
   name: "Trent Walton"

+ 2 - 0
cc-by-sa/knowledge/glossary/terms/kerning_kerning_pairs/content.md

@@ -9,4 +9,6 @@ Kerning is the manual adjustment of the spacing between two specific [glyphs](/g
 
 Novice [typographers](/glossary/typographer) mistakenly talk about kerning when they actually mean [tracking (or “letter-spacing” in CSS)](/glossary/tracking_letter_spacing). Kerning is all about the customized spacing between two particular glyphs, whereas tracking is the spacing between glyphs applied to an entire piece of text.
 
+Kerning was originally only applied in pairs, but most modern fonts use class kerning. Letters with related shapes form a class so they can be kerned as a group, resulting in much more kerning with much less data stored in the font. For example, instead of just kerning V to A, V and W might be in one class, and A and all its accented variants in another class.
+
 [Turning on “kerning” via OpenType in CSS](/lesson/manual_kerning_is_rarely_required) enables the kerning pair data already in the font file. Note that it’s turned on by default in most modern browsers, but can be disabled with `font-kerning: none;`.

+ 35 - 35
cc-by-sa/knowledge/modules/using_variable_fonts_on_the_web/lessons/web_font_comparisons_variable_vs_static/content.md

@@ -10,61 +10,61 @@ Load time estimates are based on a standard of 500 kB per second for transfer ti
 Regular, Bold
 (2 variants on 1 axis, made from 2 sources)
 
-|  | w/ static fonts | w/ variable fonts | total savings | % savings
-|:--|:--|:--|
-| # of font files | 2 | 1 | 1 | 50%
-| Total file size | 27 kB | 17 kB | 10 kB | 37%
-| Transfer time | 0.05 sec | 0.03 sec | 0.02 sec | 37%
-| Additional latency | 0.2 sec | 0.1 sec | 0.1 sec | 50%
-| Total load time | 0.25 sec | 0.13 sec | 0.12 sec | 47%
+|  | w/ static fonts | w/ variable fonts | total savings | % savings |
+|:--|:--|:--|:--|:--|
+| # of font files | 2 | 1 | 1 | 50% |
+| Total file size | 27 kB | 17 kB | 10 kB | 37% |
+| Transfer time | 0.05 sec | 0.03 sec | 0.02 sec | 37% |
+| Additional latency | 0.2 sec | 0.1 sec | 0.1 sec | 50% |
+| Total load time | 0.25 sec | 0.13 sec | 0.12 sec | 47% |
 
 ## Type Palette #2
 Regular, Semibold, Bold
 (3 variants on 1 axis, made from 2 sources)
 
-|  | w/ static fonts | w/ variable fonts | total savings | % savings
-|:--|:--|:--|
-| # of font files | 3 | 1 | 2 | 67%
-| Total file size | 41 kB | 17 kB | 24 kB | 59%
-| Transfer time | 0.08 sec | 0.03 sec | 0.05 sec | 59%
-| Additional latency | 0.3 sec | 0.1 sec | 0.2 sec | 67%
-| Total load time | 0.38 sec | 0.13 sec | 0.25 sec | 65%
+|  | w/ static fonts | w/ variable fonts | total savings | % savings |
+|:--|:--|:--|:--|:--|
+| # of font files | 3 | 1 | 2 | 67% |
+| Total file size | 41 kB | 17 kB | 24 kB | 59% |
+| Transfer time | 0.08 sec | 0.03 sec | 0.05 sec | 59% |
+| Additional latency | 0.3 sec | 0.1 sec | 0.2 sec | 67% |
+| Total load time | 0.38 sec | 0.13 sec | 0.25 sec | 65% |
 
 ## Type Palette #3
 Regular, Semibold, Bold, Condensed Bold
 (4 variants on 2 axes, made from 3 sources)
 
-|  | w/ static fonts | w/ variable fonts | total savings | % savings
-|:--|:--|:--|
-| # of font files | 4 | 1 | 3 | 75%
-| Total file size | 55 kB | 17 kB | 38 kB | 69%
-| Transfer time | 0.11 sec | 0.03 sec | 0.08 sec | 69%
-| Additional latency | 0.4 sec | 0.1 sec | 0.3 sec | 75%
-| Total load time | 0.51 sec | 0.13 sec | 0.38 sec | 74%
+|  | w/ static fonts | w/ variable fonts | total savings | % savings |
+|:--|:--|:--|:--|:--|
+| # of font files | 4 | 1 | 3 | 75% |
+| Total file size | 55 kB | 17 kB | 38 kB | 69% |
+| Transfer time | 0.11 sec | 0.03 sec | 0.08 sec | 69% |
+| Additional latency | 0.4 sec | 0.1 sec | 0.3 sec | 75% |
+| Total load time | 0.51 sec | 0.13 sec | 0.38 sec | 74% |
 
 ## Type Palette #4
 Regular, Semibold, Bold, Narrow, Condensed Bold
 (5 variants on 2 axes, made from 4 sources)
 
-|  | w/ static fonts | w/ variable fonts | total savings | % savings
-|:--|:--|:--|
-| # of font files | 5 | 1 | 4 | 80%
-| Total file size | 71 kB | 32 kB | 39 kB | 55%
-| Transfer time | 0.14 sec | 0.06 sec | 0.08 sec | 55%
-| Additional latency | 0.5 sec | 0.1 sec | 0.4 sec | 80%
-| Total load time | 0.64 sec | 0.16 sec | 0.48 sec | 74%
+|  | w/ static fonts | w/ variable fonts | total savings | % savings |
+|:--|:--|:--|:--|:--|
+| # of font files | 5 | 1 | 4 | 80% |
+| Total file size | 71 kB | 32 kB | 39 kB | 55% |
+| Transfer time | 0.14 sec | 0.06 sec | 0.08 sec | 55% |
+| Additional latency | 0.5 sec | 0.1 sec | 0.4 sec | 80% |
+| Total load time | 0.64 sec | 0.16 sec | 0.48 sec | 74% |
 
 ## Type Palette #5
 Regular, Semibold, Bold, Narrow, Narrow Semibold, Narrow Bold, Condensed Bold
 (7 variants on 2 axes, made from 4 sources)
 
-|  | w/ static fonts | w/ variable fonts | total savings | % savings
-|:--|:--|:--|
-| # of font files | 7 | 1 | 6 | 86%
-| Total file size | 102 kB | 32 kB | 70 kB | 69%
-| Transfer time | 0.2 sec | 0.06 sec | 0.14 sec | 69%
-| Additional latency | 0.7 sec | 0.1 sec | 0.6 sec | 86%
-| Total load time | 0.9 sec | 0.16 sec | 0.74 sec | 82%
+|  | w/ static fonts | w/ variable fonts | total savings | % savings |
+|:--|:--|:--|:--|:--|
+| # of font files | 7 | 1 | 6 | 86% |
+| Total file size | 102 kB | 32 kB | 70 kB | 69% |
+| Transfer time | 0.2 sec | 0.06 sec | 0.14 sec | 69% |
+| Additional latency | 0.7 sec | 0.1 sec | 0.6 sec | 86% |
+| Total load time | 0.9 sec | 0.16 sec | 0.74 sec | 82% |
 
 
 As you can tell from the numbers above, variable fonts can offer significant improvements in performance compared to using multiple static fonts. So even if a set of static fonts allows you the design flexibility you need, your website can still benefit from delivering the equivalent variants with variable fonts.

+ 1 - 1
cc-by-sa/knowledge/modules/using_variable_fonts_on_the_web/module.textproto

@@ -4,4 +4,4 @@ lessons: "web_font_comparisons_variable_vs_static"
 lessons: "optimizing_typographic_space_with_variable_fonts"
 lessons: "interactive_animations_with_variable_fonts"
 lessons: "factors_that_influence_the_efficiency_of_variable_web_fonts"
-excerpt: "INSERT_EXCERPT"
+excerpt: "Variable fonts are now a reality for use in mainstream typography, especially on the web. While they are often associated with cutting edge experimentation, they also offer many practical benefits. In these articles, we explore ways to use the technology for improvements in both the design and technical implementation of almost any project."