23 trillion total font views, and counting. お菓子の包装紙にありそうなsweets系Webフォント  6. Habakiriはカスタマイズしやすい無料wordpressテーマ. ・画像ではなく文字で表示することで、SEOが向上、メンテナンスの利便性もUPする。, ・日本語対応フォントが少ない。 KIDS向けのサイトとか、芸術系のサイトに似合いそう。, ゆるさを出したいなら手書き風の文字がピッタリ。 カレンダーを表示できるレスポンシブ対応のjs!monthly.jsの使い方. 線が細くて目立ちにくいので大きいサイズで使うのがポイント。フラットデザインと相性抜群。, “スラっと”よりも、”ひょろっと”が似合う。痩せ型のメガネ男子みたいなWebフォント。 商用利用可、日本語フォント豊富、そんなGoogleフォントをご存知でしょうか。Googleフォントを使えばwebサイトの印象はがらりと変わります。そんなGoogleフォントのダウンロード、使い方、13個のおすすめフォントをご紹介します。 最高のGoogleフォントをお探しですか? 本記事では、データに基づき最も人気のあるものと最も急速に成長しているもの、並びにその最高の組み合わせをご紹介します。 ホーム > Webデザイン・制作. 遊び心いっぱいの個性派Webフォント, 個人的にはこの辺りのcafe系の無機質なフォントが好きです。 本稿執筆の時点では、無料で利用可能なGoogleフォントファミリーが884種類あります。選択肢が多いですね!数多くのフォントの中の最高のものをお探しのあなたなら本記事を是非ご確認ください。, 最高のフォントの並びにWordPressでGoogleフォントを使用するためのベストプラクティスさえご紹介します。, フォントを選択することは美的選択だけではありません。特に、読みにくいフォントを選択してしまう場合、ウェブサイトの直帰率またはコンバージョン率への実際の影響を及ぼすことがあります。, 基本的には、最初のフォントを使用するのではなく、ウェブサイトに最適なGoogleフォントファミリーを選択するのに少し時間をかける価値があります。, さて、好みにもよるもののGoogleフォントのリストをどう作成すれば良いのでしょうか。このリストを完全に主観的なものにするのを避けたく、データに基づいて最高のGoogleフォントのリストを作成します。, 基本的には、Google Fontsの分析データを使用し、大衆の知恵を信頼します。フォントビュー数が23兆を超えているGoogleには、役に立ちそうなデータが少しあります。. HTMLコーディングでお困りの際はお気軽にご連絡ください。, FASTCODING BLOG(ファストコーディングブログ)は、Webに関わる全ての人のためのメディアです。ウェブサイトの制作のデザインからコーディングまで幅広く役立つ情報、最新トレンド、便利サービスなどを配信しています。. Google Fontsは2010年にリリースしたGoogleが提供する、無料で利用可能ななフォントのディレクトリーサービスです。Googleのサーバーからフォントデータを読み込んでWebページにフォントを表示できるWebフォントで世界各国で利用されています。, 日本語フォントを使用できることは便利なことですが、デメリットもありますので理解しておきましょう。 Noto Sans JP (weight:6種類), Noto Serif SC(weight:7種類) 7. concrete5のメリットデメリットは?仕事で使ってわかった8つの特徴. Line25 was built in March 2009 as a place to share web design ideas and inspiration through articles, tutorials and examples of stunning site designs. どのパソコン、どのスマートフォンで見ても同じフォント(書体)で表示してくれて 種類も豊富、使い方も簡単といいところばかりのGoogle webフォント。, そのGoogle webフォントから、独断と偏見でおすすめり30選をまとめてみたので 暇つぶし程度に見て行ってくださいなー!!!, 目次  1. 【2018年保存版】デザイナーが使いやすいGoogleフォント おすすめ10選 LINE25 Line25 was built in March 2009 as a place to share web design ideas and inspiration through articles, tutorials and examples of stunning site designs. Google web fontsの雰囲気別おすすめ30選!Webフォントを導入しよう!Google web fontsを使ったことはありますか?Google web fontsは種類が豊富で導入も簡単なGoogle社のWebフォントサービスです。今回はおすすめのWebフォントをGoogle web fontsから30種類選んでみました! 本記事は、The 10 Most Popular Google Fonts of 2018を翻訳・再構成したものです。配信元または著者の許可を得て配信しています。, グーグルフォントは900ものオープンソースが含まれていて、グラフィックデザイナーやWebデザイナー、デジタルや紙媒体でのデザインの専門家などに愛用されています。これらのフォントは190億回もダウンロードされています。すべてグーグルフォントのGitHub倉庫からダウンロードすることもできますし、あなたのサーバーに直接ダウンロードすることも可能です。Adobeが独自のシステムで使えるフォントを編み出したのとは反対に、グーグルフォントはオープンソースなのでどのような方にでも使えるのが特徴です。, コンテンツがメッセージ性を持つ今、宣伝やブログの投稿、ロゴやブランドの説明などはぴったりのフォントを使わなければなりません。代理のコメントや音声メッセージの必要性なく、フォントのスタイルによってサイト利用者に斬新な体験をさせることができます。これらによって人との関係やブランドアイデンティティを作ることができるのです。, 見落としてしまうような小さすぎる情報は必要ありません。デフォルトのフォントを選ぶことであなたのサイトが成功すること間違いなしです。本当に目立ちたくて、ブランドをアピールしたいのであれば、その時にあったフォントを選ぶ必要があります。セールスやヘッダー用であれ、ユーザーの興味を引かせることができます。, グーグルフォントは無数にあるので、あなたのWebサイトやデザインにぴったりのフォントを見つけるのは大変なことでしょう。使えるフォントをいくつか作るだけでマーケティングや開発班にとっては作業が楽になります。あなたの作業を格段に楽にするために、有名なグーグルフォント10選をピックアップしました。特にグラフィックデザイナーやWebデザイナー、マーケティングのプロにオススメのフォント一覧です。, サンセリフの書体のフォントで、Webや印刷物やキャラクターを目立たせてくれるのにぴったりなものです。Open Sansはプロが使うようなフォントで、明るいものからボールド体まで10種類もあります。, こちらもサンセリフの書体で、主にAndroidのシステムに使われているフォントです。Open SansのようにRobotoは12種類あり、標準のフォントはRoboto SlabやRoboto Condensed familiyと共に使うことが可能です。今では2000万以上ものWebサイトで利用されています。, ポーランド語で夏を意味するこのフォントは、ポーランド人によって作られたものです。このフォントを作った時は、特定の人のために作ったのですが、のちにスタイルを変えて様々な人が使えるように公開したそうです。濃い字体と丸っぽいデザインの組み合わせで形作られていて、900万以上ものサイトで利用されています。, 大きいテキストや見出しにぴったりなのが、Ralewayとなります。9種類ものフォントがあり、800万以上ものサイトで利用されています。アップル用のフォーマットとオープンタイプのフォーマット両方ともダウンロードしてみてください。, ブエノスアイレスに住んでいるJulieta Ulanovskyさんによって作られたこちらのフォントは、モントセラトの古いポスターや標識からインスピレーションを受けたそうです。クラシックなスタイルで本文や見出しにぴったりのフォントです。18もの種類があり、 AlternatesとSubrayadaという姉妹フォントもあります。900万以上ものサイトで利用されています。, PTとはParaTypeの略称であり、1998年のロシア連邦のプロジェクトから由来しています。サンスフォントに加え、サンスセリフフォントもあり、PT sansは主にロシアの人に使われています。, このフォントは主にアプリのユーザインタフェースに使われているもので、とても読みやすくなるという効果があります。12もの種類があって、Adobeが初めて開発したオープンソースのフォントとなります。400万以上ものWebサイトが利用しています。, デスクトップやPC、モバイル機器にぴったりなのが、こちらのフォントとなります。歴史的なAlternate Gothic’ sans serifフォントに取って代わったので有名です。550万以上ものサイトで利用されています。, 印刷媒体にぴったりなのがLoraとなります。4つもの種類のスタイルがあり、どのような本文にも合うこと間違いなしです。カーブが効いたこのフォントは他と一線を画し、エレガントに見せることでしょう。150万以上ものサイトに利用されています。, こちらのフォントはWebサイトやページにぴったりです。9つもの種類のスタイルがあり、14-48pxのサイズの範囲で使うことをおすすめします。一番ボールド体のフォントは印刷にも向いています。, これらはグーグルフォントの中でもたった10個のフォントですが、あなたのニーズに合うこと間違いなしです。グラフィックデザインのプロジェクトをする際に大事なのは、どのようなフォントがマーケティングやキャンペーン、投稿、オンラインページに合うか把握することです。, あなたにぴったりなフォントを見つけて、どのようなフォントを使ったのか是非とも教えてください!, 知っておきたい!ブランドのイメージを左右するロゴの書体デザインのための5つのヒント, かわいいものからスタイリッシュなものまで!プロジェクトに最適な25の無料コミックフォント. ノーマルに使えて、O Qなどが丸すぎないのでシャープな印象(12style), ■Oswald  Abhaya Libreよりは縦長で少し癖がある(6style), ■Sorts Mill Goudy ひょろっとした脱力系フォント  3. 日本語フォントとおすすめ英文フォント17選. 変わったフォントや特徴的なフォントが良いフォントなのではない。理想的なフォントというのは、悪目立ちせず、印象にも残らないのだけど、よくよく見てみるとその制作物の雰囲気にバッチリと合っているもの。奇抜なファッションよりもさりげなく似合う服が好感度を上げてくれるのと同じことだ … https://t.co/g5dp3e622g pic.twitter.com/lePJIRgbIU, — Google Fonts (@googlefonts) August 7, 2018, その次に、人気ものの並びに、急速に成長してきている注目すべき新しいフォントもご紹介します。それでは…, RobotoはChristian Robertsonによるサンセリフ製品で、GoogleがAndroidのシステムフォントとして開発したものです。最近、非常に人気になり12種類のスタイルもあります。Google Fontsの分析データにも何回も出現します。たとえば、Robotoは最も人気のあるフォントですが、Roboto Condensedは6番目に人気のあるフォントで、Roboto Slabは13番目です!, Open SansはSteve Mattesonにより開発されたサンセリフフォントです。Open SansがGoogleのウェブサイトの一部または印刷広告書類とウェブ広告で使用されます。, SlaboはTiro TypeworksのJohn Hudsonにより開発されたセリフフォントです。このフォントのユニークな点は、特定のサイズ(必要に応じて27pxまたは13px)で使用できるように設計されていることです。, Oswaldは、もともとVernon Adamsにより開発されたサンセリフフォントです。, Source Sans Proは、Paul HuntがAdobe向けに作成されたサンセリフフォントです。Adobeの最初のオープンソースフォントです。, Montserratは、名祖のブエノスアイレスのモントセラトに住んでいるJulieta Ulanovskyによるサンセリフのフォントです。スタイルが18種類もある為、かなりの選択肢があります。, Ralewayは、もともとMatt McInerneyにより作成されたスタイルの18種類もある幅広いサンセリフのフォントファミリーです。Ralewayのお好みの方には、Raleway Dotsもお勧めします。似たようなスタイリングですが、点で書いているフォントで、ヘッドラインにピッタリです。, PT Sansは、ロシア連邦のために開発されたもので、アルファベットとキリル文字の両方を含みます。PTファミリーにはセリフのおプシンも含むフォントが他にもたくさんあります。, Loraは人気のあるセリフフォントで、画面と印刷の両方で読みやすいように設計されています。, 数値だけをみると、上記の10種類のフォントが最も人気のあるGoogleフォントです。しかし、最も人気のあるフォントのみをご紹介することにより、まだ広く知られていない新しいフォントがかわいそうですね。, 次に、分析データのトップに登場しなかった当社のスタッフの好きなフォントのいくつかをご紹介します。, NotoはGoogleが委託したフォントで、セリフとサンセリフの両方のバージョンがあります。定期的に更新されるNotoには現在、フォントが100種類以上もあります!, Nunito Sansはの使用回数が急速に増えているサンセリフフォントです(使用回数は昨年より3倍になりました)。, Promptは、タイのコミュニケーションデザイン会社であるCadson Demakによるサンセリフ製品です。, Work Sansはスクリーン上で使用するために最適化されたサンセリフフォントです。設計者は14px~48pxを対象にミックスウェイトスタイルを使用することを推奨しています。, 1種類のGoogleフォントを選択するのも大変ですが、ウェブサイトのフォントの組み合わせを決定するのはさらに難しいです!ありがたいことに、一人で決めなくてもいいです。最高のGoogleフォントの組み合わせを考え出すには、いい方法がいくつかあります。, まず、Google Fontsウェブサイト自体をスクロールダウンすると、人気のある組み合わせが表示されます:, または、Font Pairなどのウェブサイトを使用することによりもさらなる推進事項が出てきます。, Google Fontsの完璧なフォントを見つけたら、WordPressでそのGoogleフォントを使用するためのベストプラクティスもご紹介します。, Montserrat及びRalewayなどのフォントには、18種類のフォントウェイトもあります。選択肢が多くて確かに良いことですが、WordPressウェブサイトの読み込み時間が悪化するため、18種類のウェイトをすべて加えない方がいいです。これはとても重要です!, ほとんどのフォントでは、原則として最大3種類のウェイトを使用することをお勧めします:, 今日、WordPressウェブサイトの多くでは、イタリック体が全くなく、2種類のフォントウェイトしか使用されません。Google Fontsを自分で埋め込んでいる場合は、Google Fontsの「カスタマイズ」タブで使用するウェイトを選択できます:, 現在、ほとんどのWordPressテーマには、使用するGoogleフォントとウェイトが含まれています。しかし、テーマの開発者が必ずしもパフォーマンスに集中しているわけではありません。したがって場合により、テーマでGoogleフォントを無効にし、自分で追加した方がいい場合があります。, または、可変フォントも普及しはじめ、最新のブラウザのすべてでサポートされています。1つのフォントファイルが各プロパティと一緒に変換できるため、素晴らしいものです。ただし、まだ無料のフォントがあまり用意されていません。一方、GoogleのEarly Accessには可変フォントもいくつかあります。, Googleのサーバーからフォントを提供するのではなく、フォントをローカルでホストすることもできます。これにより、パフォーマンスが向上することがあります。一方、ほとんどのGoogleフォントは既に訪問者のブラウザにキャッシュされている可能性が高いですので、ご注意ください。独自のパフォーマンステストを行うことをおすすめします。, Kinstaのウェブサイトでも使用しているBrandonフォントなどのGoogleフォント以外のプレミアムフォントをご使用の場合は、ローカルにホストする(そしてCDNから提供する)ことが最善の方法です。本件の詳細については、当社のフォントをローカルにホストする方法についての記事をご参照ください。, WordPressのプラグイン及びテーマと同様に、フォントは時間が経つと更新かつ改善されるものです。なお、リスクはWordPressのプラグインほど深刻ではありませんが、定期的なアップデートのあるフォントを選択する価値があるでしょう。例えば、GoogleのNotoファミリーは、2014年以降定期的に更新されています。, 本リストに載っているフォントの大半は人気があるため、上記のすべてのフォントが定期的に更新かつ改善される可能性は高いでしょう。本リスト以外のフォントを選択しても、更新されるほどの人気のあるものにした方が良いでしょう。, 世界保健機関(WHO)によると、2017年現在、視力障害の人数は約2億5300万人です。そのうち、3600万人が盲人であり、2億1700万人が弱視者です。, Googleフォントを使用しているときは、その色やサイズなど、CSSでの表示の形が設定できます。したがって、Web Content Accessibility Guidelines (WCAG) 2.0(ウェブコンテンツアクセシビリティガイドライン)に従うことをご注意ください。これにより、誰でもそのコンテンツにアクセスできるようになります。, アクセシビリティは、視覚、聴覚、身体、発話、認知、言語、学習、神経の障害を含む、広範な障害に関係している。このガイドラインは、広範囲に及ぶ事項を網羅しているが、障害のすべての種類、程度、組合せからくるニーズを満たすことはできない。, 例えば、色のコントラストは非常に重要なガイドラインです。Kinstaのウェブサイトの古いデザインでは、フォントはあまりにも薄すぎて、読みにくかったです。最高のコンテンツを書いているのに読者が読めないことこそは好ましくないですね!, fyi guide page font is a bit too light making it hard to read – darker font would be better , — George Liu (@centminmod) August 14, 2016, WebAIMのColor Contrast Checkerのようなツールを使用することにより、フォントの色が推奨事項に合格しているかどうかが確認できます。以下は、本記事の色がテストに合格した画面です。, Googleフォントは何百万のウェブサイトで使用されているすばらしいものです。フォントウェイトを制限すること、(場合により)ローカルにホストすること、アクセシビリティのガイドラインに従うことなどのベストプラクティスに従うことにより、訪問者にとってより良いユーザーエクスペリエンスを提供できます。, そこで、あなたのお気に入りのGoogle Fontsのフォントとフォントの組み合わせは何ですか。コメントを書いてご意見をお寄せください。当社のフォントについての詳細記事も是非お読みください。, この記事が面白いと思った方は、KinstaのWordPressホスティングプラットフォームも大好きでしょう。ウェブサイトをスピードアップし、当社のベテランのWordPressチームからの24時間365日のサポートを是非ご利用ください。Google Cloudを使用したインフラストラクチャは、自動スケーリング、パフォーマンス、およびセキュリティに重点を置いています。Kinstaの魅力をご案内させてください。当社のプランをご確認ください。.