モリサワのクラウドフォントサービス『TypeSquare』で遊んでみた

access_time create folderデジタル・IT

2月22日、待望のクラウドフォントサービス『TypeSquare』(http://typesquare.com/)がオープンした! しかもオープン記念で、「2012年2月22日から2012年12月31日まで無料&制限無しで使える」キャンペーンを実施中。というわけで、早速登録して遊んでみた。

さて、その前に、『TypeSquare』の説明をしておきたい。
『TypeSquare』とは、モリサワの書体をウェブ上で表示できるようになるサービス。インターネットを介してフォントを配信しているので、パソコンにフォントがインストールされていなくてもモリサワフォントが表示される。

ウェブフォントを使えば、閲覧者の環境に依存せず、かつ画像にするような手間もいらず、フォントを使ったウェブデザインが可能になる。Googleの『WebFont』や、seesaaの『デコもじ』、フォントワークスなどの『FONT+』に続き、モリサワは2011年8月10日にモリサワフォント154種類の提供を発表していた。今回、まさに待望のサービスオープンである。

というわけで、実際にやってみる。
『TypeSquare』のユーザー登録は非常にシンプル。『TypeSquare』のサイトにアクセスして、メールアドレスを登録。あとは案内に従って設定していけば、簡単にフォントが使えるようになる。
ウェブ上でフォントを表示させるには、URLの登録と、専用タグ貼り付けの必要があるが、ごく基本的なHTMLとCSSの知識があれば問題ない。

既存の広告&ロゴのパロにしたほうがわかりやすいので、三点の文章を作ってみた。

・そうだ 東京、行こう

・輪るピクトグラム

・花咲けいろは

この文字にCSSでフォント指定をする。ローカル上(サーバーにアップする前)では、文字の表示はMSゴシックのままだ。

だが、アップロードすると……

おおー、ちゃんとフォントが反映される! それっぽい!! 読み込みのラグは少しあるものの、見事に画像なしでフォントを使ったデザインができるようになった。
ちなみにPCだけではなく、スマートフォンから閲覧してもフォントが見ることができる。iPhoneから見るA1明朝、超キレイ!

実際にユーザー登録してみなくても、『TypeSquare』のデザイン自由度の高さを体験することはできる。

『クラウドフォント・シミュレータ』(http://typesquare.com/simulator/)を使えば、クラウドフォントが実際どのように表示されるのか体験できるのだ。シミュレータにはデバイスフォント(環境依存のフォント)での表示を比較する機能もついている。まさに至れり尽くせり。

今後『TypeSquare』では、モリサワフォントだけではなく、傘下のリョービなどのフォントも使用できるように調整中とのこと。モリサワの他にも、既存のウェブフォントサービスや、他社の参入なども考えられる。個人的に期待しているのは視覚デザイン研究所の参入だ(『ギガJr』を画面上で見たい!)。

ウェブフォントがもっともっと普及すれば、面白い試みや新しいアイデアも生まれてくるはず。色々な意味で、2012年はクラウドフォント(ウェブフォント)業界から目が離せない。

『TypeSquare』
http://typesquare.com/

※この記事はガジェ通ウェブライターの「青」が執筆しました。あなたもウェブライターになって一緒に執筆しませんか?

  1. HOME
  2. デジタル・IT
  3. モリサワのクラウドフォントサービス『TypeSquare』で遊んでみた
access_time create folderデジタル・IT
  • ガジェット通信編集部への情報提供はこちら
  • 記事内の筆者見解は明示のない限りガジェット通信を代表するものではありません。