こんにちは。アイレットデザイン事業部のデザイナーの中村です。
アイレットデザイン事業部ではINSIDE UI/UXと題して、所属デザイナーとエンジニアがデザイン・SEO・アクセシビリティ・UI/UXなどそれぞれスペシャリティのある領域に対する知見を幅広く発信しています。

事の始まり

以前、ある案件のwebページのデザインの作成をしており、お客様からokをもらったのでマークアップ担当者にデザインを見せて作業のお願いをしました。
すると「このフォントはwebフォントで使えないです。」と言われて急遽フォントを変更することに…
このときはAdobe Fontsでデザインを作成しており、普段から使っていたので特にライセンスを確認せず進めてました…完全に私の不注意です。

そもそもwebフォントとは？

webフォントはwebサーバに置かれたフォントデータを取得して、その読み込んだフォントをwebブラウザ上に表示することができます。
ローカルのフォント環境は関係ないので、使用しているデバイスによってフォントの表示が異なったりすることはありません。

Adobe Fonts

Adobe Fontsとは、Adobe社が提供するフォントライブラリーサービスのことです。

『Adobe Fontsフォントサービスでは、500を超える日本語フォントを含む、20,000以上の高品質なフォントを、印刷、 web、映像などの制作物に使用することができます。Adobe FontsはすべてのCreative Cloudプランに含まれ、追加料金なしでご利用できます。』
https://www.adobe.com/jp/creativecloud/joc/adobe-fonts.html

どのフォントも個人利用・商用利用OKで種類も豊富なのでAdobe Fontsを利用しているデザイナーは多いと思います。
ただし、Adobe Fontsを利用するには「Adobe ID」を作成して登録する（無料）か、「Adobe Creative Cloud」の有償プランに契約する必要があります！
「Adobe ID」のみの登録は6,000のフォント、有償プランに登録した場合は20,000以上のフォントを使用することができます。
さらに有償プランだと500以上の日本語フォントも使えるので、こういうイメージのフォントがほしい！ってなった時に見つけるのに困らなさそうです。

何がアウトだったのか

結論を最初に言うと、「webフォントをお客様のwebサイトで使用する」と言うことがダメでした！
Adobe Fontsをwebフォントとして使うのがダメと言うことではなく、「Adobeのライセンス契約している個人もしくは企業のwebサイトで使用するのは問題ない」ということです。
ちなみに、Adobe Fontsで見出しを作成し、それを画像にしてお客様のwebサイトで利用するのはOKです！
もしお客様のwebサイトでAdobe Fontsをwebフォントとして使用したい場合は、お客様のAdobeアカウントでwebフォント用の埋め込みタグを発行していただく必要があります。
Adobeのアカウントを作成していない場合は、お客様に登録してもらわなければならないのでかなり手間がかかると思います。
それに有償プランに契約してもらうとなるとちょっと面倒なことになりそうです…。
<参考URL>
https://helpx.adobe.com/jp/fonts/using/font-licensing.html

使用フォントの変更

当時作っているページが海外のページだったので、最初はFuturaでデザインをしていました。
変更する時は文字の太さや提供されたロゴのフォントと並べて違和感ないかなど諸々確認し、最終的にGoogle FontsのNoto Sansを使いました。（スケジュール的にフォント探しにそこまで費やす余裕がなかった…）
Google Fontsはオープンソースなので誰でも使用することができます。なのでお客様のwebページで使っても問題ありません。
Adobe FontsとGoogle Fontsの違いを下記の表にまとめています。
フォント数に関してはAdobe Fontsの方が断然多いのですが、Google Fontsの方は特に登録を必要とせず誰でも使うことができるのでWebフォントであればGoogle Fontsの方が使いやすいかと思います。

Adobe Fonts Google Fonts
提供 Adobe Google
費用 一部無料（全て使う場合は有料） 無料
フォント数 無料の場合は6,000 有料は20,000以上(2022/08現在) 1,442(2022/08現在)
日本語フォント数 500以上(2022/08現在) 51(2022/08現在)
利用 Adobeのライセンスを契約すれば誰でも利用可能 誰でも利用可能

<参考URL>
https://fonts.google.com/

まとめ

ロゴやバナーなどの画像作成で使ったから、webフォントでも使えるだろう！と思いながらデザインを進めると私のように後々修正することになってしまいます。
使用するシチュエーションによって使えなかったり有料であったりすることもあるので、フォントを使う前にまずはライセンスをしっかり確認しましょう！