Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

font-display: swap in the fonts css file #80

Open
DevonRW opened this issue Jun 16, 2020 · 0 comments
Open

font-display: swap in the fonts css file #80

DevonRW opened this issue Jun 16, 2020 · 0 comments

Comments

@DevonRW
Copy link
Contributor

DevonRW commented Jun 16, 2020

In the fonts.css file on media.wago.io add in font-display: swap; within all of the @font-face.

The goal is for the original font to display and then after the fonts that are being loaded by fonts.css are loaded then the font is swapped in by the browser. This helps a user see text on the site before the fonts are fully loaded. Some testing is needed with this to ensure that the system font and the fonts.css fonts aren't REALLY different while waiting for the fonts to download.

Example usage:

@font-face {
  font-family: ExampleFont;
  src: url(/path/to/fonts/examplefont.woff) format('woff'),
       url(/path/to/fonts/examplefont.eot) format('eot');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant