font-synthesis-weight
太字(bold)がフォントに含まれていない場合のブラウザの合成動作を制御するプロパティです。合成太字はストロークを太くするだけの処理であり、本来のboldフォントフェイスとは品質が異なります。Webフォントの表示品質を厳密に管理したい場合に使用します。
概要
太字(bold)がフォントに含まれていない場合のブラウザの合成動作を制御するプロパティです。合成太字はストロークを太くするだけの処理であり、本来のboldフォントフェイスとは品質が異なります。Webフォントの表示品質を厳密に管理したい場合に使用します。
対応ブラウザ
デスクトップ
Chrome 97+
Edge 97+
Safari 16.4+
Firefox 111+
モバイル
Chrome Android 97+
Safari iOS 16.4+
Firefox Android 111+
基本構文
CSS
.precise-weight {
font-synthesis-weight: none;
}
.flexible {
font-synthesis-weight: auto;
} 実務での使いどころ
-
Webフォントの太字品質管理
Webフォントで必要なウェイトをすべて読み込み、合成太字を無効にしてフォントデザイナーの意図した太字表示を使用します。
注意点
- 合成を無効にすると、該当ウェイトのフォントファイルがない場合にstrong要素の太字が表示されなくなります。
アクセシビリティ
- strong要素の太字が視覚的に表示されない場合でも、スクリーンリーダーは強調として認識します。視覚的な代替手段の提供を検討してください。