💄 [#2115] Forced default bold for headings #1029
Conversation
| @@ -255,6 +255,8 @@ | |||
|
|
|||
| @font-face { | |||
| font-family: 'Heading'; | |||
| font-style: normal; | |||
| font-weight: bold; | |||
| src: url('/media/custom_fonts/heading_font.ttf') format('truetype'), | |||
There was a problem hiding this comment.
Are we going to need a separate font for bold headings, similarly to the body fonts?
There was a problem hiding this comment.
Are we going to need a separate font for bold headings, similarly to the body fonts?
No, because by default Headings are rendered as 'bold' explicitly (just like when you'd use 'bold' for other content) so 'bold' is implied here.
There was a problem hiding this comment.
Just for my understanding: does this work because there previously was some default (numeric) value for heading font-weight? At first glance it doesn't make a lot of sense to see the addition of font-weight: bold make things less bold 😅.
There was a problem hiding this comment.
@stevenbal There was never a numeric value 🙂 it has to do with setting the font's default behaviour in FONT-FACE in particular, so it is not quite (but a little bit) connected to how you would use 'bold' in other CSS styles. In this case we are setting the behaviour to acts as Bold anytime the browser is "told" to render the content as Bold (and I totally forgot that a Heading is always bold of course...).
This is also connected to something called 'faux rendering' which in some cases can lead to fonts becoming extra-extra-extra bold or extra-extra-extra italic; and it makes websites look completely different in different browsers.
In short: if you want control of how the font looks: "force" the weight and style in font-face.
Also: let's hope nobody wants to use italic Headings - but for now I do not see any italic being used in the project.
There is a very long explanation here if you want to understand all, (where sometimes it's a bit unclear on the difference between font-face and css styling):
https://www.smashingmagazine.com/2013/02/setting-weights-and-styles-at-font-face-declaration/
There was a problem hiding this comment.
check, thanks for the explanation 👍
Issue: https://taiga.maykinmedia.nl/project/open-inwoner/task/2115
Also: a small fix for the dyslexia drop-down menu