代替フォントとレイアウトのテスト
フォントワークベンチ
テキストに合わせて細部を調整
Webフォントの読み込み前にテキストがどう変わるか確認しましょう。メイン、代替、調整済み代替フォントを比較し、レイアウトのずれを抑えるためのCSSを書き出せます。
TTF · OTF · WOFF · WOFF21ファイル10 MBまで · 合計32 MBまで非公開アップロード · カタログ不要
1
フォントファイルから始める
アップロードする権利のあるフォントを使用してください。TTF、OTF、WOFF、WOFF2に対応しています。
2
プレビュー・調整・比較
文字チェックでは不足するコードポイントを確認します。表示されたテキストも必ず確認してください。
このサンプル用の初期値です。フォントのパスを置き換え、ほかの文章と対象ブラウザで試してください。メトリクスの上書きにはメインフォントのデフォルトメトリクスを使用します。
役立つ結果を得るには
メインフォントをアップロードし、ローカルの代替フォントを選ぶか別のフォントをアップロードします。テキストと段組み幅を設定し、サンプルに合わせて調整します。行数とブロックの高さを確認してサイズを微調整し、CSSを保存して仮のパスを自分のファイルに置き換えてください。
確認しておきたいこと
これはテキストレイアウトの比較であり、CLSスコアの測定ではありません。提案値はデフォルトインスタンスでのこのサンプルに対応します。文章、スタイル、ブラウザ、OSによって結果は異なります。ローカルの代替フォントは閲覧者の端末に必要です。アップロードした代替フォントにも読み込みが必要です。
プレビューは非公開で、15分後に期限切れになります。作業領域をクリアすると早期削除を要求できます。生成したWebフォントキットも一時的なもので、自動的に期限切れになります。
すべてのフォントツールを見るカスタムフォントをアップロードして確認中…準備できました。自分のテキストで試してください。フォントを処理できませんでした。ファイルを確認して再試行してください。比較は最大4フォント、ほかのツールはメインフォントを1つ選択してください。各ファイルはTTF、OTF、WOFF、WOFF2形式で10 MB以下、合計32 MB以下にしてください。少なくとも1つの可変軸を持つ可変フォントを選んでください。不足する文字:このサンプルのすべての文字に対応するコードポイントがフォントにあります。取り除くフォントをアップロードして始めましょう。可変軸OpenType機能Unicode文字グリフ静的フォントキットを生成静的フォントキットをダウンロードこのフォントを変更し、Webで使用する権利があります。そのローカルフォントは利用できません。別のものを選ぶか、代替フォントをアップロードしてください。このブラウザは調整済みプレビューに必要なメトリクスの上書きに対応していません。行数テキストの高さメインフォント代替フォント調整済み代替フォントサイズ調整デフォルトインスタンステキストフォントサイズテキスト列の幅このサンプル用の初期値です。フォントのパスを置き換え、ほかの文章と対象ブラウザで試してください。メトリクスの上書きにはメインフォントのデフォルトメトリクスを使用します。静的フォントを生成・検証中…フォントファイルから始める軸の範囲内の値を入力してください。プレビューを削除しました。作業領域は空です。作業領域は空ですが、一部のプレビューの削除を確認できませんでした。自動的に期限切れになります。軸が変更されました。現在の設定で新しいキットを生成してください。このダウンロードは期限切れです。新しいキットを生成してください。太さ幅クラス静的フォント可変フォント既定オンオフ