google/fonts
1
0
Fork 0
mirror of https://github.com/google/fonts.git synced 2024-11-24 01:37:48 +03:00
Code Issues Projects Releases Wiki Activity

GFK Glossary: Title Case axis name in optical_size_axis (#4607)

Browse Source 
* optical_size_axis/term.textproto Title Case name

* optical_size_axis/content.md Title case axis

Other minor copy improvements

Co-authored-by: Elliot Jay Stocks <elliot@elliotjaystocks.com>
This commit is contained in:
Dave Crossland 2022-05-13 09:36:11 -04:00 committed by GitHub
parent 3e1b1ea80b
commit f5d17890ee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
cc-by-sa/knowledge/glossary/terms/optical_size_axis/content.md
View File

@ -1,7 +1,7 @@
“Optical size” (controlled with `font-optical-sizing` or `font-variation-setting: ‘opsz’ VALUE` in CSS) is an [axis](/glossary/axis_in_variable_fonts) found in some [variable fonts](/glossary/variable_fonts). It controls the [font](/glossary/font) file’s [optical size](/glossary/optical_sizes) optimizations.
“Optical Size” (controlled with `font-optical-sizing` or `font-variation-setting: ‘opsz’ VALUE` in CSS) is an [axis](/glossary/axis_in_variable_fonts) found in some [variable fonts](/glossary/variable_fonts). It controls the [font](/glossary/font) file’s [optical size](/glossary/optical_sizes) optimizations.
The [Google Fonts CSS v2 API ](https://developers.google.com/fonts/docs/css2) defines the axis as:
The [Google Fonts CSS v2 API](https://developers.google.com/fonts/docs/css2) defines the axis as:
| Default: | Min: | Max: | Step: |
| --- | --- | --- | --- |
@ -15,9 +15,9 @@ The [Google Fonts CSS v2 API ](https://developers.google.com/fonts/docs/css2) de
</figure>
Optical sizes in a variable font are different versions of a [typeface](/glossary/typeface) optimized for use at singular specific sizes, such as 14 pt or 144 pt. Small (or [body](/glossary/body)) optical sizes tend to have less [stroke](/glossary/stroke) [contrast](/glossary/contrast), more open spacing, and taller [x-heights](/glossary/x_height) than those of their large (or [display](/glossary/display)) counterparts.
Optical sizes in a variable font are different versions of a [typeface](/glossary/typeface) optimized for use at singular specific sizes, such as 14 pt or 144 pt. Small (or [body](/glossary/body)) optical sizes tend to have less [stroke](/glossary/stroke) [contrast](/glossary/contrast), more open and wider spacing, and a taller [x-height](/glossary/x_height) than those of their large (or [display](/glossary/display)) counterparts.
The concept is that the numeric value for this axis should match the rendered font size in typographic points (1/72nd of an inch) in print, although browsers instead match it to the CSS px unit, since they have no concept of physical size. A new CSS attribute was introduced to go along with it: `font-optical-sizing`. The default is `auto` (or we can force it to `none` if we’d prefer to turn it off), and this is supported behavior in all modern browsers.
The concept is that the numeric value for this axis should match the rendered font size in typographic points (1/72nd of an inch) in print, although browsers instead match it to the CSS `px` unit, since they have no concept of physical size. A new CSS attribute was introduced to go along with it: `font-optical-sizing`. The default is `auto`, and this is supported behavior in all modern browsers.
```css
body {
@ -25,7 +25,7 @@ body {
}
```
Alternatively, we can set an explicit value by using `font-variation-settings`, like so:
We can force it to `none` if we’d prefer to turn it off, or we can set an explicit `px` value by using `font-variation-settings`, like so:
```css
body {
@ -36,6 +36,6 @@ h1 {
}
```
The changes made across an optical design axis are intended by typeface designers to optimize the type, but parametric axes can be used to further adjust and fine-tune things. Explore more in our article, [“Introducing parametric axes.”](/lesson/introducing_parametric_axes)
The changes made across an Optical Size axis are intended by typeface designers to optimize the type, but parametric axes can be used to further adjust and fine-tune things. Explore more in our article, [“Introducing parametric axes.”](/lesson/introducing_parametric_axes)
In line with the current CSS spec, the four-character code for this axis should be referenced in lowercase (as only the five axes registered in the OpenType format specification should appear in lowercase). Also, when using the Google Fonts API, the lowercase axes have to appear first in the URL, followed by the uppercase, each in alphabetical order.

2
cc-by-sa/knowledge/glossary/terms/optical_size_axis/term.textproto
View File

@ -1,4 +1,4 @@
name: "Optical size axis (opsz)"
name: "Optical Size axis (opsz)"
excerpt: "An axis found in some variable fonts that controls the font file’s optical size optimizations."
related_lessons: "introducing_variable_fonts"
related_lessons: "designing_with_variable_fonts_in_desktop_apps"