Using “font-display” has no effect on Google PageSpeed Insights
-
Hello
To comply with Google PageSpeed Insights advices, I’m using “font-display” according to what I’ve seen in several forums.
Yet, adding “font-display: swap” to my custom CSS has no effect on Google PageSpeed results, as it still says that the text needs to be visible whilst page is loading.
I have tried with and without “src”, and with only one url or all four of them; with or without fallback font (e.g. “Lato,sans-serif’), changing the place or the codes, but at no effect…
Any idea of what is wrong in my custom CSS in the @font-face part of it, please?
Thank you ??Here’s my current CSS:
@font-face {
font-family: ‘Lato’;
font-style: normal;
font-weight: 400;
src: local(‘Lato Regular’), local(‘Lato-Regular’), url(https://fonts.gstatic.com/s/lato/v16/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format(‘woff2’);
font-display: swap;
}
h1, h2, h3, h4, h5, h6, .site-title {
clear: both;
color: #2c313f;
font-family: Lato, sans-serif;
font-weight: bold;
margin: 0 0 1.5rem;
}
#masthead .site-branding .site-title { font-size: 1.3rem;
font-weight: bold;
background: url(“https://integrative-holistic-therapy.com/wp-content/uploads/Spiral.png”) no-repeat scroll left top / contain rgba(0, 0, 0, 0);
line-height: 50px;
padding-left: 30px;
margin-bottom: 20px;
margin-top: 20px
}
.site-header {
background: #aaaaaa;
border-bottom: 1px solid #aaaaaa;
padding-bottom: 1.5em;
width: 100%;
}
.main-navigation a {background-color: #aaaaaa;
}
.page-template-panel-page .hentry.has-post-thumbnail {
padding-top: 30px;
}The page I need help with: [log in to see the link]
- The topic ‘Using “font-display” has no effect on Google PageSpeed Insights’ is closed to new replies.