Google Fontsで学ぶWebフォントの基本
- カテゴリー
- CSS >
- Webフォント／アイコンフォント
全2回
Google Fontsを例にWebフォントの仕組みを基礎から解説します。また、Next.jsを例にWebフレームワークでWebフォントがどのように扱われているかも押さえましょう。
第2回 preconnectとCORSを理解する
Webフォントの読み込みを最適化するpreconnectの仕組みと、フォントに必須のCORS・crossorigin属性について解説します。
第1回 Webフォントが表示されるまで
まずはGoogle Fontsを例にWebフォントがどのように読み込まれ、ブラウザのページ上に表示されるのか、その過程を追ってみます。