私たちは毎日フォントを扱っています。しかし、私たちは彼らの存在を真剣に気にかけたことはありません。私たちはそれらをうまく使用していないか、虐待していません。私たちはそれらを知らないからです。フォントは、植物の重要な要素の1つです。この記事では、この深い知識をあなたと話し合いましょう。 フォントタイプ 英語のフォント（書体）は、いくつかの主要なカテゴリに分かれています。 1。セリフ セリフは、ストロークの端の装飾的な部分です。下の図の赤いマーキングはセリフです。 Serif設計の当初の意図は、ストロークの終わりをより明確に示し、認識率を改善し、読み速度を改善することです。さらに、Serifフォントを使用すると、人々がより正統的に感じるようになります。したがって、私たちの一般的な英語の本、特に論文や小説の多くは、セリフを使用してメインテキストを完成させます。 ウェブデザインで一般的に使用されるセリフは、新しいローマとジョージアです。下の写真の左側は、12pxの新しいローマのフォントで、右側は12pxのジョージアです。 中国語では、使用する曲のフォントは対応するセリフフォントです。 2。SANS-SERIF/SANS-SERIF フォントがserifではない場合、sserifまたはsans serifと呼ばれます。次の図はsanserifです。 Webデザインで使用される比較的一般的なSANSセリフがあります。 Arial、Verdana、Tahoma、Helivetica、Calibriなどがあります。次の図は、アリアル、ヴェルダナ、タホマです。 Serifフォントは本で広く使用されていますが、Serifフォントがインターネットではめったに使用されないことは注目に値します。コンピューター画面の解像度は本の解像度に匹敵しないため、コンピューター画面に10〜12pxテキストのセリフフォントを認識することは困難です。以下の写真は、10pxのVerdanaとCleartypeなしの10pxの新しいローマのRomanの比較です。左側のヴェルダナがよく識別できることがわかります。右側の新しいローマンを特定するのは非常に困難です。 3。モノスペース 独占フォントは、実際には西部のフォント専用です。英語の文字の幅は異なるためです。たとえば、私はmよりもはるかに狭いです。プログラミングの場合、コードが表示されます。文字の幅が等しくない場合、レイアウトは醜くなります。 DOSコマンドラインでは、Monospaceフォントが使用されていることがわかります。 プログラミングに必要なモノスペースフォントには、次の要件があります。 1.すべての文字の幅は等しい。 2。簡潔で、明確で標準化された文字形状。 3。128以上のASCIIコードで拡張された文字セットをサポートします。 4。白文字文字（ASCII：0×20）は他の文字に等しい。 5。「1」、「L」、「I」などの3人の文字が簡単に区別できます。 6.「0」、「O」、「O」などの3つの文字は簡単に区別できます。 7.二重引用符と単一引用符の前面と背面部分は、簡単に区別できます。また、ミラー対称性を持つことが最善です。 8。句読点の形、特に巻き毛の装具、丸いブレース、正方形のブレース。 一般的なモノスペースフォントには、宅配便、宅配便が含まれます 4。書道 名前が示すように、手書きは手書きスタイルのフォントです。また、書道フォントとも呼ばれます。ほとんどの中国の書道フォントは比較的硬いです。私は個人的に日本の書道フォントを使用することをお勧めします。日本の書道フォントは、より柔らかく、より人道的です。ただし、日本の書道フォントを使用することの欠点は、それらのほとんどが伝統的であり、多くの漢字が欠落していることです。 5。シンボル Windowsで最も有名な象徴的なボディはウェブです（Windows 95にいたときに使用するのが大好きだったことを覚えています...）。ここにいくつかのウェビングフォントがあります： フォントスタイル 一般的なフォントスタイルは、次のように分かれています。通常、太字、斜体。 簡単に言えば、太字は、フォントがより暗く、より「厚い」ことを意味します。斜体とは、キャラクターの軸をわずかに傾けることを意味します。それらはすべて、スペース内の特定の段落を強調するために使用されます。 太字について話すとき、Font-Weight属性をCSSで簡単に関連付けることができます。通常使用する通常と太字に加えて、Font-Weight属性値には、Bolder、Lighter、100〜900などのプロパティもあることを知っています。では、100〜900の値は何ですか？100〜900にはユニットがありません。優れたフォントは、さまざまなフォントウェイトに異なるデザインを提供します。フォントに、事前に異なるレベルの厚さの設計が組み込まれている場合、これらの値はそれぞれ各レベルに対応します。たとえば、チューリッヒフォントには、チューリッヒライト、チューリッヒレギュラー、チューリッヒミディアム、チューリッヒボールド、チューリッヒブラック、チューリッヒウルトラブラックの6つのフォントが含まれています。このように、チューリッヒライトは3つの値に対応します：100、200、および300、チューリッヒレギュラーは400に対応します。これは「通常」であり、チューリッヒ媒体は500に対応し、Zurich Boldは「Bold Bold」は600に対応します。 700、チューリッヒブラックは800に対応し、最後に、チューリッヒUltrablackは900に対応します。 中国の斜体の場合、それは一般的にインターネットでは使用されていません。中国語には多くのストロークがあるため、使用するかどうかを特定することは困難です。 ユニット 一部のユニットは、当社のWebデザインで使用されます。 1。ポイント（PT、ポイント） 72ポイント= 1インチ、1インチは72ポイントです。さらに、1ピックアップ（PICA）= 12ポイント 2。ピクセル（ピクセル、px） ピクセルはコンピューター画面上の最小の画像ユニットであり、レイマンの用語では、画面上の最小のドットです。 3。DPI、PPI DPIのフルネームはインチあたりのドットで、PPIのフルネームは1インチあたりピクセルです。それらは解像度の単位です。つまり、1インチの長さで配置できるポイント（ピクセル）の数。たとえば、一般的に、私たちのモニターは約72ppiです。これは、長さが1インチ、72ドット（ピクセル）を意味します。 DPI/PPIが高いほど、解像度が高く、つまり粒子が小さくなるほど、画像が繊細になります。一般的に言えば、写真の解像度は240DPIから300DPIの間であるので、なぜ画面よりも写真がはるかに詳細に見えるのですか？雑誌印刷は133または150dpiを使用し、高品質の本は350-400dpiを使用します。これは、印刷されたときに175〜200dpiを使用するため、350-400dpiです。それでは、なぜ画面で読むよりも、本の中で同じ物理サイズのテキストを読むことがはるかに明確なのでしょうか？つまり、前述のことですが、なぜSans-Serifフォントを英語の本を印刷するために大胆に使用できるのですか？ 基本的にDPIとPPIに違いはありません。本当に違いを見つけたい場合は、唯一の違いは、DPIがスキャナーとプリンターを説明するためによく使用されることですが、PPIはしばしば画面の解像度を説明します。 4.ex、x-height CSSでよく使用されます。 1ex =小文字xの高さ。 5.Em CSSでよく使用されます。もちろん、EMは小文字mの高さを表していません（実際、小文字mの高さは一般に、小文字xの高さと同じです）。 1EM =フォントのサイズの100％。複数のユニットです。 間隔 1。ラインハイト、リーディング ライン間隔（Line-Height、Lead）に関しては、最初にベースラインと呼ばれる用語を学習する必要があります。私たちが最初に英語を学んだとき、私たちが文字を書くために使用したライングリッドの本を覚えていますか？ベースラインは、ほとんどの文字が「座る」フォントの下降部分の上の直線です。ほとんどのフォント、大文字は常にベースラインに固執し、ベースラインの上にあります。中国のフォントは、英語の大文字のフォントと同じです。下の図の赤い線はベースラインです。 次に、線の間隔は、2つの隣接する線とベースライン間の距離を指します。ライン間隔の単位は、フォントサイズに応じてライン間隔を定義するためによく使用されます。ブラウザでは、デフォルトの行間隔にルールはありません。 W3Cが提供するアドバイスにより、デフォルトのライン間隔は1.0EMから1.2EMである必要があると考えています。実際、ラインの間隔を設定すると、版画には原則があります。つまり、読書は読み取りの際に簡単に「シリアル化」します。適切なライン間隔は、テキストの各行を分離できるため、目が前または次の行を簡単に区別できます。近年、ほとんどの人は、1.5EM、特に中国のウェブサイトのライン間隔を持つウェブ上のメインテキストのレイアウトが好きです。つまり、12pxのフォントサイズが使用されている場合、デザイナーはしばしば18pxライン間隔が好きです。 1.5EMは確かに良い経験です。実際、中国の論文の仕様では、1.5EMのライン間隔も使用しています。 2。文字間隔、追跡 単語間隔とは、文字のグループ間の距離を指します。文字の間隔は、行または段落のテキストの密度に影響します。 3。カーニング Keringは、視覚的なニーズのために行われる技術的な処理です。簡単に言えば、2つの特定の文字が配置されたら、個別に一意の文字間隔を指定できます。たとえば、首都Aの後に小文字Vが続くと、2人の文字（実際、文字間隔は同じ）の間に視覚的に大きな間隔が表示されますが、これは通常の文字間隔では解決できません。それらが縮小された場合、他の文字はボールに接続されます。現時点では、それを処理するためにKerning調整が必要です。次の図は、カーニングを使用する例を示しています。 段落 1。社長（測定） 行の長さとは、テキストの段落の幅を指します。以下に示すように： 大統領に関連する2つの読みやすさの問題があります。 ラインの長さが長いほど、ライン間隔が大きくなります。ライン間隔が小さすぎるため、NewLinesを読むときに読者がシリアル化しやすくなります。ライン間隔が大きすぎると、読者は線を読むときにテキストが不連続であると感じるでしょう。 テキストでは、1行あたり40〜70文字を持つことをお勧めします。 2。アライメント 基本的に、パラグラフには4種類のアライメントがあります。左（左フラッシュ）、右（右フラッシュ）、中央（中心）、正当化されています。 左アライメントとは、テキストコンテンツを設定し、テキストの水平間隔を調整し、段落または記事のテキストを水平方向に左に合わせたアライメントメソッドを指します。左のアライメントは、記事の左側にあるテキストにきちんとしたエッジを与えます。同時に、テキストの右側は不均一になります。したがって、左側の英語のアライメントは、右にも右とも呼ばれます。これは、不均一な外観の右側を意味します。右アライメントは同じです。 センターアラインメントとは、テキストコンテンツを設定し、テキストの水平間隔を調整し、段落または記事のテキストを中央への水平方向に整列させるアライメントメソッドを指します。記事の両側にあるテキストが中央にきちんと集中しているように、中心を調整して、段落または記事全体がきちんと配置されるようにします。 両端を調整すると、テキストコンテンツの両端を設定し、テキスト/単語の水平間隔を調整して、左と右ページのマージンの間に均等に分布することを意味します。両側のテキストがきちんとしたエッジを持つように、両端を整列させます。 両端を使用して整列すると、両側のアライメントラインが明確になり、テキストブロックの「速い」感覚が明らかになります。ただし、英語の組み立てでは、ラインの長さが非常に短い場合、2つの端を使用して、間隔が長すぎる線を作る可能性があり、間隔が短すぎるため、不均一な間隔は非常に厄介ですどこにでもパッチが付いた衣類の。 3。読みやすさの容易さ リテラシーは、タイポグラフィのテキスト読み取りの容易さと快適さを説明しています。実際、これは通常のデザインの最も基本的な目的です。上記の原則のいくつかに加えて、私は読みやすさの小さな原則を含め、あなたと共有しました。 デザインは最大3つのフォントサイズを使用します。 1つのデザインで最大3つのフォントが使用されます。 特定のコントラストを確保する必要がありますが、過度のコントラストは必要ありません。 Yangテキスト（白い背景の黒い文字）は、Yinテキスト（黒の背景の黒い文字）よりも読みやすいです。 #FFFFの背景には、＃333テキストを使用すると、＃000のテキストよりも快適に見えます。 テキストの背景に注意してください。背景は独身でなければなりません。バックグラウンドノイズを避けてください。 「Less Is More」は、最小の要素を使用して最も多くの情報を伝えます。 リンクをリンクのように見せます。 あなたのスペースをうまく利用してください。