有名サイトのfont-familyを調べてみた
当ブログのfont-family選定の作業の一部です。決定版は次の記事参照です。
有名サイトのfont-family
font-familyGoogle - https://www.google.co.jp/
font-family: arial, sans-serif;
Yahoo!Japan - https://www.yahoo.co.jp/
font-family: "\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3",Hiragino Kaku Gothic Pro,"\30E1\30A4\30EA\30AA",Meiryo,Osaka,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",MS PGothic,sans-serif;
Facebook - https://www.facebook.com/
font-family: Helvetica, Arial, "hiragino kaku gothic pro",meiryo,"ms pgothic",sans-serif;
Wikipedia - https://ja.wikipedia.org/
font-family: sans-serif;
日経新聞 - https://www.nikkei.com/
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Noto Sans","Helvetica Neue","Helvetica","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
時事ドットコム - https://www.jiji.com/
font-family: "ヒラギノ角ゴ ProN W3","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","HiraKakuPro-W3","メイリオ",Meiryo,"MS Pゴシック","MS Pgothic","Osaka",sans-serif,Helvetica, Helvetica Neue, Arial, Verdana;
読売新聞 - https://www.yomiuri.co.jp/
font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, Meiryo, "MS Pゴシック", "MS PGothic", "MS ゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
毎日新聞 - https://mainichi.jp/
font-family: -apple-system,BlinkMacSystemFont,YuGothic,"游ゴシック","Yu Gothic","メイリオ",sans-serif;
朝日新聞 - https://www.asahi.com/
font-family: 指定なし
産経新聞 - https://www.sankei.com/
font-family: "ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,"MS Pゴシック","MS Pgothic",Osaka,sans-serif,Helvetica,Helvetica Neue,Arial,Verdana;
共同通信 - https://www.kyodo.co.jp/
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "MS Pゴシック", sans-serif;
共同通信(47NEWS) - https://www.47news.jp/
font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,Segoe UI,Noto Sans Japanese,Hiragino Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 ProN W3,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;
首相官邸 - http://www.kantei.go.jp/
font-family: "HiraKakuPro",-apple-system, "Lucida Grande", "Helvetica Neue", "メイリオ", meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
確認日 - 2020年02月05日
備考
上記の結果から読み取れた情報
- mac和文は、ヒラギノが一般的(Osakaは、少数)
- win和文は、メイリオが一般的(游ゴシックは、少数)
- 未指定もあり
- 先頭小文字もあり
- 日本語表記する場合は、エンコードしたほうがいい?
- 英字フォントを後方に記載する理由はあるのか?
- 標準フォントが英字対応していない可能性かな?
- そんなことあるのか?
font-family(mono)
font-family(mono)GitHub - https://github.com/
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
Bootstrap - https://getbootstrap.com/
font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace
AtCoder - https://atcoder.jp/contests/agc040/submissions/9925635
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
SyntaxHighlighter - http://alexgorbatchev.com/SyntaxHighlighter/ - shCore.css
font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
crayon-syntax-highlighter - https://github.com/aramk/crayon-syntax-highlighter - global_style.css
font-family: "Lucida Grande", Arial, sans-serif !important;
google-code-prettify - https://code.google.com/archive/p/google-code-prettify/ - prettify.css
font-family: 指定なし
PRISM - https://prismjs.com/
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace
highlight.js - https://highlightjs.org/ - style.cs
font-family: normal 10pt Consolas, Monaco, monospace
SHJS - http://shjs.sourceforge.net/
font-family: 指定なし
確認日 - 2020年02月07日
※有名サイトでソースコードおいてるサイトが思い浮かばなかったため、ソースコードハイライト表示系のサイト含む
備考
上記の結果から読み取れた情報
- macは、SFMonoが一般的
- winは、Consolasが一般的
- 日本語(全角文字)への配慮は特に見られない
- GitHub等では、上記設定で日本語文字を「Meiryo」で表示します
- ブラウザ設定は特になし