文字（フォント）の種類について

基本形は以下のスタイルで進めます。

font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;

Window のメイリオを変えたい、明朝体を使いたい、どうしてもウェブフォントを使いたい場合は、その都度考えます。また、Windows での閲覧時はメイリオが設定されるので、Mac でビジュアルデザインを作成した場合見た目は随分変わるので、確認しておく必要があるかもしれない。

文字詰めについて

文字詰めしたい場合は下記のように font-feature-settings を指定します。

font-feature-settings: "palt" 1;

上記の font-family の指定だとメイリオだけ文字詰めはできない。Mac や iOS, Android（一部を除く）では文字詰めできます。palt で句読点が詰まって読みづらいときは、別の指定である pwid （プロポーショナル字形に置き換える指定）や pkna （仮名や仮名関連の字形セットをプロポーショナル字形に置き換える指定）という値を使うなどを検討します。また、メイリオでも文字詰めしたい、字間が詰まりすぎているときは letter-spacing で調整することも検討します（しかし、letter-spacing はあまりいい感じにはならない）。

文字の大きさについて

文字の大きさについては、html タグに基本サイズ（16px）を指定し、その他は rem で指定します。

html {
  font-size: 16px;
}

body {
  font-size: 1rem;
}

基本サイズ（16px）を指定した場合 px と rem を表にしたものが以下の表です。

行間について

まず、body に line-height: 1; を設定します。

body {
  line-height: 1;
}

そして、見出し、本文など個別に行間を設定します。

line-height の値は 1.0 〜 2.0 くらいまでに収めるといいかもしれない。