ブログに最適な10のWebセーフフォント(HTMLとCSSを使用)

フォント。私たちは毎日彼らに会います。印刷広告から雑誌まで、世界中にはあらゆる種類のフォントがあります。読めない限り、おそらく適切な媒体に適切なフォントを選択することの重要性を理解しているでしょう。


ブログやウェブサイトでは、自分のスタイルに最適なフォントを選択することが重要ですが、より重要なのは、それらがウェブセーフフォントであることです。.

Webセーフフォントとは?

すべてのオペレーティングシステム(windows、mac、android、iosなど)には、一定量の組み込みフォントが付属しています。問題は、OSによってシステムにインストールされている書体が異なる可能性があることです。.

これがWeb Safeフォントの出番です.

Webセーフフォントは基本的に、すべてのプラットフォームとさまざまなシステムで共有および表示可能なフォントスタイルです。.

Webフォント埋め込みサービス

Google Webフォント または タイプキット サーバーでホストされているフォントの使用を許可するシステムです。 Typekitは、Google Web Fontsとは異なり、フォントの数、サイトのトラフィック、およびドメインの数に基づいて価格を設定します.

Googleのおかげで、Google Web Fontsは完全に無料で使いやすくなっています。たとえば、次のようなフォントタイプを選択できます。 ラト, オープンサンズ または ティノス. 生成されたコードをドキュメントのに貼り付けます。そして、あなたはすべてCSSでそれを参照する準備が整いました.

詳細は、初心者向けの基本的なHTMLを以下に示します。.

Webセーフフォントが重要な理由?

印刷に関しては「見たとおりのものが得られる」のですが、Web上では、画面に表示されているものが他の人の画面と完全に同じではない場合があります.

以下に例を示します。あなたが採用したデザイナーが、サイトのテキストデザインに非常に豪華であいまいなフォントファミリーを使用するとします。訪問者が特定のフォントをコンピュータにインストールしていない場合、またはWebフレンドリーな場所から取得していない場合は、Times New Romanなどのデフォルトのフォントのバリエーションがすべて表示されます。.

見栄えの良いフォントを備えた美しくデザインされたサイトがあるかもしれませんが、訪問者が読み込めない場合でも、見た目が悪く、見苦しくなります。.

これらのWeb Safeフォントがあれば、誰もアクセスできないフォントを選択しただけで、テキストが奇妙に見えることを心配する必要がなくなります。.

ウェブサイトの作成方法(ステップバイステップガイド)を知りたい場合は、リンクをクリックして、最近公開された記事の1つを確認できます.

おすすめのウェブセーフフォント10選

これで、Webセーフフォントの重要性がわかったので、今度はそれらのフォントをサイトで使用し始めます。.

選択できるフォントはたくさんありますが、これらの10個のWebセーフフォントをHTMLおよびCSSで使用することをお勧めします。彼らは広く使用されており、かなりよく見えます.

1. Arial

ArialArialフォントファミリーの例

ウェブサイトをロードすると、Arialフォントが使用される可能性があります.

このサンセリフフォントは最も 広く使われています フォントであり、すべてのWebセーフフォントの標準と見なされています。専用フォントの代わりとして使用されることが多いため、Windowsデバイスでは使用できません。.

2. Helvetica

ヘルベチカHelveticaフォントファミリーの例

ArialフォントがクリーンでプロフェッショナルなWebサイトの主役である場合、Helveticaはデザイナーの選択になります.

Helveticaはより大胆なデザインを可能にするより様式化されたサンセリフフォントを提供します.

3.タイムズニューローマン

回新しいローマTimes New Romanフォントファミリーの例

古いTimesフォントの新しいバリエーション.

Times New Romanは、Microsoft Wordの標準のセリフフォントであるため、おそらくほとんどのWindowsユーザーが精通しているものです。 Arialと比較して、Times New Romanのデザインは少し伝統的です.

4回

回Timesフォントファミリーの例

Timesがおなじみのように見えた場合、それは古い新聞の印刷に使用されている標準のフォントであったためです。.

Timesは最も伝統的なフォントと見なされており、印刷物や新聞以外ではほとんど使用されません。.

5. Trebuchet MS

trebuchet-msTrebuchet MSフォントファミリーの例

もともと90年代にマイクロソフトによって設計されたTrebuchet MSは、 刺激を受けた 古い中世スタイルのフォント.

Windows XPのメインフォントとして、およびWeb上のボディコピーフォントとして一時的に使用されました。.

6.ヴェルダーナ

バーダナVerdanaフォントファミリーの例

VerdanaはWebフォントの最も安全な選択肢の1つで、シンプルなセリフ線と非常に大きな文字をデザインに利用しています.

細長いフォントの外観は、ネット上で読むのが最も簡単なフォントの1つであり、多くのブロガーにとってしばしば選択されるフォントです。.

7. Arial Black

arial-blackArial Blackフォントファミリーの例

Arialフォントが気に入っていて、より大胆で大きなものを望んでいる場合は、Arial Blackで問題はありません。このフォントは、人々がHelveticaスタイルの太字フォントを使用したいが、ライセンスの支払いを望まなかったときに生まれました。.

8.宅配便

宅配便Courierフォントファミリーの例

古いモノスペースフォントは、ほとんどすべてのデバイスとオペレーティングシステムで「独自の」フォントの代わりに使用できるため、Courierは誰にでも馴染みがあるはずです。.

最もスタイリッシュなフォントではありませんが、非常に読みやすく、すっきりとしたデザインです。.

9.新しい宅配便

宅配便新品Courier Newフォントファミリーの例

タイムズと同じように、クーリエもクラシックなスタイルを近代化する再設計を行いました.

Courier Newは、等幅フォントと見なされ、ほとんどのデバイスおよびオペレーティングシステムで使用できます。.

10.ジョージア

ジョージアジョージアフォントファミリーの例

ほとんどのウェブサイトではVerdanaが一般的に安全な選択肢ですが、同じフォントサイズで少し大きい文字のフォントが必要な場合は、ジョージア州が適切です。.

注意すべきことですが、このフォントは特定の状況で機能し、他のセリフフォントではうまく機能しません(Times New Romanの横では非常に小さく見えます)。.

絶対に使用しないでください:Comic Sans MS

確かに、面白くてちょっと風変わりですが、ウェブサイトを真剣に受け止めたい場合は、Comic Sans MSを絶対に使用しないでください。.

漫画Comic Sans MSフォントの例

sans-serifフォントは、コミックのレタリングをさりげなく取り入れたもので、一般的には非公式文書や子供向けの資料に使用されます。児童書や漫画本を書いているのでない限り、Comic Sans MSは使用しないでください!

要約

ウェブセーフフォントの目的は、ウェブサイトでデザインしたフォントが他のデバイスやプラットフォームで意図したとおりに表示されることを確認することです。一部のフォントは機能しない可能性がありますが、サイトのフォントを美しくする優れたデザインがいくつかあります.

どんな状況でもComic Sans MSを使用しないことを約束してください.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map