NEW213938
Google Fonts don't render properly if font weights not imported
https://bugs.webkit.org/show_bug.cgi?id=213938
Summary Google Fonts don't render properly if font weights not imported
stuart.shapiro+webkitbugzilla
Reported 2020-07-03 13:28:47 PDT
Created attachment 403476 [details] Safari vs Chrome font screenshots When viewing a website that uses Google Fonts, the font does not render properly if the weight is not specifically called in the @import or <link> code. Example site: https://www.transportation.gov/briefing-room/us-department-transportation-issues-enforcement-notice-clarifying-air-carrier-refund The Lato font renders incorrectly in both Safari (and Firefox 78.0.1 if that helps with debugging). In Chromium-based browsers, the font still renders properly even without the weight specifically mentioned. In the CSS for the site, it uses this code: @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700");@import url("https://fonts.googleapis.com/css?family=Lato&display=swap"); Manually adding code to the <head> with the font weight makes the font render properly: <style> @import url('https://fonts.googleapis.com/css2?family=Lato:wght@700&display=swap'); </style> I'm also noticing this issue in Office Online sites (where it's importing Segoe UI). I'm unable to find the code responsible for importing the font, but I imagine it's a similar issue.
Attachments
Safari vs Chrome font screenshots (225.76 KB, image/png)
2020-07-03 13:28 PDT, stuart.shapiro+webkitbugzilla
no flags
Radar WebKit Bug Importer
Comment 1 2020-07-06 09:47:16 PDT
Note You need to log in before you can comment on or make changes to this bug.