国内主要サイトのfont-familyを調べた in 2016
以前、国内の主要サイトのfont-family
を調べたが、今年はどうなっているのか。昨今のfont-family
事情を考えるとどうなっているのか気になり再び調べてみた。
条件
国内サイトの条件
- Top Sites in Japan – Alexaに記載されているサイトから調べる
- 他言語のサービスの場合は、日本語のページを対象とする
- リダイレクトされるページの場合は、リダイレクト先を対象とする
どこのfont-familyをみるか
基本的には、html
や body
に設定されているfont-family
を調べる。
サイト一覧
今回の主要サイトは以下の通り。
- Google.co.jp
- Yahoo.co.jp
- Youtube.com
- Amazon.co.jp
- Fc2.com
- Facebook.com
- Twitter.com
- Wikipedia.org
- Rakuten.co.jp
- Nicovideo.jp
- Livedoor.jp
- Ameblo.jp
- Naver.jp
- Goo.ne.jp
- Dmm.co.jp
- Kakaku.com
- Hatenablog.com
- Hatena.ne.jp
- 2ch.net
- Qiita.com
このドメイン配下のサービス、例えばブログなどもまとめて集計されている上に各ブログでfont-family
が異なっているはずなので、正確な情報は取れない。ひとまず、”主要サイト”のトップページのfont-family
を調べることにする。
font-familyの結果
Google.co.jp
body, td, a, p, .h {
font-family: arial,sans-serif;
}
Yahoo.co.jp
body {
font-family: "MS PGothic", Arial, "Hiragino Kaku Gothic ProN", "Osaka", sans-serif;
}
Youtube.com
body, input, button, textarea, select {
font-family: Roboto,arial,sans-serif;
}
Amazon.co.jp
body {
font-family: "Hiragino Kaku Gothic Pro W3","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}
Fc2.com
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
Facebook.com
body, button, input, label, select, td, textarea {
font-family: Lucida Grande, Tahoma, Verdana, Arial, "hiragino kaku gothic pro",meiryo,"ms pgothic",sans-serif;
}
Twitter.com
body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
body.ja {
font-family: Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"MS Pゴシック","MS PGothic",sans-serif;
}
Wikipedia.org
html, body {
font-family: sans-serif;
}
Rakuten.co.jp
body {
font-family: Meiryo,"Hiragino Kaku Gothic ProN","MS PGothic",sans-serif;
}
Nicovideo.jp
body {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
}
Livedoor.jp
* {
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Meiryo,'MS Pゴシック',Arial,sans-serif;
}
Ameblo.jp
body {
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"MS Pゴシック","MS PGothic",sans-serif;
}
Naver.jp
body.ExOsWin {
font-family:Meiryo,"MS PGothic",arial,sans-serif
}
body.ExOsMac {
font-family:arial,sans-serif
}
Goo.ne.jp
body {
font-family: Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "MS Pゴシック", Arial, Sans-serif;
}
Dmm.co.jp
body {
font-family: "Hiragino Kaku Gothic Pro","¥Ò¥é¥®¥Î³Ñ¥´ Pro W3","¥á¥¤¥ê¥ª",Meiryo,"£Í£Ó £Ð¥´¥·¥Ã¥¯",sans-serif;
}
Kakaku.com
body {
font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック",Osaka,arial,verdana,sans-serif;
}
Hatenablog.com
body {
font-family: Open Sans,Helvetica Neue,Helvetica,Arial,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,MS PGothic,sans-serif;
}
Hatena.ne.jp
html {
font-family: sans-serif;
}
.is-pc {
font-family: Arial, Helvetica, sans-serif;
}
.is-touch {
font-family: Arial, Helvetica, sans-serif;
}
2ch.net
body {
font-family: Arial,Helvetica,San-serif;
}
Qiita.com
body {
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Hiragino Kaku Gothic ProN,"メイリオ",meiryo,sans-serif;
}