Standard Font Specification

標準フォントの指定

---

サイト内のテキスト部分は、フォント（書体）を自由に指定できる訳ではありません。
閲覧者のパソコンにインストールされている「標準フォント」を決めうちで指定します。

≫ 日本語フォント

CSSにてサイト全体（body）や日本語で書かれた文章には下記のように指定します。

font-family: ‘Hiragino Sans’, ‘Meiryo’, sans-serif;

複数のフォントを記述しますが、先頭のフォントが優先されます。
この場合、いずれもゴシック体のフォントで、メイリオ（Meiryo）よりもヒラギノ（Hiragino Sans）が優先される指定になっています。「sans-serif」は明朝体のようなセリフ体ではないフォント、つまりゴシック体全般を指します。指定したフォントがない環境でも明朝体を避けるため、これを最後に記述します。

[2019.05] 対応ブラウザなど状況を踏まえ記述を整理しました。日本語でのフォント名と旧OS特有のフォントを削除しています。

明朝体のフォントについては、Windowsの解像度がまだ低いため、見出しなど大きな文字でない限りあまりおすすめできません。
ただ上記のように優先順位を決められるため、Macでの閲覧者向けに明朝体や丸ゴシックを表示するなどは可能です。

≫ 游書体

Mac OS X 10.9、Windows 8.1から双方で初めて同じ日本語フォントが使えるようになりました。
厳密にはファイルそのものやウェイトの違いはありますが、ヒラギノより柔らく、メイリオよりもしっかりとした印象になります。
ただWindowsでは文字の太さが極端ため、CSSで細かな指定が必要です。

[2020.09] 現在Macでは游書体がインストールされない場合があります。
その場合「sans-serif」が有効になりヒラギノ明朝などが表示されます。ご注意ください。

MacのYuGothicは問題ありませんが、WindowsのYu Gothicはかなり細いため、Yu Gothic Mediumを指定すると適度な太さになります。ただそのままでは太字が太すぎるため、太字部分だけYu Gothicを指定します。
また、游ゴシックなどがインストールされていないOSも考慮し、前述のヒラギノ、メイリオの記述は残す方が良いと思います。

≫ 英語フォント

英語フォント（欧文フォント）は、WindowsとMacである程度共通のものを利用できます。

≫ Webフォント

標準フォントから話は逸れますが、今はフォントデータそのものをページと一緒にダウンロードして利用できるようになりました。
日本語は重くコストがかかることも多いので、英語だけの利用が容易です。このサイトも「Google Fonts」を利用しています。