デザイナーは猫 シルエットのSVGを作る際に保存設定で注意すべき点は何ですか？

作業の合間にちょっとした気付きがあって、それを共有したい。猫シルエットのSVGを保存する際、まず優先すべきは“形の再現性”と“汎用性”だと感じる。私自身、ロゴやアイコン用に何度もシルエットを作ってきて、保存設定で失敗するとせっかくの輪郭が崩れたり、別のアプリで開くと位置がズレたりすることを経験している。

具体的には、テキストは必ずアウトライン化しておく。フォントが埋め込まれていない環境だと文字が別フォントに置き換わってしまうし、シルエットに微妙な線が残る原因になる。ストロークを使っている場合は“ストロークをパスに変換”しておくと、線幅の扱いで見た目が変わるトラブルを防げる。また、viewBoxを正しく設定しておくことが重要で、これがないと縮尺やトリミングが変わったときに切れてしまうことがある。幅や高さを固定ピクセルで書くよりも、viewBox中心でレスポンシブに扱うほうが汎用性が高い。

保存形式は“プレーンSVG（最小限のメタデータ）”を推奨する。アプリ特有のメタ情報（編集履歴や専用の名前空間）は削除しておくと、意図せぬ依存を避けられる。座標の小数点以下は必要以上に長くしない（例：2〜3桁）とファイルサイズが減るし、最終的には最適化ツールでさらに整理する。アクセシビリティのために