Google Web FontsまたはTypekit?


8

グラフィックデザイナーとして、私はウェブサイトのデザインをしていますが、開発はしていません。Typekitについて知っているかどうか今日誰かが私に尋ねました、そして私はそれを聞いていなかったのでそれをグーグルで調べました、そしてそれはグーグルWebフォントの有料版のように見えました。たまに使っています。どちらか一方を使用する技術的、開発者の理由はわかりませんが、クライアントが何か他のものを無料で使用でき、同じような結果が得られたときに、クライアントに何かを購入してほしくありません。だから、私の質問は、一方が他方より優れているということです。それとも両方に良い点と悪い点がありますか?

回答:


6

これらのどちらよりも柔軟な別のオプションは、@ font-faceを使用することです。

これは無料で、好きなフォントを使用できます。サイトがホストされている場所にフォントをアップロードし、CSSで指定するだけです。唯一のことは、異なるブラウザと互換性を持つようにフォント形式を変換する必要があることです。

次に例を示します。LeagueGothicフォントを使用するとします。

1)フォントコンバーターを使用して、.ttf、eot、woffなどに変換します。http: //www.fontsquirrel.com/fontface/generator

2)すべてのフォントファイルをフォントフォルダにアップロードします

3)CSSに以下を含めます(パスのURLを適宜更新してください)。

      @font-face {
       font-family: 'LeagueGothicRegular';
       src: url('../fonts/League_Gothic-webfont.eot');
       src: url('../fonts/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/League_Gothic-webfont.woff') format('woff'),
       url('../fonts/League_Gothic-webfont.ttf') format('truetype'),
       url('../fonts/League_Gothic-webfont.svg#webfontFHzvtkso') format('svg');
       font-weight: normal;
       font-style: normal;
     }

4)使用したい場合は、次のように呼び出します。

    h3{ 
      font-family: 'LeagueGothicRegular', 'Gill Sans', 'Lucida Grande', Trebuchet, sans-  serif; 
    }

Typekitを試したことはありませんが、基本的に同じことを行うと思います。変換ステップとホスティングを削除するだけでなく、多くのフォントから選択できます。@ font-faceは実際にはそれほど手間がかからないので、個人的には好みです。

詳細については、この投稿を確認してください:http : //sixrevisions.com/css/font-face-guide


5
参考までに:この方法でフォントを埋め込むと、クライアントコンピュータに書体の完全なコピーが提供されるため、法的な問題が生じる可能性があります。ライセンスのないソフトウェアの本質的に無料ダウンロード。
horatio

1
良い点、私はそれをまったく考慮していませんでした。

これは良い方法ですが、準拠したい場合はライセンスを確認する必要があります。
horatio

完全に無料のフォントでない限り、このようなフォントを提供するには、フラッシュ、pdf、または画像ファイルにフォントを埋め込むことができる標準のデスクライセンスとは異なる特別な「ウェブフォント」または「サーバー」ライセンスが必要です。大手ファウンドリの多くは、このような新しいテクノロジーに不信感を持ち、いくつかのオプションを提供しています。一部の古いフォントでは、残念ながら、サードパーティのホスティング設定に依存することがほとんど唯一の合法的な方法です。設立恐竜はまだ何をすべきかを考え出すされている間に挟むと自分の名前を作ることができるかの小さな現代のフォントデザイナーのためのグッドニュース...
user56reinstatemonica8

5

まず、Google Web Fontsでのフォントの種類の選択と文字間隔に満足していますか?私はそれらをまだ使用していませんが、少なくとも1つまたは2つのサイトを見て、それらを使用して優れた結果を得ています。同時に、一部のフォントの表示では、文字のフィットが不十分です(ほとんどの場合、文字間のスペースが多すぎます)。

印刷で使用されているAdobe Fontsと一致させる必要がある場合は、Typekitのように聞こえるかもしれません。現在、基本的なアカウントレベルで表示するAdobeフォントは多くありませんが、選択肢はたくさんあります。基本的なアカウントはかなり安価なので、クライアントはそれを買う余裕があるはずです。現在、DrupalGardensのブログで使用しており、Myriad Proを使用できることを楽しんでいます。

おそらく、使用したいフォントを選択し、どのサイトに必要なまたはそれに近いものがあるかを確認し、フローに進むことになります。ブラウザでデザインしたり、Google、Typekit、Fonts dot comなどからWebフォントを選択したり、Webフォントを使用してサイトのデザインを作成したり、それがどのように表示されるかを正確に確認したりできる、現在プライベートベータ版の新しいWebサイトであるTypecastをチェックしてみてください。 、それからあなたのために働くフォントを注文してください。私はそれをチェックするために、ベータに参加するように頼みました。設計者にとってプロセスが確実にスムーズになるはずです。


2

テクノロジーに関しては、ほとんど同じです。

製品に関しては、Googleがオープンソースの提供(無料)に焦点を当てているのに対し、Typekitは商用タイプのライセンスに焦点を当てているという点で異なります。

どちらを使用するかは、実際にはどの書体を使用するかによって決まります。

現在、多くのファウンドリやタイプディストリビューターがタイプキットのようなサービスを提供しているので、間違いなく少し買い物をしてください。


1
タイプキットは、アドビ(AFAIK)が現在所有しているため、より専門的なオプションがあるようです。これらのサービスについて考えると、稼働時間とサーバーの負荷について疑問に思っています。typekitとgoogleはどちらも、ほぼ100%の稼働率を保証するリソースを備えているため、フォントの読み込みに失敗しません。(??)
horatio

100%の稼働率を持つものはありませんが、そうです、AdobeとGoogleの両方が時間の大部分を占めるはずです。そしてはい、TypekitはAdobeによって購入されました。Typekitが長期的なビジネスモデルであるとは確信していませんが、Adobeの一部であることは理にかなっています(少なくともAdobeはそれを介して独自のフォントライブラリのライセンスを簡単に取得できます)。
DA01 2012年

1
小規模ビジネスや、アルバイトや趣味の多いWebサイトの場合、Google Web Fontsと言えますか?Typekitのダウンタイムがかなりあるというコメントを1つ読んだことを覚えていますが、コメントの古さはわかりません。
Willow

1
設計者は、プロジェクトのニーズに基づいて、ビジネス上の目的と予算の考慮事項を含む書体を選択する必要があります。趣味のサイトは予算の面で不足している可能性が高いので、Googleのサービスに傾倒したいと思うかもしれません。
DA01

1

また、webfonts.fonts.comもチェックすべきです。これらのWebフォントも非常に豊富に取り揃えられているからです。また、Helvetica、Avenir、Univers、Frutigerなど、ブランドが使用するトップブランドフォントの多くも搭載しています。また、サードパーティのファウンドリフォントも多数搭載しています。見てみな!

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.