Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  Björn 5 months, 1 week ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #145890

    Björn
    Participant

    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?

    #145918

    Skandha
    Participant

    @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

    #145922

    Björn
    Participant

    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.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.