从 Illustrator 导出网页 SVG 的最佳设置？

小开

最佳答案

SVG 配置文件

SVG 1.0: 所有现代桌面和移动浏览器都支持 SVG 1.1，所以永远不要选择这个选项。
SVG 1.1: 您几乎总是需要这个。
SVG Tiny/Basic: 这是用于移动设备的 SVG 的一个子集。只有少数设备支持 SVG Tiny，而不是完整的规范，所以使用 SVG 1.1吧。

注意: SVG Tiny 不会减小文件大小，它只是 SVG 的一个子集，适合于低处理能力的设备。它将丢弃渐变、不透明度、嵌入式字体和过滤器。

埃里克•达尔斯特伦(Erik Dahlström)表示:

所有 SVG 1.1的完整查看器都应该能够显示所有 SVG 1.1 极小/基本的内容(根据规范) ，可能还有所有的 SVG 1.2 Illustrator 也生产微小的内容。

字体注意: 如果你的图像中没有任何文字，这个设置并不重要。

AdobeCEF: 永远不要使用这个选项，因为你打算在浏览器中显示它。这是 Adobe 在 SVG 文件中嵌入字体的方式，据我所知，只有 Adobe 的 SVG 查看器插件才支持这种方式。
SVG: 这种字体以 SVG 的形式嵌入，Firefox 不支持这种字体，但是如果您打算只支持移动设备(通常运行 webkit) ，那么这是一个很好的选择。
创建大纲: 除非有大量文本，否则大多数时候 都需要这样做。如果你有大量的文本，你会想嵌入字体与 WOFF，但你必须手工这样做。

子集 :

无: 这将否定以前的设置，不会嵌入任何字体，如果你不关心的字体回落到某些其他字体在用户的计算机选择这一点。
只使用象形文字: 如果你选择嵌入字体，大多数情况下 都需要这个。它只嵌入使用的字符，所以它不会膨胀您的文件大小。
[其余子集] : 这是相当清楚的，你可以选择包括它的整个字体或子集。只有当 SVG 是动态的并且文本可能根据用户输入而改变时，它才有用。

图像 : 这只有在包含位图图像时才有意义

Embed: 这通常是您想要的 ，它将图像编码为 data uri，这样您只需要上传一个文件，而不是带有位图图像的 svg 文件。
链接: 只有当你有几个 svg 文件引用一个位图文件时才使用它(因此它不会在每次呈现 svg 文件时下载)。

请注意，如果通过 <img>标记显示 SVG，链接的位图图像将不会显示，因为 img不允许加载外部资源。此外: webkit 有一个 bug，即使你嵌入了它们，它也不会在 svg 文件中显示位图图像。简而言之: 如果你打算嵌入或链接位图图像，使用一个简单的 <svg>标签，不要使用 <img>。

保留插画编辑功能

我更喜欢救一个。Ai 文件作为我的源图像，并把 SVG 文件作为 Export for web特性。这样，您可以专注于减少文件大小，并拥有一个具有所有编辑功能的矢量文件的原始副本。所以别选这个。

小数位

默认的 3是一个正常的设置，您几乎可以忘记它。

但是，如果您有一个非常复杂的路径，并且有很多点，那么将这个设置降低到1或者甚至0将大大减少文件的大小。但你必须小心，因为贝塞尔部分是非常敏感的设置，他们可能看起来有点扭曲。因此，如果您降低此设置，始终要确保它在浏览器中看起来是可接受的。

编码中

字符编码背后的解释相当技术性，它只涉及带有文本的 svg 文件。您最可能需要的编码是 UTF-8，不要改变这一点，除非你知道你在做什么。

包括切片数据

这会将元数据膨胀添加到 SVG 文件中，除非您打算稍后在 Illustrator 中打开 SVG 文件并找到您的片(如果有的话) 别看这个

包括 XMP

关于文件的更多元数据，可以在这里阅读 XMP.别看这个

有反应

请注意，这个设置将消除 svg 根节点的 height 和 width 属性，假设您将通过 css 缩放所包含的图形。但是，在某些情况下，您希望单个图形声明它的大小。请确保在这些实例中取消选中此设置。

输出较少的 <tspan>元素

如果你没有短信，这将是灰色的。SVG 不支持字距调整表，因此，某些字符序列的间隔似乎太大，即 AVA。Illustrator 通过添加 tspan元素和稍微调整字符位置来解决这个问题。这给文件 除非您更关心文件大小而不是文本外观，否则不要选中此选项增加了一点膨胀。

对路径上的文本使用 <textpath>元素

如果路径上没有文本，这将是灰色的。当在路径上放置文本时，浏览器往往会有很大的不同，因此 Illustrator 试图通过对字符应用旋转和位置来提供帮助，而不是将任务留给浏览器。除非您更关心文件大小而不是文本外观，否则不要选中此选项.

一般来说，我建议您研究一下 SVG，您会发现它看起来很像 HTML，并且允许您调整 Illustrator 中无法完成的事情。