[Björn]

On my site (https://durfteimproviseren.nl/) I use the Lora font as the regular/content font. However, I noticed that all bold text looked kinda ragged (i.e. as if it has been badly photocopied). Some googling brought me to this page: https://www.smashingmagazine.com/2012/07/avoiding-faux-weights-styles-google-web-fonts/ And because if it, I noticed that in the font stylesheet declaration in the head of all Theme pages, the bold font weight (700) is not included:

<link rel=’stylesheet’ id=’parallax-frame-web-font-css’ href=’//fonts.googleapis.com/css?family=Open+Sans:300,300italic,regular,italic,600,600italic%7cLora:300,300italic,regular,italic,600,600italic&subset=latin’ type=’text/css’ media=’all’ />

As a result of that, a faux bold is used, which looks ragged.
I cannot find a way to force the Parallax theme to include this font weight subset.

How can I fix this?

[Skandha]

@durfteimproviseren: I checked your site and the bold fonts seems to be appearing fine. Can you tell me where you find the bold fonts ragged?

Kind Regards,
Skandha

[Björn]

Well, maybe “ragged” is a bit a dramatic of a description of me. But the bold font appears thinner than it should be, especially at the bottom edge of characters. As if you have zoomed out a bit.

If I use the Chrome Developer Tools to replace the “600” values in the font declaration with “700” (= “bold”), than the font appears full & clearly legible (again), as it should be.
See this screenshot: https://durfteimproviseren.nl/wp-content/uploads/fonts%20rendering.jpg The upper part of the screenshot is the current situation, the lower part is how it should be.

[Author]

Posts