WordPressにGoogleフォントを追加する方法

ウェブサイトのデザインとプロ意識を劇的に向上させる1つの方法は、優れたフォントを使用することです.


ほとんどの人は、自分のWebサイトで使用するフォントを二度と考えません。ただし、独自のテーマを開発している場合、または現在インストールしているテーマを編集している場合は、適切なフォント選択がプロセスの大部分を占める必要があります.

Webサイトのフォントまたはフォントの組み合わせを選択することは、単純で率直に言って非常に退屈な作業でした。使用できるWebセーフフォントはほとんどありませんでしたが、現在、膨大な数のWeb最適化フォントが継続的に作成されているため、どのフォントを使用するかを判断するのが難しい場合があります。.

の作成で Googleフォント さらに、900以上のフォントファミリを利用できるようになり、優れたフォントを選択するプロセスがさらに複雑になりました。ただし、ここ数年の間に、Google Fontsを中心とした開発により、これまでになく簡単に選択を実装できるようになりました。.

Googleフォントを使用する理由?

Google Fontsは、今日のWebで利用できる最大のフォントリソースの1つになりました.

使用できる900以上のフォントファミリがあるだけでなく、それらはすべてオープンソースフォントであり、だれでも作成および拡張できます。.

フォントを作成するデザイナーは、フォントをGoogleのディレクトリに含めるために検討プロセスを経る必要があります。つまり、世界中の何千人ものデザイナーにアクセスできるだけでなく、フォントが完全でWeb最適化されていることを確認しない限り、フォントをディレクトリに追加することはできません。.

以前はさまざまなフォントを使用していたため、ブラウザにフォントを適切に表示するには、ユーザーが自分のコンピュータにフォントをインストールする必要がありました。 Google Fontsを使用すると、すべてのフォントにGoogleディレクトリから直接アクセスできるので、実質的にどのブラウザーのどのマシンでも機能します。これは、ウェブサイトを開発するための前例のない量のデザインの自由を開きます.

ウェブサイトでGoogleフォントを使用する方法?

合計WordPressテーマなど、一部のWordPressテーマには、Googleフォントを簡単に変更するためのテーマに組み込まれたオプションが含まれています。に移動します カスタマイザ をクリックして タイポグラフィ テーマ全体の要素のメインフォント、フォントサイズ、フォントの太さ、さらには行間隔を編集するためのタブ.

合計テーマフォントオプション

ただし、別のテーマを使用している場合は、Googleフォントを手動で追加するか、プラグインを使用できます.

Googleフォントを追加するためのWordPressプラグイン

サイトにGoogleフォントを追加するための最良の無料プラグインの1つは、WordPressリポジトリからダウンロードできる無料のEasy Google Fontsプラグインを使用することです。ただし、WordPressダッシュボードからダウンロードするのが最も簡単です。 WordPressサイトにログインして、 プラグイン>新規追加. 次に、「Easy Google Fonts」を検索するだけで、すばやく簡単にインストールできます.

情報とダウンロードデモを見る

サイトでフォントをカスタマイズするためのもう1つの優れたプラグインは、Yellow Pencil Live CSSエディタープラグイン(ニューヨークのWordPressテーマに無料で含まれています)です。このプラグインの利点は、クリックして編集するだけの簡単な方法でWebサイトのフォントを変更できることだけではありません。 WordPressテーマのすべての色、フォントサイズ、フォントの太さ、パディング、マージンなどをカスタマイズすることもできます.

使用するフォント?

Google Fonts Directoryの最大の強みも、あなたにとって人生を困難にする可能性があります。使用可能なフォントが多数あるため、適切なフォントの組み合わせを見つけて選択するのは難しい場合があります.

選択するフォントは、デザインで伝えようとしている内容に完全に依存します。フォントは、サイトの読者の興味を引くために使用されます。彼らはウェブサイトのさまざまな側面に注意を引くために使用され、優れたデザイナーは使用するフォントの非常に微妙な違いに驚異を感じることができます.

理解しておく必要があるのは、フォントと書体の違いです。これら2つの用語は、頻繁に、かつ誤って交換可能に使用されます。フォントは、文字、数字記号などの完全なコレクションです。そのコレクションのデザインを参照するときは、書体と呼びます。.

フォント分類

書体に適用できるさまざまな分類があります。それらは、セリフ、サンセリフ、ディスプレイ、手書き(またはスクリプト)、およびモノスペースです。他にも印刷物で使用されているものがありますが、今は気にする必要はありません。.

それらの違いは何ですか?

セリフ 書体には、各文字の端にぶら下がっている尾があります.

セリフ書体

サンセリフ 書体にはしっぽがない.

サンセリフ書体

表示 書体は珍しく装飾的です.

書体の表示

手書き 書体は手書きの筆記体またはブロックのように見える.

手書き書体

最後に, 等幅 フォントは、それぞれがまったく同じスペースを占める文字で構成されています.

モノスペース書体

Webデザインのフォントのベストプラクティス

使用するフォントを選択する際に従うべきいくつかのベストプラクティスガイドラインがあります。.

それは良いアイデアです 3つ以上の異なるフォントの使用を避けます あなたのサイトデザインで。 3つ以上のフォントのバランスを取るのは難しい場合があります。また、1つのサイトで2つ以上の書体を混在させると、深刻な視覚的な問題が発生する可能性があります.

タイトル用とコンテンツ用など、2つの異なるフォントを使用している場合は、同じ書体分類からそれらを選択しないようにしてください。それは 書体を組み合わせるのが最適. つまり、2つの異なるセリフフォントまたは2つの異なるサンセリフフォントの使用を避けます.

タイトルには非常にうまく機能するフォントがありますが、本文のコンテンツには理想的ではなく、その逆も同様です。読みにくいコンテンツにフォントを使用しているサイトがあります. コンテンツのフォントは簡潔で読みやすいものにする必要があります 一方 影響を最大化するためにタイトルフォントを使用する サイトの特定の領域に注意を引く.

WordPress用のGoogleフォントのまとめ

あなたが理解し始めているかもしれないように、あなたのウェブサイトのデザインのためにフォントを選択することは、トリッキーで複雑なプロセスになるかもしれません。 2つのフォントを選択するだけでなく、決定にははるかに多くのことがあります.

選択を確実にするために努力すべきいくつかの事柄があります。ヘッダークラ​​ス階層のバランスが取れていることと、ヘッダータグの相対サイズが小さくなっていることを確認してください.

優れたサイトデザインとタイポグラフィの戦いの半分は、フォントの選択と一致することです。これには、フォントサイズ、太さ、間隔が含まれます。 Google FontsとGoogle Typographyプラグインを使用すると、このプロセス全体がかつてないほど簡単になります。これらのリソースを使用しても、プロでバランスのとれたタイポグラフィは依然として課題.

それでも選択肢がわからない場合は、すべての選択肢の違いを理解しようとするときに、自分の選択が迷ってしまいます。プロのデザイナーにあなたのサイトを見てもらうときかもしれません.

ウェブサイトにGoogleフォントを実装しましたか? Googleフォントを含むテーマを最初から作成しましたか?タイポグラフィに関するあなたの考えとあなたの好きなフォントを下のコメントで聞いてください.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me