SVG 文件:它不是图像,而这一点在转换时很要紧

SVG 为什么没有分辨率、光栅化之前要先定什么、以及为什么 PNG 转不回去。在浏览器里转换 SVG,不上传。

速览

SVG 不是图像文件,而是一份文档——用 XML 描述形状、路径、填充和文字。里面没有任何东西是像素。浏览器显示它时,是按布局要求的尺寸去执行这些指令,所以同样几 KB 的 SVG 在手机上清晰,在广告牌上也清晰。正是这一个特性,让 logo 和图标以这种方式分发。

展开说明

转成 PNG 意味着选定一个尺寸、把那些指令执行一次。从那一刻起,结果就是一张普通位图,放大就会模糊——所以你选的尺寸就是这个转换的全部。请选「这张图将来可能显示的最大尺寸」,而且宁可给宽裕些:PNG 缩小很干净,放大不干净。

反向转换其实并不存在。从指令变成像素就丢掉了指令,要把它们找回来需要「描摹」——一个算法在位图里猜形状,产出近似它所看到的路径。那是一类完全不同的工具,而它的输出永远不是原件。

结果里有两件事要检查。字体:SVG 如果按名字引用某个字体,就依赖那个字体已安装,所以文字可能被替代字体渲染——如果排版要紧,请先在编辑器里把文字转成路径。以及透明:SVG 除非画了背景,否则没有背景,所以图形空白处的 PNG 会是透明的——这通常正是你想要的,偶尔在白色页面上会看不出来。

选「这张图将来可能显示的最大尺寸」,而且宁可给宽裕些。PNG 缩小很干净,放大不行。在高级选项里设置最大宽度。

因为 SVG 按名字引用了那个字体而它不可用,于是用了替代字体。请先在矢量编辑器里把文字转成路径。

没有实质意义。光栅化丢掉了指令,要把它们找回来只能靠描摹——在位图里猜形状。结果是对图像的近似,而不是还原原件。

图形空白处会是透明的,因为 SVG 除非画了背景否则没有背景。如果你需要实色背景,请先在 SVG 里加一个矩形。

因为大量软件不收 SVG——办公文档、老编辑器、很多上传表单,以及只接受位图的平台。

两者都不适用。它存的是指令而不是采样,所以没有什么可被压缩掉。这个问题只有在你把它光栅化之后才开始有意义。

它是可以包含脚本的文档,所以一个来源不明的 SVG 更像 HTML 文件而不是照片。在本站转换它,是在隔离环境里渲染并产出一张普通位图——这也是化解那个风险的一种方式。

不会。SVG 由你的浏览器在页面内渲染,PNG 也在那里编码。你的文件不会被发送到任何地方。