Skip to content

Commit

Permalink
Add Baseline (compatibility) glossary entry (mdn#26676)
Browse files Browse the repository at this point in the history
* Move baseline (typography) glossary page to subpage

* Add baseline glossary disambiguation page

* Add Baseline (compatibility) glossary entry

* Update existing baseline glossary macro calls

* Fix broken internal link

* Fix slug iconsistency

* Apply em dash suggestion from @Rumyra

Co-authored-by: Ruth John <[email protected]>

---------

Co-authored-by: Ruth John <[email protected]>
  • Loading branch information
ddbeck and Rumyra authored May 9, 2023
1 parent 1d052bc commit ea3a289
Showing 8 changed files with 57 additions and 12 deletions.
35 changes: 35 additions & 0 deletions files/en-us/glossary/baseline/compatibility/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
---
title: Baseline (compatibility)
slug: Glossary/Baseline/Compatibility
---

**Baseline** identifies widely-supported web platform features.
Web developers can expect Baseline features to work in contemporary browsers.

A Baseline feature - such as an API, a set of CSS properties, or a JavaScript syntax - is known to work consistently in the current and previous major versions of several well-known browsers (Chrome, Edge, Firefox, and Safari).

## Badges

<!-- TODO: Show Baseline indicator itself, once it has been merged -->
🟢 If you see the green Baseline badge, then you can trust that the feature will work in the browsers' latest and previous major releases.

<!-- TODO: Show the non-Baseline indicator itself, once it has been merged -->
🟡 If you see a yellow badge showing that a feature is not yet Baseline, then do more research and testing with your site's users before relying on that feature, or wait for it to become Baseline.

## Extra considerations

Baseline is a summary guide to support and doesn't cover every situation.
If your site needs to work with a browser's long-term support release, an older device or browser release, or a browser not covered by the Baseline report, then you may need to do your own research or testing.
If Baseline doesn't cover your situation, then consider reading browser compatibility tables on MDN or visiting [caniuse.com](https://caniuse.com/) before committing to a feature.

## Contributing

Baseline is a community effort of the W3C WebDX Community Group and relies on MDN's open source browser compatibility data.
If you have questions, feedback, or want to help update and expand the features covered by Baseline status reports, then go to [web-platform-dx/feature-set](https://github.com/web-platform-dx/feature-set) to participate.

## See also

- [Cross browser testing](/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing)
- [web-platform-dx/feature-set repository](https://github.com/web-platform-dx/feature-set)
- [W3C WebDX Community Group](https://www.w3.org/community/webdx/)
- [mdn/browser-compat-data repository](https://github.com/mdn/browser-compat-data)
11 changes: 4 additions & 7 deletions files/en-us/glossary/baseline/index.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,13 @@
---
title: Baseline
slug: Glossary/Baseline
page-type: glossary-definition
page-type: glossary-disambiguation
---

The **baseline** is a term used in European and West Asian typography meaning an imaginary line upon which the characters of a font rest.
The term **baseline** can have several meanings depending on the context. It may refer to:

The descenders of characters like g and p extend below this line. {{Glossary("glyph", "Glyphs")}} with rounded lower and upper extents like C or 3 slightly extend below it.

East Asian scripts have no baseline. Their glyphs are placed in a square box without ascenders or descenders.
{{GlossaryDisambiguation}}

## See also

- [Baseline](<https://en.wikipedia.org/wiki/Baseline_(typography)>) on Wikipedia
- [CSS Box Alignment](/en-US/docs/Web/CSS/CSS_Box_Alignment#types_of_alignment) on MDN
- [Baseline](https://en.wikipedia.org/wiki/Baseline) on Wikipedia
13 changes: 13 additions & 0 deletions files/en-us/glossary/baseline/typography/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
---
title: Baseline (typography)
slug: Glossary/Baseline/Typography
page-type: glossary-definition
---
The **baseline** is a term used in European and West Asian typography meaning an imaginary line upon which the characters of a font rest.

{{GlossaryDisambiguation}}

## See also

- [Baseline](https://en.wikipedia.org/wiki/Baseline_(typography)) on Wikipedia
- [CSS Box Alignment](/en-US/docs/Web/CSS/CSS_Box_Alignment#types_of_alignment) on MDN
2 changes: 1 addition & 1 deletion files/en-us/web/svg/attribute/alignment-baseline/index.md
Original file line number Diff line number Diff line change
@@ -48,7 +48,7 @@ You can use this attribute with the following SVG elements:
- `auto` {{deprecated_inline}}
- : The value is the dominant-baseline of the script to which the character belongs - i.e., use the dominant-baseline of the parent.
- `baseline`
- : Uses the {{Glossary("dominant baseline")}} choice of the parent. Matches the box's corresponding {{Glossary("baseline")}} to that of its parent.
- : Uses the {{Glossary("dominant baseline")}} choice of the parent. Matches the box's corresponding {{Glossary("baseline/typography", "baseline")}} to that of its parent.
- `before-edge` {{deprecated_inline}}
- : The alignment-point of the object being aligned is aligned with the "before-edge" baseline of the parent text content element.
- `text-bottom`
2 changes: 1 addition & 1 deletion files/en-us/web/svg/attribute/font-size/index.md
Original file line number Diff line number Diff line change
@@ -7,7 +7,7 @@ browser-compat: svg.attributes.presentation.font-size

{{SVGRef}}

The **`font-size`** attribute refers to the size of the font from {{Glossary("baseline")}} to baseline when multiple lines of text are set solid in a multiline layout environment.
The **`font-size`** attribute refers to the size of the font from {{Glossary("baseline/typography", "baseline")}} to baseline when multiple lines of text are set solid in a multiline layout environment.

> **Note:** As a presentation attribute, `font-size` can be used as a CSS property. See the {{cssxref("font-size", "CSS font-size")}} property for more information.
2 changes: 1 addition & 1 deletion files/en-us/web/svg/attribute/ideographic/index.md
Original file line number Diff line number Diff line change
@@ -9,7 +9,7 @@ browser-compat: svg.elements.font-face.ideographic

{{SVGRef}}{{Deprecated_Header}}

The **`ideographic`** attribute indicates the alignment coordinate for {{Glossary("glyphs")}} to achieve ideographic {{Glossary("baseline")}} alignment for horizontally oriented glyph layouts. The value is an offset in the font coordinate system.
The **`ideographic`** attribute indicates the alignment coordinate for {{Glossary("glyphs")}} to achieve ideographic {{Glossary("baseline/typography", "baseline")}} alignment for horizontally oriented glyph layouts. The value is an offset in the font coordinate system.

You can use this attribute with the following SVG elements:

2 changes: 1 addition & 1 deletion files/en-us/web/svg/attribute/v-hanging/index.md
Original file line number Diff line number Diff line change
@@ -9,7 +9,7 @@ browser-compat: svg.elements.font-face.v-hanging

{{SVGRef}}{{Deprecated_Header}}

The **`v-hanging`** attribute indicates the alignment coordinate for {{Glossary("glyph", "glyphs")}} to achieve hanging {{Glossary("baseline")}} alignment. The value is an offset in the font coordinate system relative to the glyph-specific {{SVGAttr("vert-origin-x")}} attribute.
The **`v-hanging`** attribute indicates the alignment coordinate for {{Glossary("glyph", "glyphs")}} to achieve hanging {{Glossary("baseline/typography", "baseline")}} alignment. The value is an offset in the font coordinate system relative to the glyph-specific {{SVGAttr("vert-origin-x")}} attribute.

You can use this attribute with the following SVG elements:

2 changes: 1 addition & 1 deletion files/en-us/web/svg/attribute/v-ideographic/index.md
Original file line number Diff line number Diff line change
@@ -9,7 +9,7 @@ browser-compat: svg.elements.font-face.v-ideographic

{{SVGRef}}{{Deprecated_Header}}

The **`v-ideographic`** attribute indicates the alignment coordinate for {{Glossary("glyphs")}} to achieve ideographic {{Glossary("baseline")}} alignment for vertically oriented glyph layouts. The value is an offset in the font coordinate system relative to the glyph-specific {{SVGAttr("vert-origin-x")}} attribute.
The **`v-ideographic`** attribute indicates the alignment coordinate for {{Glossary("glyphs")}} to achieve ideographic {{Glossary("baseline/typography", "baseline")}} alignment for vertically oriented glyph layouts. The value is an offset in the font coordinate system relative to the glyph-specific {{SVGAttr("vert-origin-x")}} attribute.

You can use this attribute with the following SVG elements:

0 comments on commit ea3a289

Please sign in to comment.