Ensure text remains visible during webfont load

  • Resolved sailors

    (@sailors)


    4 years, 11 months ago

    Hi,

    I added the code, font-display: swap; to all font declarations like the following in CSS and this is one of them. When I performance test I get that error message,

    /* open-sans-300 – latin */
    @font-face {
    font-family: ‘Open Sans’;
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local(‘Open Sans Light’), local(‘OpenSans-Light’),
    url(‘/wp-content/themes/astrid-child/fonts/open-sans-v17-latin-300.woff2’) format(‘woff2’), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url(‘/wp-content/themes/astrid-child/fonts/open-sans-v17-latin-300.woff’) format(‘woff’); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
    }

    I also added it here for extra measure,
    //fonts.googleapis.com/css?family=Open+Sans:300,300italic,600,600italic&display=swap
    //fonts.googleapis.com/css?family=Josefin+Sans:300italic,300&display=swap

    How can I fix this issue?

    • This topic was modified 4 years, 6 months ago by Jan Dembowski.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Ensure text remains visible during webfont load’ is closed to new replies.