LilPacy.info

快楽な不幸を捨て苦痛まみれの幸福を求める男の物語

未分類

wired.jpで使われているフォントの調査

投稿日:2020年6月27日 更新日:

wired.jpのフォントが好きなので何を使っているのか調査してみた。

結論

Helvetica Neue(英字)、游ゴシック(日本語)というのを使っている。

CSSの指定

font-family属性は左から順に優先度を持つが、描画できない文字があるなど、右側にあるものの方が適切だと判断された場合は右側のものが採用される

        
        123
        body{
  font-family:Helvetica Neue,Arial,YuGothic,Yu Gothic,游ゴシック体,游ゴシック,ヒラギノ角ゴ ProN W3,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS ゴシック,MS Gothic,sans-serif
}

      

FontInLogoでの実例

ProductHunt、はてブで話題になっていたFont In Logoで同じフォントを使ったロゴを調べてみた。

結構、身近なブランド、サービスで使われているみたいだ。(さすがに日本語はなかった)

ちなみに、数年前にios/mac共にHelvetica NeueからSan Franciscoというフォントへ乗り換えたらしく、論争が散見された。なんか文字が小さいのが問題らしい。

早速、このブログのフォントも上記CSSを指定してHelvetica Neue、游ゴシックにしてみた。

問題

けれど、同じような見た目にならなかった。

要因

いろいろオンオフして試してみたが、font-feature-settingsと-webkit-font-smoothingが関係していた。

それぞれ、文字詰めを自動で行ってくれるものアンチエイリアスをかけてくれるものらしい。

ということでこのブログに同じCSSを記述したところ、文字がかなり洒落乙になった。

でもなんかデザイン全体としてはまだまだダサいので、引き続き気に入ったプロダクトを調査してブラッシュアップしていきたい。

appendix

開発者ツールで矢印打鍵すると指定可能なフォント一覧が出るので1つずつ試すことができる。
Safariの方が数が多いのは、表示できるフォントが多いってことなのか…?

以上。

あとで読む

プロが選ぶ!本当に使える日本語フォント | それからデザイン スタッフブログ

QiitaとかはHelvetica NeueよりもSegoeUIというのを優先させてた
おすすめフォント

欧文はSegoe UI、Cambriaの方がいいという意見も。
現代の最強フォントはなにか?ー5つのベストフォント | 株式会社コミコン

-未分類

執筆者:


comment

関連記事

no image

ec2運用のrailsアプリでcronの実行時間がズレる

ec2で運用のrailsアプリでcron使って定期的にプッシュ通知を送りたい。そこで以下のように書いてみる。 schedule = PeriodicNotification.where(status: …

no image

帰納と物理法則、演繹と数学的公理

帰納的推論により得られる結論は(統計的に有意であっても)常に仮説であって、真実とは限らない 帰納的に得られた仮説は、その結論を覆す事実(矛盾する事実)が見出されない限り、あるいは演繹的に反証され普遍的 …

no image

経済成長の本当の原因/要因/真因

経済成長の本当の原因は、総需要にある。 ケインズの『一般理論』では、総需要が総供給に作用し、総供給が総需要に作用するという相互作用を想定していて その相互作用を引き起こすには有効需要の創出が必須となる …

no image

[java] 再代入、メソッドコールしたときのメモリ管理の仕組み

プリミティブ型はスタックに実体を持つ 配列、オブジェクトはヒープに実体、スタックに参照を持つ 変数の再代入はスタックのものがスタック内にコピーされる メソッドの引数に渡した場合も再代入と同様に、スタッ …

no image

手書き風のモデル図の書き方、作り方

パワーポイント使うとやりやすい 手順 appendix 手順 図形や矢印などを普通に書く Paperとかで下書き作るとやりやすい 透明度を調整しつつ全体観を作っていく 手書き風の図形にしたい部分を矩形 …