Просмотр исходного кода

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 лет назад
Родитель
Сommit
9597beeca3

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

@@ -4,7 +4,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Ben Weiner"
   name: "Ben Weiner"
-  personal_site: ""
+  personal_site: "https://readingtype.org.uk"
 }
 }
 contributors {
 contributors {
   name: "Bram Stein"
   name: "Bram Stein"
@@ -16,7 +16,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Cassidy Curtis"
   name: "Cassidy Curtis"
-  personal_site: ""
+  personal_site: "http://otherthings.com"
 }
 }
 contributors {
 contributors {
   name: "Cosimo Lupo"
   name: "Cosimo Lupo"
@@ -24,7 +24,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Darrell Penta"
   name: "Darrell Penta"
-  personal_site: ""
+  personal_site: "https://linkedin.com/in/darrellpenta"
 }
 }
 contributors {
 contributors {
   name: "Dave Crossland"
   name: "Dave Crossland"
@@ -64,7 +64,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Hilary Palmen"
   name: "Hilary Palmen"
-  personal_site: ""
+  personal_site: "https://twitter.com/hilarypalmen"
 }
 }
 contributors {
 contributors {
   name: "Jamie Clarke"
   name: "Jamie Clarke"
@@ -112,15 +112,15 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Minjoo Ham"
   name: "Minjoo Ham"
-  personal_site: ""
+  personal_site: "http://minjooham.com/"
 }
 }
 contributors {
 contributors {
   name: "Min-Young Kim"
   name: "Min-Young Kim"
-  personal_site: ""
+  personal_site: "https://www.instagram.com/mintoming/"
 }
 }
 contributors {
 contributors {
   name: "Nick Sherman"
   name: "Nick Sherman"
-  personal_site: ""
+  personal_site: "https://nicksherman.com"
 }
 }
 contributors {
 contributors {
   name: "Niteesh Yadav"
   name: "Niteesh Yadav"
@@ -128,11 +128,11 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Oliver Schöndorfer"
   name: "Oliver Schöndorfer"
-  personal_site: ""
+  personal_site: "https://pimpmytype.com"
 }
 }
 contributors {
 contributors {
   name: "Piper Haywood"
   name: "Piper Haywood"
-  personal_site: ""
+  personal_site: "https://piperhaywood.com"
 }
 }
 contributors {
 contributors {
   name: "Richard Rutter"
   name: "Richard Rutter"
@@ -148,7 +148,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Saki Mafundikwa"
   name: "Saki Mafundikwa"
-  personal_site: ""
+  personal_site: "http://www.sakimafundikwa.com"
 }
 }
 contributors {
 contributors {
   name: "Santiago Orozco"
   name: "Santiago Orozco"
@@ -176,7 +176,7 @@ contributors {
 }
 }
 contributors {
 contributors {
   name: "Tom Muller"
   name: "Tom Muller"
-  personal_site: ""
+  personal_site: "https://www.hellomuller.com"
 }
 }
 contributors {
 contributors {
   name: "Trent Walton"
   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.
 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;`.
 [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
 Regular, Bold
 (2 variants on 1 axis, made from 2 sources)
 (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
 ## Type Palette #2
 Regular, Semibold, Bold
 Regular, Semibold, Bold
 (3 variants on 1 axis, made from 2 sources)
 (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
 ## Type Palette #3
 Regular, Semibold, Bold, Condensed Bold
 Regular, Semibold, Bold, Condensed Bold
 (4 variants on 2 axes, made from 3 sources)
 (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
 ## Type Palette #4
 Regular, Semibold, Bold, Narrow, Condensed Bold
 Regular, Semibold, Bold, Narrow, Condensed Bold
 (5 variants on 2 axes, made from 4 sources)
 (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
 ## Type Palette #5
 Regular, Semibold, Bold, Narrow, Narrow Semibold, Narrow Bold, Condensed Bold
 Regular, Semibold, Bold, Narrow, Narrow Semibold, Narrow Bold, Condensed Bold
 (7 variants on 2 axes, made from 4 sources)
 (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.
 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: "optimizing_typographic_space_with_variable_fonts"
 lessons: "interactive_animations_with_variable_fonts"
 lessons: "interactive_animations_with_variable_fonts"
 lessons: "factors_that_influence_the_efficiency_of_variable_web_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."