Crimson Pro + Work Sans — 文芸・出版タイポグラフィ

出版のためのCrimson Pro + Work Sans

このペアリングは、書籍タイポグラフィの技をWebにもたらします。Crimson Proの洗練された文字形は伝統的な出版を想起させ、Work Sansは現代の読者が期待するデジタルの読みやすさを提供します。

Crimson Pro：デジタルブックフェイス

Crimson ProはCrimson Textファミリーのアップデートで、画面レンダリングの向上のために再設計されました。適度なコントラスト、やや凝縮されたプロポーション、クラシカルなセリフ構造が、プロフェッショナルに組版された書籍のような雰囲気を醸し出します。

h1, h2 {
  font-family: 'Crimson Pro', Georgia, 'Times New Roman', serif;
  font-weight: 700;
  font-size: 2.5rem;
}

Work Sans：クリーンなデジタルの補完

Work Sansは構造的な書体として機能し、ナビゲーション、メタデータ、キャプション、エディトリアルというよりも機能的に感じられる必要があるテキストを処理します。

body {
  font-family: 'Work Sans', system-ui, -apple-system, sans-serif;
  font-weight: 400;
  line-height: 1.6;
}

出版固有のテクニック

文芸Webサイトでは、見出しと本文テキストの両方にCrimson Proを使用し（Work SansはUI要素のみに使用）することを検討してください。これにより、物理的な書籍に近い没入型の読書体験が作成されます。20-22pxのフォントサイズ、1.8のラインハイト、最大幅60chを使用してください。