タイポグラフィ

フォント

特定のサイズ・ウェイト・スタイルにおけるタイプフェイスの実装。デジタルタイポグラフィでは、グリフ定義とメトリクスを含むフォントファイル(TTF・OTF・WOFF2)を指します。

· Updated

What is a Font?

A font is a collection of glyphs — visual representations of characters — designed with a unified visual style and packaged into a file that software can use to render text. In everyday speech "font" and "typeface" are used interchangeably, but there is a technical distinction: a typeface is the design family (e.g., Helvetica), while a font originally referred to a specific weight and size within that family (e.g., Helvetica Bold 12pt). In digital usage, a font file contains an entire typeface family or a single style within it.

Fonts are critical to Unicode rendering. No single font covers all 154,998 characters in Unicode 16.0. Instead, operating systems use font fallback chains: when a character is missing from the primary font, the renderer automatically substitutes a glyph from the next font in the chain that contains it.

Font File Formats

Modern fonts use the OpenType (.otf) or TrueType (.ttf) formats, which are functionally equivalent containers. Web fonts are distributed as WOFF (Web Open Font Format) or WOFF2 (compressed), which are wrappers around the same data.

Format Extension Best For
TrueType .ttf Windows/cross-platform compatibility
OpenType CFF .otf PostScript-based outlines, print quality
WOFF .woff Web delivery (legacy browsers)
WOFF2 .woff2 Web delivery (modern, ~30% smaller)
Variable Font .ttf or .otf Multiple weights/styles in one file

Unicode Coverage

Every font has a Unicode coverage — the set of code points for which it provides glyphs. Tools like fc-query (Linux), Font Book (macOS), or online tools like Wakamai Fondue reveal exactly which characters a font covers.

Fonts designed for broad Unicode support include: - Noto (Google): aims for complete Unicode coverage across all scripts - GNU Unifont: bitmap font covering the entire Basic Multilingual Plane - DejaVu Sans: covers Latin, Greek, Cyrillic, and many symbols

Variable Fonts

OpenType 1.8 introduced variable fonts, which encode an entire design space (weight, width, slant, optical size) as a single file with interpolation axes. Instead of separate Bold, Light, and Condensed files, one variable font file can render any point along those axes. This reduces HTTP requests for web fonts and enables smooth typographic animations.

/* Variable font usage in CSS */
@font-face {
  font-family: "Inter";
  src: url("Inter.var.woff2") format("woff2-variations");
  font-weight: 100 900;
}

h1 {
  font-family: "Inter";
  font-weight: 650; /* any value between 100–900 */
}

Quick Facts

Property Value
Typeface vs. font Typeface = design family; font = specific file/style
Max Unicode 16.0 characters 154,998 assigned code points
Most complete Unicode font Noto (Google), GNU Unifont
Web font formats WOFF2 (preferred), WOFF (fallback)
Variable font axis examples wght (weight), wdth (width), ital (italic), opsz (optical size)
Font fallback mechanism OS-level chain; controlled by font-family stack in CSS
CSS property for Unicode range unicode-range in @font-face (subset loading)

関連用語

タイポグラフィ のその他の用語

CSS unicode-range

CSS @font-face descriptor specifying which Unicode code points a font should cover. …

Em / En(タイポグラフィ単位)

Em:フォントサイズと等しい幅。En:Emの半分。エムダッシュ幅・エムスペース・エンスペース・CSSユニット(1em・0.5em)の定義に使われます。

Font Fallback

The mechanism by which a rendering engine substitutes glyphs from a secondary …

OpenType

Modern font format developed by Microsoft and Adobe supporting up to 65,535 …

RTL(右から左)

文字が右から左に流れるテキスト方向。アラビア語・ヘブライ語・ターナ文字などで使われ、正しい表示のために双方向アルゴリズムが必要です。

Web Fonts

Fonts downloaded by the browser to render text, declared via CSS @font-face. …

カーニング

視覚的な調和のために特定の文字ペア(例:AV・To・LT)間のスペーシングを調整すること。Unicodeの概念ではなくフォント機能ですが、Unicodeテキストのレンダリングに影響します。

グリフ

フォントによってレンダリングされる文字の視覚的表現。1つの文字が複数のグリフを持つ場合があり(合字・文脈形態)、1つのグリフが複数の文字を表す場合もあります。

スモールキャップス

小文字の高さの大文字字形。CSS:font-variant: small-caps。Unicodeにはラテン拡張(ᴀ〜ᴢ)に実際のスモールキャップス文字があります。

ゼロ幅文字

前進幅がゼロの文字 — レンダリングでは見えませんがテキスト動作に影響します。ZWSP(単語区切り)・ZWJ(結合)・ZWNJ(結合防止)・WJ(改行防止)などがあります。