フォントサイズは最初にきめちゃおう！と思っていたので、フォントサイズについて調べてみました。
そうすると・・・かなり迷うことに！
ざっと調べた結果
・本文のサイズ スマホ14px～16px パソコン16px～18px
・行間 1.4～2.0
・段落間の余白 1 文字～ 2 文字分
Google推奨は16px
ほとんどのサイトもスマホ、パソコン共に16px
スマホ
・本文14px～18px
一番人気は16px
・記事タイトル18px～28px
一番人気は24px
行間
・本文1.6em～2.0em
一番人気は1.8em
・記事タイトル1.2em～1.6em
一番人気は1.3em
パソコン
・本文16px～18px
一番人気はスマホ同じく16px
・記事タイトル22px～40px
ばらつきがあり24・30・36あたりが多い
行間
・本文1.5em～2.0em
一番人気はスマホ同じく1.8em
・記事タイトル1.2em～1.6em
一番人気はスマホ同じく1.3em
段落の余白
・スマホの方が余白が広い場合が多い
・やたらと広いブログも多い
初めから広く設定しているだけでなく、タグで改行していたり、WordPressだと「スペーサー」というブロックを使っていたりしているみたい
Caoouccinoテーマの初期状態も16pxで、そのままでもいいのですが、私の場合は視力が悪いせいか(ほどよく見える程度の度数の眼鏡をかけています。)
どうもパソコンから見たときに16pxだといつの間にか前のめりになりがちだったので、大きくすることに。
パソコンの場合、こどもや高齢者向けは17〜18px
どうせ大きくするならと18pxにしようかとも思ったのですが、18pxだと他のサイトから移動した時に、一瞬大きいなと違和感を感じるのと、スマホ表示とあまり差をつけると初心者の私には余白の取り方？が上手くできなくてずれがでそうだったので17pxにすることに。
スマホ表示ではさすがに17pxは大きいので16pxに戻さなければいけないのですが
「スマホ表示だけ変えるのって難しそう・・・。そういえば、16pxでもメイリオはみやすかったな・・・」とフォントについても調べてみることに。
フォントはシステムフォントとWebフォントの2種類
システムフォント（デバイスフォント）...パソコンやスマホに搭載されているOSにインストールされているフォント。
〇Webサイトに表示される速度が早い
✖ユーザーの閲覧環境によってインストールされているフォントが違うので、サイトで表示されるフォントも変わる
Webフォント
✖表示速度がシステムフォントよりも遅くなる
〇ユーザーの閲覧環境に左右されずフォントを統一できる
表示速度は速い方がいいですよね！
Webフォントであるモリサワの誘惑にかられながらもシステムフォントを選ぶことに。
メイリオを一応試してみたのですが、現在の表示とそう変わらなかったので、やっぱりフォントを17にしてスマホ表示だけ変えることに。
初心者であまりわかってないながらにも、とりあえず全体を17pxにして色んなサイトのカスタマイズを組み合わせて、スマホ表示を16pxにできました！
合っているかはわからないし、余計な記述もあるかもだけど、とりあえずは無事に終了！
スマホのタイトルサイズが大きく感じてタイトルのフォントも小さくしたのですが、変えるとカテゴリ一覧表記の時にサイズが大きいままになって、デザインが崩れてたんですよね。
慌てて戻しました。初心者はまず、本文だけでやめときます！
とりあえず現在の設定は
パソコン
フォントサイズ17px
行間1.9
段落の余白1.8em
文字間.4
スマホ
フォントサイズ16px
行間1.62
段落の余白2em
文字間.4にしました!
行間を見すぎてだんだんと、感覚が狂って 最終的には「もう、なんでもいい気がする・・・」ってなりました。
個人的には文字間を変えると、だいぶ見やすさが違う気がする・・・？
