僕は職場でも自宅でもAdobe Creative Cloudを利用しています。職場のはもちろん会社で契約していますが、自宅で使うアカウントはもちろん自腹。毎月5000円ちょっとはなかなかキツい……。
さて、今朝起きたらTypekitがAdobe Fontsに変わっててビックリしました。さっそく新しくなった管理画面などを触ってみたので、そのご紹介をしたいと思います。
なお、このブログは僕がはてなブログを使っていたときに書いた記事です。現在はWordPressでCocoonというテーマを使っていますが、CocoonでAdobe Fontsを使う場合の手順についてはこちらをご覧ください。
Typekitからの変更点まとめ。Adobe FontsはWebフォントも商用利用制限なしに!
Typekitでは複雑だった利用制限が撤廃されシンプルになり、
Adobe Fontsでは以下のとおりになったようです。
- 同期できるフォントの数が無制限
- すべてのフォントがWebでもデスクトップでも使用可能
- すべてのフォントが個人用でも商用でも使用可能
- Webフォントとして利用する場合のページビュー制限とドメイン制限も撤廃
- Adobe IDさえ持っていれば、Creative Cloudサブスクリプションを購入していなくてもフォントの基本コレクションが無償で使用可能
これは神アプデと言わざるを得ませんね。
ドメイン制限がなくなったのはかなり便利ですね!
Typekitのときはビジネスプラン(だったかな?)じゃないとお客さん(企業)のサイトでWebフォントが使えませんでしたが、これでようやく使えるようになったってことでしょうか。
はてなブログにおけるTypekitからAdobe Fontsへの設定変更
僕はJavaScriptのコード埋め込み方式でこのブログでもTypekitのフォントを利用していましたが、埋め込み用のコードも変わっています。
ここからは実際に行った設定変更の流れを簡単にご紹介します。
※JavaScriptのコード埋め込みの場合です。
① Adobe Fontsにログイン
Adobe Fontsのホーム画面へ。右上のログインボタンをクリック。
いつものAdobe IDでログインします。
② ログイン完了したら画面左上にある「Typekit Webフォント」をクリック。
明らかに画面が見やすくなっていますね。
③ 「マイWebプロジェクト」をクリック。
Adobe Fontsでは「プロジェクト」という名称になったようです。
Typekitのときは「キット」という名前でしたかね、たしか。
④ ブログで使っているプロジェクトのコードをコピー
Typekitで登録していたサイトがこのページで一覧表示されます。ブログで使っていたプロジェクトを探し、「プロジェクトを埋め込み」部分にあるコードをコピーします。
ちなみに、先ほどの画面で「詳細を表示」をクリックすると、実際に使うフォントを選択することができます。
Typekitのときより分かりやすい。
「CSSをコピー」をクリックすると、CSSで記述するコード(font-family, font-weight, font-style など)がクリップボードにコピーされます。
⑤ はてなブログの管理画面にコードを貼り付ける
はてなブログの管理画面へ。
[設定]>[詳細設定]の中にある「headに要素を追加」欄にコピーしたコードをペーストします。
以前のTypekitで使用していたコードは削除しました。
以上で設定完了です。変更が反映されるまでに時間がかかるかもしれません。
また、CSSの記述方法自体は変わっていませんので、使うフォントが変わっていない場合は何もしなくてもいいと思います。
▼ はてなブログのCSSの設定画面。とくに変えなくてもいいですが、僕はこのタイミングで新しいフォントに変更したのでそれを追記しました。
Illustrator 2019ではこのAdobe Fontsが統合される
ブログとは直接関係ありませんが、Illustrator 2019では「Creative Cloudメンバーは、Adobe Fontsの直接統合により、15,000以上のフォントすべてにIllustrator CCから直接アクセスできます。」とのことです。
2018までは、Typekitからフォントを同期しなければいけませんでしたが……。
Illustrator CC 2019にアップデートして実際に試してみたところ、フォントを選択する画面に「Adobe Fontsからすぐにフォントをアクティベート」という表示があり、それぞれのフォントの右端にあるアイコンですでにアクティベートされているのかどうかが確認できます。
アクティベートしたいフォントを選択して、クリックするだけでフォントがアクティベートされすぐに反映することができます。ただし、リアルタイムでフォントを検索するため、動作がけっこう重くなります。どれくらい重くなるかは回線やマシンスペックによるかと。
これは神アプデですね……。(2回目)
さいごに
Adobe Fontsかなり便利に、使いやすくなりましたね。
商用でも自由に使えるようになったということで、
自分の仕事においても大きな転機となることは間違いなさそうです。