ai 如何导出html格式,html - 从Illustrator导出Web的SVG的最佳设置?

SVG个人资料

SVG 1.0:所有现代桌面和移动浏览器都支持SVG 1.1,所以永远不要选择此选项。

SVG 1.1:你几乎总是想要这个。

SVG Tiny / Basic:这是用于移动设备的SVG的子集。 只有少数设备支持SVG Tiny而不是完整的规范,所以请选择SVG 1.1。

注意:SVG Tiny不会减小文件大小,它只是SVG的一个子集,足以满足低处理能力的设备需求。 它会丢弃渐变,不透明度,嵌入字体和滤镜。 ErikDahlström说:所有SVG 1.1全视图应该能够显示所有SVG 1.1 Tiny / Basic内容(根据规范),以及Illustrator生成的所有SVG 1.2 Tiny内容。

字体注意:如果图像中没有任何文本,则此设置无关紧要。

Adobe CEF:从不使用此选项,您打算在浏览器中显示它。 这是Adobe在SVG文件中嵌入字体的方式,据我所知这只有Adobe的SVG查看器插件支持。

SVG:这将字体嵌入SVG,Firefox不支持,但如果您打算只支持移动设备(通常运行webkit),这是一个不错的选择。

创建大纲:除非您有大量文本,否则您将希望大部分时间都这样做。 如果您有大量文本,则需要使用WOFF嵌入字体,但您必须手动执行此操作。

子集:

无:这将取消之前的设置,并且不会嵌入任何字体,如果您不关心字体是否回退到用户计算机中的某些其他字体选择此项。

仅使用雕文:如果您选择嵌入字体,则大多数时候都会想要这个。 它只嵌入使用的字符,因此不会夸大文件大小。

[子集化的其余部分]:这很清楚,您可以选择包含它的整个字体或子集。 仅当SVG是动态的并且文本可能根据用户输入而改变时,它才有用。

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

嵌入:这通常是你想要的,它将图像编码为数据uri,这样你只需上传一个文件而不是svg文件和它的伴随位图图像。

链接:仅当您有几个引用一个位图文件的svg文件时才使用它(因此每次呈现svg文件时都不会下载它)。

请注意,如果通过标记显示SVG,则不会显示链接的位图图像,因为不允许加载外部资源。 此外:webkit有一个错误,即使你嵌入它们也不会在svg文件中显示位图图像。 简而言之:如果您打算嵌入或链接位图图像,请使用普通的tspan标记,不要使用。

保留Illustrator编辑功能

我更喜欢将.ai文件保存为源图像,并将SVG文件视为功能。 这样您就可以专注于减小文件大小,并拥有具有所有编辑功能的矢量文件的原始副本。 所以不要选择这个。

小数位

默认的是一个理智的设置,你几乎可以忘记它。

但是,如果您有一个非常复杂的路径,许多点将此设置降低到1或甚至0将大大减小文件大小。 但是你必须要小心,因为bezier段对这个设置非常敏感,它们可能看起来有点扭曲。 因此,如果您降低此设置,请始终确保它在浏览器中看起来可以接受。

编码

字符编码背后的解释相当技术性,它只涉及带文本的svg文件。 您需要的最可能的编码是UTF-8,除非您知道自己在做什么,否则不要更改此编码。

优化Adobe SVG Viewer

当浏览器本身不支持SVG时,Adobe SVG Viewer是一个浏览器插件。 我不知道它做了什么,但这是无关紧要的,不要检查这个。

包括切片数据

这会将元数据膨胀添加到SVG文件中,除非您计划稍后在Illustrator中打开SVG文件并找到切片(如果有的话),请不要检查

包括XMP

有关该文件的更多元数据,您可以在此处阅读XMP。 不检查这个

输出较少个元素

如果您没有文本,这将显示为灰色。 SVG不支持字距调整表,因此,某些字符序列看起来过于分散,即.Illustrator通过添加tspan元素并略微调整字符位置来解决。 这会给文件增加一些膨胀,除非你更关心文件大小而不是文本外观,否则不要检查这个。

对路径上的文本使用元素

如果路径上没有文本,则会显示为灰色。 在将文本放置在路径上时,浏览器往往变化很大,因此Illustrator尝试通过将旋转和位置应用于角色而不是将作业留给浏览器来提供帮助。 不要检查这个,除非你更关心文件大小而不是文本外观。

一般来说,我建议你一般看看SVG,你会发现它看起来很像HTML,它允许你调整在Illustrator中无法完成的事情。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值