Merriweather Sans v12 Breaks Layout

[NoelAbrahams]

Hi

We've been rushing around investigate a sudden break in the layout of our website. Finally this has been tracked down to the following: The Merriweather Sans font downloaded automatically seems to have changed without notice.

Here are the URLs for the good (v11) and bad (v12) versions:

https://fonts.gstatic.com/s/merriweathersans/v11/2-c49IRs1JiJN1FRAMjTN5zd9vgsFH1OZyDE0hY.woff2
https://fonts.gstatic.com/s/merriweathersans/v12/2-c99IRs1JiJN1FRAMjTN5zd9vgsFHX1QjU.woff2

I've had a look at the Merriweather github releases page and they don't seem to have released anything for the last few years.

We are scrambling now to resolve this. I have a few questions:

A) Why has a new version of Merriweather been released (when the official repo hasn't done so)?
B) What is the best way to safeguard against this in the future?

I've looked at the rather heated discussion here about self-hosting. Why don't you provide a way to specify version out of the box?

Thanks

[NoelAbrahams]

Here's an example of the breakage. This element has exactly the same CSS. But the one on the left uses v12 and the one on the right v11. The dimensions of the container are inexplicably larger in the new version. When this is propagated across the website then pretty much everything that uses the font is broken.

[m4rc1e]

Why has a new version of Merriweather been released (when the official repo hasn't done so)?

Apologies, the project has been upgraded to a variable font by Type Network. Their fork still needs merging into the upstream.

Here's an example of the breakage.

I agree that this change is too much. Interestingly our qa results did report that the metrics have changed by a single unit. This change shouldn't cause this amount of shifting though

Which OS and browser are you using. Do you also have a url?

[NoelAbrahams]

@m4rc1e

Which OS and browser are you using?

This has been tested on Windows 10 and Chrome/FF/Edge, all of which are broken.

Do you also have a url?

This is a URL: https://thecultural.me/ but I don't think there's anything to be seen in the anonymous session. When logged in, then the menus etc. are broken.

Thanks for the swift response, but the explanation about Type Network is unclear, as I don't know who they are.

We need a way to safeguard against this in the future. This is the fix we are deploying: We are including the following in the main stylesheet:

/* latin-ext */
@font-face {
    font-family: 'Merriweather Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Merriweather Sans'), local('MerriweatherSans-Regular'), url(https://fonts.gstatic.com/s/merriweathersans/v11/2-c99IRs1JiJN1FRAMjTN5zd9vgsFHX7QjX78w.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Merriweather Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Merriweather Sans'), local('MerriweatherSans-Regular'), url(https://fonts.gstatic.com/s/merriweathersans/v11/2-c99IRs1JiJN1FRAMjTN5zd9vgsFHX1QjU.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Merriweather Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Merriweather Sans Bold'), local('MerriweatherSans-Bold'), url(https://fonts.gstatic.com/s/merriweathersans/v11/2-c49IRs1JiJN1FRAMjTN5zd9vgsFH1OZyDK0hZmzA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Merriweather Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Merriweather Sans Bold'), local('MerriweatherSans-Bold'), url(https://fonts.gstatic.com/s/merriweathersans/v11/2-c49IRs1JiJN1FRAMjTN5zd9vgsFH1OZyDE0hY.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

[NoelAbrahams]

Actually, just occurred to me that we should remove local from src to avoid picking up the faulty version.

I also read somewhere that you do not support directly referencing the https://fonts.gstatic.com/s/<font>/vNN URLs.

Can someone confirm whether it's okay to reference these URLs?

[m4rc1e]

@NoelAbrahams the issue has been fixed and the fonts have been pushed to production.

[NoelAbrahams]

@m4rc1e, thank you for letting me know. We released a fix on Saturday with the version hard-coded to v11.

I see that the google font loader now loads v13. Where can I find information about what's different between v11 and v13? Also how do we subscribe to Merriweather version changes and release notes?

Thanks