5月に入って日にちが経ちますね。

みんなが、マスクを脱却する日は数年後になるんじゃないかね？

いつになったら、全国旅行支援からGo to トラベルはいつ開始するんやろうね？

さてと、話題に入りましょう！

Font-Family設定にこれを入れたらええんかな？

ほかの競合サイトからいろんなサイトを引用したらほとんど、

font-family: -apple-system, BlinkMacSystemFont, sans-serif;

これが入ってました。

これってなにこれって思いつつ、いろいろネットで調べたら、Apple社の iOS に対応するためのフォント設定なんですね！

競合サイトのフォント設定がいろんなところにiOS対応させるためのフォントがいくつかのサイトが見られました！

BlinkMacSystemFontは、Chrome など Blink 系のブラウザ向けに Apple のシステムフォントを有効にするための指定なんだって！

んで、「-apple-system」これは何の役割があんの？ってネットでググったら…

SafariでCSS「font-family: -apple-system」を指定すると、OS標準フォントを利用できるそうだ！

Mac OS だと、この -apple-system しか指定できないのだが、iOS の場合はコレ以外にも特殊な Apple システムフォントが設定できる。

この要約をまとめると-apple-system が Safari 用、BlinkMacSystemFont が Chrome 用。

ちょっと待ってて…

見たことのないフォントが…

font-family: "Segoe UI", sans-serif;

これナニコレ？

ネットでまたまたググったら、Microsoftが標準装備しているフォントなのか？

これ使うサイトあるんかなーと競合サイトをググったらほぼない…

いやいや、使ってるサイトはどっかにあるんちゃうかといろんなサイトをググっても出てこん！

競合サイトの頭から離れて…

有名なサイトをググろうと…！

まさか、こんな有名なサイトにも使われてるんや！

最終的には、これがええんちゃうんかな？

font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

あとは、日本語のフォントに対応に合わせて好みにカスタマイズをすれば、これで解決なんやな？

でも、個人的にはLatoを入れたいんやけどなぁ…

フォントの種類が増えると、ブラウザの読み込みスピードにも大変やしね…

色々、試行錯誤をしながら完成形に決めていきたいと思います！

ではまた！