自分なりのWebフォントを選考する

2024.08.30 09:00
2024.08.30 09:15
自分なりのWebフォントを選考する

個人的に今現在のシンプルなフォント構成は、Noto Sans JapaneseとLatoの２つです。
weightも絞ってあり、Notoの通常は500、boldは900です。
Latoは通常は700、boldは900です。
weightは用途によって若干変動しますね。

では実際のコードです。
まずはフォント読み込みのmeta。

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,700;0,900;1,700;1,900&family=Noto+Sans+JP:wght@500..900&display=swap" rel="stylesheet">

そしてcssの指定はこんな感じ。

  font-family: "Lato", "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-size: 14px;
  line-height: 1.8;

読み込み時にフォントを絞ってあるので、通常の指定は特になし。
boldは勝手に900になりますね。

今回は以上です！