Google Fonts対応の日本語フォント「IBM Plex Sans JP」と参考サイト10選
公開日 :
- デザイン

こんにちは!アンドエイチエーのデザインチームです。
ウェブサイトのデザインにおいて、本文に使われるフォント(※以下、ベースフォントと呼称)の印象はサイト全体のイメージを決める大切な要素となります。
ベースフォントはサイト内のあらゆる場所で使われ、視認性の高さが求められるため、ウェイトは豊富なものだと助かります。
今回紹介するのは、ベースフォントに適した読みやすさとウェイトの豊富さを兼ね備え、Google Fonts・Adobe Fontsでも対応がある日本語フォント、IBM Plex Sans JPです。
記事の終わりにはIBM Plex Sans JPが使用されている参考サイトを10サイト取り上げましたので、ぜひ最後までご覧ください!
目次
IBM Plex Sans JPとは
IBM Plex Sans JPは、アメリカの大手IT企業IBM(アイ・ビー・エム)が開発したコーポレートフォント「IBM Plex」を日本語対応させたオープンソースフォントです。

IBMは1930年代〜90年代にかけてタイプライター事業を手掛けていたこともあり、タイプライター用に多くのフォントを開発・外注していた歴史があります。
「時代に左右されないフォント」を目指して開発されたIBM Plexフォントは2017年にオープンソースフォントとなりました。

その後、2021年に日本語対応版であるIBM Plex Sans JPがリリースされます。
翌2022年頃にIBM Plex Sans JPはGoogle Fontsへと追加され、ウェブへの活用がより簡単になりました。
フォントの特徴
ふところが広く、ゆったりとしたシェイプ
文字のふところとは字画と字画の内側にある空間のことです。

IBM Plex Sans JPはふところが少し広めに作られており、横広でゆったりとした印象です。
ふところが広いことは小さいサイズの文章や低解像度の環境でも窮屈にならず、読みやすいというメリットとなります。
Webサイトでベースフォントとして多用されるNoto Sans JPなどと比べても、文字自体の幅は共通していますが、文字を構成するパーツの幅とふところが広く取られていることがわかります。

長文でも疲れにくい読みやすさ
IBMはアメリカでも歴史のあるIT企業であるため、派生元のIBM Plexフォントは開発コードなどにも使われることを想定してデザインされています。
その利便性と方針はIBM Plex Sans JPにも引き継がれているのか、長文を読む時も疲れにくく可読性が高い部類のフォントといえます。

ウェブサイトに限らず、パワーポイントのスライドや、資料のテキストとしても適していそうですね。
インキトラップ処理による洗練されたディティール
IBM Plex Sans JPの文字を拡大すると、交差がきつい部分で角の内側を削り込む特徴的な処理が施されています。

これは印刷やタイプライター使用時など、インクを使って文字を表現する際に交差のきつい部分でインクが染み出し、文字の輪郭が崩れてしまうことを防ぐために施されていたインキトラップと呼ばれる処理です。
この処理によって小さな文字サイズの文章でも潰れにくく読みやすくなるため、すっきりと洗練された印象となるのが特徴です。
ウェブ使用想定もされるフォントとして形を変えた現在は、あくまでフォントデザインの特徴という側面が強いですが、タイプライター時代の思想を引き継いだひと手間が可読性の高さに貢献しています。
ひらがなのカーブがゆるやかで、親しみやすさがある
IBM Plex Sans JPのひらがなはカーブがゆるやかで丸っとしています。
曲線にメリハリがあり、シャープな印象のNoto Sans JPと比較すると、ゆったりとして落ち着きを感じる字体です。

この特徴的なひらがなが親しみやすい印象を与え、幅広いジャンルのデザインへ取り入れることができる使い勝手の良さに繋がっているといえます。
Google Fonts 、Adobe Fontsに対応
IBM Plex Sans JPはオープンソースのフォントとして公開されています。
Googleが提供する無料のWebフォントサービスGoogle Fonts、そしてAdobeが提供するフォントサービスAdobe Fontsにも対応しているため、Webフォントとして使用することができます。
ウェイトの種類が豊富
Google Fontsではウェイトは7つ(Thin・ExtraLight・Light・Regular・Medium・SemiBold・Bold)用意されているため、ベースフォントとしてだけでなく見出しやキャッチコピーへの使用など、汎用性が高いことも嬉しいポイントです。
また、豊富なウェイトに応じるように、大きな文字では個性的に、小さな文字では読みやすくなるような設計もされています。

IBM Plex Sans JPが使われているサイト事例10選
それでは実際にIBM Plex Sans JPが使われている事例を10サイト紹介します。
コーポレートフォントということもあり、事例にもコーポレートサイトが多めです。
組み合わせで使われている欧文フォントも記載していますので制作時の参考にもしてみてください!
コーポレートサイト編
鷺宮製作所


- 使用フォント:IBM Plex Sans JP / Poppins
- サイトの印象:清潔感・信頼感
桜商会


- 使用フォント:IBM Plex Sans JP / Heebo
- サイトの印象:清潔感・信頼感
家島建設


- 使用フォント:IBM Plex Sans JP / Satoshi
- サイトの印象:清潔感・信頼感
株式会社カホエンタープライズ


- 使用フォント:IBM Plex Sans JP / Space Grotesk
- サイトの印象:清潔感・信頼感
unium


- 使用フォント:IBM Plex Sans JP
- サイトの印象:スタイリッシュ・ユニーク
IBM


- 使用フォント:IBM Plex Sans JP
- サイトの印象:清潔感・信頼感
リクルートサイト編
日能研関西


- 使用フォント:IBM Plex Sans JP / Hanken Grotesk / Satoshi
- サイトの印象:親しみやすい
https://recruit-nichinoken-kansai.jp
ブランドサイト編
山崎実業


- 使用フォント:IBM Plex Sans JP / Roboto / Jost / Yantramanav
- サイトの印象:やさしい・親しみやすい
サービスサイト編
JOUNEY – 移動式シネマ・サウナバス


- 使用フォント:IBM Plex Sans JP / Fraunces
- サイトの印象:親しみやすい・ポップ
ポータルサイト編
OKITIVE


- 使用フォント:IBM Plex Sans JP / Oswald
- サイトの印象:ポップ・親しみやすい
まとめ
いかがでしたでしょうか?
IBM Plex Sans JPはIBMのコーポレートフォントとして産まれた経緯から工業系やIT系のコーポレートサイトと特に相性が良い印象ですが、様々な雰囲気にもマッチする万能型フォントだと感じていただけたはず・・・
ウェイト数が豊富、かつGoogle Fonts対応している日本語のゴシック体はまだまだ数少ないのでウェブサイトのフォント選びの際にはぜひ参考にしてみてください。
アンドエイチエーのブログでは、同じくベースフォントに使いやすい日本語フォント「Zen Kaku Gothic」について解説している記事もアップしているため、気になる方は合わせてご覧ください!
それではまた!