Making WordPress.org

Opened 3 years ago

Closed 18 months ago

#5610 closed task (blessed) (invalid)

Update Google Fonts CSS

Reported by: jonoaldersonwp's profile jonoaldersonwp Owned by:
Milestone: Priority: lowest
Component: General Keywords: performance
Cc:

Description

All pages load Open Sans from Google fonts via the following markup:

<link href='//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic' rel='stylesheet' type='text/css'>

This is outdated syntax, and should be replaced with the following.
Note that this introduces font-display: swap for some performance reasons*:

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&display=swap" rel="stylesheet">

*We'll eventually want to swap this for optional, but can't do so reliably until we have a proper preloading process and internationalisation process (where we load font variants more conditionally based on the contennt) in place.

Change History (8)

#1 @jonoaldersonwp
3 years ago

  • Type changed from defect to task

#2 @joyously
3 years ago

Isn't the css2 endpoint for variable fonts? https://developers.google.com/fonts/docs/css2
I don't see Open Sans in the list of variable fonts: https://fonts.google.com/variablefonts#font-families

Also related, this core ticket is about being able to specify multiple values for the same variable in a URL, such as Google Fonts: https://core.trac.wordpress.org/ticket/49742

Is there any urge to switch to system fonts instead of Google fonts?

#3 @jonoaldersonwp
3 years ago

If we can switch to system fonts, that'd be preferable.
The css2 endpoint is universal.

#4 @dd32
3 years ago

This is outdated syntax, and should be replaced with the following.

Other than being 'outdated' is there any reason to switch to it? Or is the primary reason to gain the font-display: swap?

Looks like there's multiple places

  • Global header
  • Learn
  • Developer
  • Gutenberg site (This can probably be removed, as Gutenberg no longer uses Noto)s
  • Main theme
  • Make P2s

#5 @jonoaldersonwp
3 years ago

No immediate pressure on the 'outdated' front, but future shinies will be limited to the newer syntax.

#6 @joyously
3 years ago

You can use the font-display with the current syntax.
But if the goal is system fonts, then perhaps rewrite the ticket?

#7 @jonoaldersonwp
3 years ago

Why would we just update the current syntax, rather than upgrading and updating it?
System fonts encounters politics, opinions, design considerations. This is a quick win in the meantime.

#8 @jonoaldersonwp
18 months ago

  • Resolution set to invalid
  • Status changed from new to closed

Closing, as newer sites/templates are phasing this out.

Note: See TracTickets for help on using tickets.