事前チェック

赤・黄・緑のステータス表示で、エクスポート前にSVGグリフを確認します。

Preflight Checkは、生成フォントを不安定にしたり、マッピングを難しくしたり、表示位置をずらしたりする問題を見つけます。

確認する項目

• Unicodeの競合
• 重複したグリフ名
• 空のSVGファイル
• 塗りや線のアウトラインが見えないSVG
• 異常なSVGキャンバスサイズ
• viewBoxの欠落
• SVGキャンバス外の素材
• 予想されるベースライン、アセンダー、ディセンダー範囲外の素材
• 対応していないSVG要素と属性
• 外部SVGリソース
• グリフの複雑さの上限

ステータスの色

• 緑: 準備完了
• 黄: 警告。エクスポート前に確認してください。
• 赤: エラー。グリフが無効または未対応の可能性があります。

ビルドの動作

Preflightは確認のためのステップであり、無条件のブロッカーではありません。

問題が見つかった場合は、合格したグリフだけをビルドすることも、すべてのグリフでネイティブビルドエンジンを続行することもできます。エクスポート時に対応外または安全でない入力が拒否される場合はあります。

よくある修正

• ライブSVGテキストをアウトラインへ変換
• SVGからラスター画像を削除
• クリッピングパス、マスク、フィルター、不透明度効果をフラット化
• 安定したviewBoxを追加
• 素材をキャンバス内に収める
• 一意のグリフ名を使う
• ソースフォントのグリフを意図的に置き換える場合を除き、一意のUnicode値を割り当てる
• 極端に細かいパスを簡略化

アイコンフォントについて

アイコンフォントは、テキストグリフとは異なる位置に素材を置くことがあります。ベースラインやディセンダーの警告が意図的な場合もありますが、揃わない配置による見づらいアイコンフォントを防ぐために役立ちます。