サイトやバナーを作るとき、私がいつも最後まで悩むのがフォント選びです。候補が多すぎて決めきれない、という方も多いのではないでしょうか。そんなときは「みんなが何を使っているか」を知っておくと、意外と迷いが減ります。
ここでは、かつて話題になったWebデザインの人気フリーフォント調査を振り返りつつ、そのフォントたちが今も使えるのか、どこで手に入るのかを整理してみます。もとになったのは、PSDのプレビューや書き出しができるツール「Avocode」の利用データからまとめられた「Avocode 2016 Web Design Report」というレポートです。
※このレポートを公開していたAvocodeは2023年10月にサービスを終了しており、現在は元ページを見ることができません。以下は当時の内容として紹介します。
関連記事：なぜこのフォントを選んだのか…斬新な卵のパッケージがフォントの重要性を再確認させてくれた
Webでもっとも人気のフリーフォントは…
当時、Webでもっとも人気のあったフリーフォント、栄えある1位は「Roboto」でした。デザインツールで何年も上位を走り続けた定番中の定番です。そして2位はおなじみ「Open Sans」。どちらもクセがなく、本文でも見出しでも扱いやすいのが強みですね。
当ブログ名「WeberNote」を書いてみるとこんな感じになります。
上が「Open Sans」で下が「Roboto」です。並べてみると、Robotoのほうがやや幾何学的で締まった印象、Open Sansのほうが少し柔らかい印象に見えます。
この2つは今でも現役です。入手先も当時より分かりやすくなっていて、いちばん手軽なのはGoogle Fonts。RobotoもOpen Sansもページ上でそのままCSSの読み込みタグを取得でき、ファイルのダウンロードもできます。どちらもオープンソースのライセンス（Robotoはかつてのままなら実質的に自由に使え、Open SansはSIL Open Font License）で、商用サイトでも安心して使えるのがうれしいところです。
なお、Robotoを配布していた従来のGitHubリポジトリは2025年に更新停止（アーカイブ化）され、開発は後継のroboto-3-classicへ移っています。特別な理由がなければ、素直にGoogle Fontsから取ってくるのがいちばん楽だと思います。
今のフォント選びで押さえておきたいこと
このレポートから数年が経ち、フォントまわりの事情も少し変わりました。せっかくなので、今の目線での補足も残しておきます。
日本語なら「Noto Sans JP」がほぼ定番です。GoogleとAdobeが共同開発した源ノ角ゴシック（Source Han Sans）と中身は同じ系統で、Google Fontsから無料で使えて商用も可。ウェイト（太さ）の種類が豊富なので、見出しから本文まで一式そろえられます。明朝が好みなら「Noto Serif JP」や源ノ明朝という選択肢もあります。
もう一つ、最近増えているのが可変フォント（バリアブルフォント）です。1つのファイルで細字から極太まで連続的に太さを変えられる仕組みで、読み込むファイル数を減らせるので表示速度の面でも有利です。上で触れたroboto-3-classicもこの可変フォント版で、時代の流れを感じます。
迷ったら、まずはGoogle Fontsで「欧文はRobotoかOpen Sans、和文はNoto Sans JP」あたりから始めてみると失敗が少ないです。人気フォントは無難と言われがちですが、多くの人に読みやすいと感じてもらえるからこその人気でもあります。使いながら、自分のサイトに合う一本を少しずつ見つけていけばいいと思いますよ。
