WEBサイト、アプリ、書籍、チラシなどのデザインをする上で、文字サイズの単位は重要である。
基本はそれぞれのベースとなる単位を元にする。それは文字も一つのデザイン・オブジェクトと考えると、レイアウトをする場合に計算が容易だからである。
WEBサイトのようなモニターに表示されるものは、ピクセル（px）。
紙媒体の場合は、級（Q）にする。
モニターに表示するものは、ピクセル（px）
WEBサイトのデザイン、スマートフォンやタブレット用のアプリ、これらユーザーがモニターに表示されたものを見る媒体の場合、文字サイズの単位は全てピクセル（px）にする。
画面のサイズ、そこに配置するオブジェクトサイズの単位は全てピクセルなので、文字もピクセルにそろえれば、レイアウトしやすいからというのが一つの理由。
実際にはルート要素（htmlやbodyなど）や親要素で例えば16pxと指定して、続く要素には相対単位であるemやremを使いコーディングしてゆくことが現場では多いだろう。
OSによって異なるポイント単位の違い
もしWEBサイトのコーディングで、文字サイズの単位をポイントにするとどうなるか。ユーザーが見るOSによって大きさが異なってしまう。モニター上においてはOSの解像度により必ずしも 1pt=1px ではないからだ。OS別による1ptをpxに換算すると以下のようになる。算出方法はWEB検索すればすぐに見つかるだろう。
| OS | 1ptあたりのpx |
|---|---|
| Windows iOS Android | 1.333…px |
| ｍacOS （非Ratina) | 1px |
| macOS （Ratina） | 2px |
文字サイズを10ptで指定した場合（font-size: 10pt）、WindowsよりｍacOSで見たほうが大きく表示される。この現象を解消するのに、ユーザーエージェントやOS別にメディアクエリを設定するのは現実的とは言えない。文字サイズをピクセルで指定すれば簡単に解決する。
Adobe XDやFigmaなどでデザイン制作を行う場合
現在WEBデザイン制作で、多く使われているAdobe XDやFigmaなどのプロトタイプ・ツール・アプリでデザインを行い文字サイズを指定する場合、これらのアプリには文字サイズの単位が書いていない。Adobeのヘルプを見ると文字サイズの単位はポイント（pt）のようである。
ポイントであれば、上述のように1pt=1.33pxに換算しないとならないのだろうか。Adobe XDの共有→開発モードでリンクを取得し、そのリンクをブラウザーで表示し、さらにそれを共有モードでデータ詳細を確認してみるとピクセル（px）単位で表示され、1pt=1pxとなっている。結果Adobe XDでは1pt=1pxで換算されているので、OSに関係なくそのままで問題ない。改行位置も文字組みも変わらない。
Figmaの場合も、アプリ上では単位の表記はないが、Inspectで確認するとAdobe XDと同様、文字サイズはpx単位で表示されていた。
デザイナーがコーダーにAdobe XDでデザインしたデータを共有する場合、この開発モードのリンクを共有することが一般的なので、文字サイズに関しては特に気にする必要はない。Figmaの場合はブラウザーでアプリそのもののデータを共有するので問題はない。
紙に印刷するものは、級（Q）
紙媒体のデザインをする場合は、モニターで見る場合と異なりDTP上で扱った文字サイズの単位と実際に紙に印刷された文字サイズが、OSや環境によって異なることはないので、その辺りはWEBよりも楽である。
現在日本国内で扱う文字サイズの単位は級（Q）と歯（H）の組み合わせ、またはポイント（pt）が主流である。どちらを使ってもデザイン上の問題はないので、好きな方を使えばよい。しかしここで私は級を勧めたい。それは印刷に使用する紙の判型は、メートル法により規格化され裁断されているから。A列判、B列判の判型はもちろん、それ以外の菊判（151×220ミリ）や四六判（130×188ミリ）などは全てメートル単位（ミリ）で規格化されている。
そこで文字サイズの単位を級（Q）とすれば、1Q=1H＝0.25ミリなので、4Q＝1ミリである。
計算がしやすく、級とミリの間の換算が容易なので直感的にレイアウトを行うことができる。
具体的に書籍のレイアウトを行うに当たっての本文フォーマット設計の工程を示す。
フォーマット設計の方法はいろいろあるが、私の場合は版面の大きさを決めてから、その位置を決める。
版面の大きさを決めるには、本文文字の級数、行間、1行の文字数、そして1ページの行数を決める。
例として、
・横組み
・文字サイズ：13Q（=3.25ミリ）
・行送り：22H（5.5ミリ）
のレイアウトを考え左上を基点としてみると、以下のようなグリッドが作成される。
この紙面の上に
・1行：48W
・1ページ：43L
の版面（はんずら）を作成する。
左上を基点として版面の位置を決める。
・天アキ：27.5ミリ＝22H×5L
・小口アキ：19.5ミリ＝13Q×6W
以上はInDesignでの操作で、最終的には以下のような本文フォーマットが出来上がる。
パンフレット、リーフレットやペラのチラシなどには、このような設計は行わない。ページ全面に文字が敷き詰められることがないからだ。
以上のように本文フォーマット設計をする場合には、1Q＝1H＝0.25ミリの単位であれば計算が容易である。しかしこれがポイントを単位にすると、1pt＝0.352778ミリ となり、たちまち計算が煩雑になる。
以上が紙媒体のデザインをする場合には、文字サイズの単位に級（Q）を使う理由である。
以前書いたAffinityシリーズには、文字サイズの単位に級がない。だから私にとっては使いにくいアプリなのである。ちなみにInDesignはヴァージョン1.0日本語版の時点ですでに級に対応していた。
まとめ
これからデザインを学ぼうとしている初心者には、
モニター表示のデザイン→ピクセル
紙のデザイン→級
を使うことをおすすめする。
日本語の組版を詳しく知りたければ、以下の書籍をおすすめする。
上記の版面の設定や、InDesignの詳しい組版設定の方法も記載されている。
