Fontは読みやすさを確保するだけでなく、情報階層の明確化、重要なコンテンツの伝達、ブランドの表現に役立ちます。
FDSでは幅広い使用例をサポートするためにより明瞭な印象を与える「BIZ UDPGothic」を使用しています。このFontはWindowsで標準で搭載されており、Macもダウンロードすれば使用することができます。
BIZ UDPGothic – Google Fonts(外部サイト)
![](https://manual.uxhub.tokyo/wp-content/uploads/2024/06/img01-10.png)
![](https://manual.uxhub.tokyo/wp-content/uploads/2024/06/img02-13.png)
Font Tokensのメリット
1.一貫性の確保
Font Tokensを使用すると、ウェブサイト全体で一貫したフォントスタイルを簡単に実現できます。例えば、見出しや本文テキストなど、異なる要素に同じFont Tokensを適用することで、一貫性のあるデザインを保つことができます。
2.メンテナンスの容易化
ウェブサイト内のフォントの変更や更新が容易になります。フォントの変更が必要な場合、Font Tokensの定義を変更するだけで、全ての使用箇所に反映されます。これにより、複数の箇所でフォントの変更を手動で行う手間やヒューマンエラーを軽減できます。
3.リファクタリングの強化
Font Tokensは拡張性と柔軟性を提供します。例えば、ウェブサイトのスタイルガイドやテーマを変更する際に、Font Tokensを簡単に置換することで、全体のデザインを効率的に更新できます。
Text Styles
Local Styles / Text Stylesの構成
![](https://manual.uxhub.tokyo/wp-content/uploads/2024/06/img03-7.png)
Variables
FDSではTypographyの定義をVariablesで管理しています。
![](https://manual.uxhub.tokyo/wp-content/uploads/2024/06/img04-10.png)