このブログのスタイルシート

このブログのスタイルシートは、他のページに合わせてhタグに下線を引くぐらいでほぼablogのデフォルトのAlabasterから手を加えていませんでした。 それで body のフォントは font-family: Georgia, serif; になっていました。

私はGeorgia好きなんですよ。 小文字の数字かっこいいですよね。 ですのでまあいいかとそのままでした。

しかし最近、やめよう、CSSのシステムデフォルトフォント指定という素晴らしい記事を読みまして、やっぱりGeorgiaの強制は無いわなと思い直しました。

素晴らしい記事なのですが一点だけ補足したいところがあります。 その記事にはこう書かれています。

最も望ましいのはsans-serifまたはserifを指定することである。

一般的なブラウザのデフォルトフォントは sans-serif ですが、macOSやiOSではSafariのデフォルトフォントは serif です。 sans-serif を指定してしまうと、Safariで悲しいことになり同時にユーザーからはセリフ体/明朝体を選ぶ自由を奪うことになります。 私はmacOSも使いますしSafariの表示は気に入ってます。

全くの新規にスタイルシートを書くなら font-family を書かなければ良いだけです。 しかし既存のスタイルシート(Alabaster)を上書きするわけですから font-family には何か、sans-serif でも serif でもなくブラウザのデフォルトフォントを意味するものを書かないといけません。

……って引っ張ってもしょうがないですね。 initial です。 https://developer.mozilla.org/en-US/docs/Web/CSS/font-family あたりを参照。

記事の筆者様はMacユーザーではないらしいのでここまで気が回らなかったものと推測させていただいて、先の文章はこう読み替えるべきです。

最も望ましいのはinitialを指定することである。

というわけでこのブログのスタイルシートにも font-family: initial; を加えておきました。