title: Proper way to use the different weights of a Google font
body: <p><a href="https://fonts.google.com/specimen/Open+Sans?selection.family=Open+Sans" rel="nofollow noreferrer">Google fonts like Open Sans</a> come in different weights each one labelled both as a word (for example "regular") and a number ("400"). But which one of these two "formats" should be used in our CSS/SCSS? Are they equivalent?</p>
  
  <p><a href="https://i.stack.imgur.com/sHRni.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sHRni.png" alt="enter image description here"></a></p>