ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
| この記事の要点 |
|
このカテゴリについて
フォント形式は、文字の字形(グリフ)とメタ情報(ヒンティング、カーニング、合字、ウェイト等)を 1 ファイルにまとめたものです。種類は多くなく、現代では TTF / OTF(OS 用)と WOFF / WOFF2(Web 用)の 4 形式を押さえておけば実務で困ることはほぼありません。
WOFF2 は Brotli 圧縮を内蔵しており、TTF の約 60%、WOFF(1 世代前)の約 75% のサイズになります。すべてのモダンブラウザがサポートするため、@font-face の src は WOFF2 をメインに、フォールバックすら省略するのが現代の Web 制作の主流です。
フォントで扱う主な拡張子
| 拡張子 | 概要 |
|---|---|
.ttf | TrueType Font。Apple/MS 共同開発、最も普及 |
.otf | OpenType Font。TTF の拡張、CFF アウトラインも可 |
.woff | Web Open Font Format。zlib 圧縮 |
.woff2 | WOFF2。Brotli 圧縮、Web 標準 |
.ttc | TrueType Collection。複数フォントを 1 ファイルに |
.otc | OpenType Collection |
.eot | Embedded OpenType。IE 用(現代は不要) |
.dfont | macOS のリソースフォーク形式 |
.pfb / .pfm | PostScript Type 1(廃止予定、Adobe が 2023 にサポート終了) |
.afm | Adobe Font Metrics(メトリクス情報のみ) |
.bdf / .pcf | ビットマップフォント(X11 / 古い端末) |
用途別の使い分け
| 目的 | 推奨形式 |
|---|---|
| Web サイトに埋め込み | WOFF2(フォールバックに WOFF) |
| OS にインストール(Win/Mac/Linux) | TTF / OTF |
| Office・印刷 | OTF(CFF アウトライン) |
| サイズ最小化したいアイコンフォント | WOFF2 + サブセット化 |
| 1 ファミリーで複数ウェイト統合 | 可変フォント(.ttf / .otf) |
関連カテゴリ・記事
- ファイル拡張子とは(概論)
- Web・データ・設定 — @font-face の書き方
ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
子ページ
人気ページ
- 1 Eclipseで「サーバーに追加または除去できるリソースがありません。」の原因と対処法
- 2 tomcat の起動 / 停止ログと catalina.log・catalina.out の違い
- 3 JavaScript base URL 取得方法|window.location.origin と SSR/Node.js 対応
- 4 YouTube Data API v3 エラー一覧|403/400/404 の主要原因と切り分け
- 5 Spring Frameworkのアノテーション一覧
- 6 Laravel エラー一覧|500/Blade/DB 接続/ルーティングの代表エラー
- 7 3Dグラフィックスとは|モデリング/レンダリング/主要ソフトウェア (Blender / Maya)
- 8 【Spring】@Valueアノテーションとは
- 9 CATALINA_HOME の確認方法 (Linux / Mac)
- 10 【Spring】@Autowiredアノテーションとは
最近更新/作成されたページ
- IPv6とは|128bitアドレス・コロン16進表記/::省略・リンクローカル・SLAAC・デュアルスタック NEW 2026-06-22 12:34:44
- MAC アドレスフィルタリングの仕組みと限界 | ネットワーク入門 NEW 2026-06-22 12:19:10
- VPNとは|暗号トンネル・サイト間/リモートアクセス・IPsec/SSL-VPN/WireGuardを解説 NEW 2026-06-22 12:19:10
- Web通信プロトコル入門 HTTP/2・HTTP/3・WebSocket・gRPC・WebRTC | ネットワーク入門 NEW 2026-06-22 12:17:25
- WebRTC とは ブラウザ間 P2P の音声・映像・データ通信 | ネットワーク入門 NEW 2026-06-22 12:17:25
- HTTP/2 とは 多重化・HPACK・バイナリフレーム | ネットワーク入門 NEW 2026-06-22 12:17:25
- HTTP/3 (QUIC) とは UDP ベースの低遅延 Web 通信 | ネットワーク入門 NEW 2026-06-22 12:17:25
- WebSocket とは 全二重リアルタイム通信 ws/wss | ネットワーク入門 NEW 2026-06-22 12:17:25
- gRPC とは HTTP/2 + Protocol Buffers の高速 RPC | ネットワーク入門 NEW 2026-06-22 12:17:25
- ファイアウォールとは|パケットフィルタ・ステートフル・DMZ・次世代FW(L4/L7)を解説 NEW 2026-06-22 12:17:24
- TLS/SSLの仕組み|ハンドシェイク・暗号スイート・前方秘匿性・証明書検証をわかりやすく解説 NEW 2026-06-22 12:17:24
- CDN とは エッジキャッシュ・TTL・Cloudflare/CloudFront | ネットワーク入門 NEW 2026-06-22 12:17:24
- iptables/nftablesとは|テーブル・チェーン・ルール例・永続化をLinux視点で解説 NEW 2026-06-22 12:17:24
- HAProxy とは frontend/backend と設定例 | ネットワーク入門 NEW 2026-06-22 12:17:24
- 証明書と認証局(CA)とは|X.509・信頼チェーン・DV/OV/EV・失効(CRL/OCSP)を解説 NEW 2026-06-22 12:17:24
コメントを削除してもよろしいでしょうか?