モリサワのWeb Fonts「TypeSquare」がサービス開始

この記事は鷹野雅弘によって執筆されました。
公開日:2012年2月22日、更新日:2012年2月24日

モリサワのWeb Fonts「TypeSquare」が本日からサービス開始しています。Web Fontsと呼ばず、クラウドフォントと呼ばれています。

DTP Transitでも、見出し部分に適用してみました。雑感として、気づいたことをメモ。

  • 一旦デバイスフォントで表示された後に、ぱっと切り替わる。予想していたよりずっと早いけど、あれ?と思うかも。
  • 現在、自動カーニングはできません。なので「新ゴ」とか、パラパラしない文字が適しているかも
  • Web Fontsが表示されている状態でテキストを選択できます。つまり、画像が減ります。
  • デスクトップだと本文に適用するのは、ちょっとつらい。明朝などを使った場合には逆に読みにくい。一方、iPhone 4/4SのRetinaディスプレイだと解像度が高い(326ppi)ため、いい感じ。

サービスの開始を記念して、TypeSquareを無料でお好きなだけお使いいただける「オープン記念¥0キャンペーン」を行います。ぜひこの機会にTypeSquareをご利用ください。

クラウドフォント・シミュレータ | [TypeSquare]を使って、お試し的に使うことができます。

ご参考:

実装方法

実装は非常に簡単で、次の2ステップで完了です。

header要素内に次のようにJavaScriptを挿入する

<script type="text/javascript" src="http://typesquare.com/accessor/script/typesquare.js?oCDPlT8xxxxxxxxxx" charset="utf-8"></script>

クラウドフォントを適用させたい対象に対して、フォント名を指定する。

h2.asset-name, h1.asset-name {
    line-height: 1.4;
    font-family: "Soft Gothic Bold";
    font-weight: normal;
}

デフォルトでは見出しには「font-weight: bold;」が適用されているため、「font-weight: normal;」を指定しないと太ってしまいます。逆に、クラウドフォントが適用されない環境では太らなくなってしまいます。

『10倍ラクするIllustrator仕事術』改訂版

『10倍ラクするIllustrator仕事術』(増強改訂版)は、2011年発売の『10倍ラクするIllustrator仕事術』の改訂版。2014年に技術評論社から発売、現在5刷です。2011年版と合わせて35,000部のロングセラーとなっています。

詳しくはサポートサイトにて。

画像:『10倍ラクするIllustrator仕事術』改訂版

『10倍ラクするIllustrator仕事術』全都道府県縦断セミナーツアー、 47都道府県すべての県での開催が終了しました。ご参加ありがとうございました!

画像:『10倍ラクするIllustrator仕事術』改訂版

5つの「く」

画像:『10倍ラクするIllustrator仕事術』改訂版

DTP Transitのコアとなっている制作へ考え方「ムラなく、モレなく、直しに強く、手数を少なく、美しく」を5つの「く」としてまとめてみました。

オススメのスライド

お問い合わせ

メールマガジン

サイトの新着情報などを、月1回程度、メールマガジンでも配信しています(まぐまぐから配信。無料です)

オススメ記事

Illustrator

InDesign

Photoshop

その他

 

リンク

このページの上部に戻る