Implement font-variant-emoji #22118

[dletorey]

Description

Created the font-variant-emoji page documented and added an example

Created links in font-variant shorthand, font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-ligatures, font-variant-numeric and font-variant-position properties.

Also added values fo font-variant-position to font-variant

Updated all the cssxref macro in these pages to be markdown links (based on @hamishwillee's advice) to make links work in github as well as mdn.

Motivation

Documenting the firefox release for {font-variant-emoji](#22118)

Additional details

• Bugzilla URL
• W3 Draft URL
• Related BCD Pull Request

Related issues and pull requests

Fixes #22118

[github-actions]

Preview URLs (8 pages)

• /en-US/docs/Web/CSS/font-variant-alternates
• /en-US/docs/Web/CSS/font-variant-caps
• /en-US/docs/Web/CSS/font-variant-east-asian
• /en-US/docs/Web/CSS/font-variant-emoji
• /en-US/docs/Web/CSS/font-variant-ligatures
• /en-US/docs/Web/CSS/font-variant-numeric
• /en-US/docs/Web/CSS/font-variant-position
• /en-US/docs/Web/CSS/font-variant

Flaws (3)

Note! 6 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Web/CSS/font-variant-ligatures
Title: font-variant-ligatures
Flaw count: 2

• macros:
  • /en-US/docs/Glossary/contextual_forms does not exist
• broken_links:
  • Link points to the page it's already on

---

URL: /en-US/docs/Web/CSS/font-variant-emoji
Title: font-variant-emoji
Flaw count: 1

• broken_links:
  • Is currently http:// but can become https://

External URLs (2)

URL: /en-US/docs/Web/CSS/font-variant-emoji
Title: font-variant-emoji

• https://uxdesign.cc/emojis-in-accessibility-how-to-use-them-properly-66b73986b803 (1 time) (Note! This may be a new URL 👀)
• https://www.unicode.org/reports/tr51/tr51-23.html (1 time) (Note! This may be a new URL 👀)

(comment last updated: 2022-12-15 10:26:59)

[estelle]

Can we include a section on accessibility concerns? https://uxdesign.cc/emojis-in-accessibility-how-to-use-them-properly-66b73986b803 includes some good points. For example, repeated emojis lead to a bad user experience for screen reader users.

[Josh-Cena]

make links work in github as well as mdn.

I'm surprised—the link doesn't work on GitHub anyway, because it's not a FQDN. All it does is to make it "look like" a link, which I'm not sure is any better. We should never be reading the rendered text on GitHub. At the same time Markdown links make the source longer with a lot of redundant text. (I'm starting to see the value in using xref macros myself)

[dipikabh]

Looks good overall, @dletorey! Few things will need updating (plus Estelle's comment).

"See also" should follow sentence casing as in other titles. You seemed to have touched a set of pages where it was incorrect 🙂.

[dipikabh]

@dletorey, adding a note here for you to check my comment in the BCD PR for this property: mdn/browser-compat-data#18381 (comment)

[dletorey]

Can we include a section on accessibility concerns? https://uxdesign.cc/emojis-in-accessibility-how-to-use-them-properly-66b73986b803 includes some good points. For example, repeated emojis lead to a bad user experience for screen reader users.

I have added an accessibilty concerns section to the page.

[dletorey]

@dletorey, adding a note here for you to check my comment in the BCD PR for this property: mdn/browser-compat-data#18381 (comment)

Fixed this and created a new Pull Request

[github-actions]

This pull request has merge conflicts that must be resolved before it can be merged.

[dipikabh]

Looks good, thank you 👍