| 文章首页 |
|---|
| 蓝骑士SVG教程:SVG后续工作 |
| 第一课 SVG国际标准化 |
| 第二课 SVG简易性和可获取性 |
| 第三课 优化SVG图像 |
| 第四课 关于自安装的SVG浏览器 |
| 第五课 SVG后续工作 |
| 第六课 关注SVG未来 |
页4 共7页
通过Illustrator优化SVG图像 Adobe Illustrator允许定制输出SVG,通过控制"单一化","字体植入","压缩"来优化文件大小. 复杂图像(特别是从其他应用程序如Adobe Streamline或者Adobe Dimensions中导入的图像)一般在输出前需要通过单一化滤镜滤过.更少的矢量点意味着更小的文件尺寸.
当你需要显示一些浏览者的系统里并未安装的独特字体时最好使用字体植入.否则,文字将会被破坏.在植入字体时,你需要选择"最少量"的选项,"所有文字 字体植入"应该尽量少用.当然,创建一系列使用统一字体的SVG文件时,只需要植入一次字体,而在所有的文件中创建与植入字体的关联就可以了.字体将在客 户端的缓存中被存储.,一旦被下载,所有文件就立刻可以被正确显示. Gzip压缩格式是最新公布的Illustrator SVG格式,它能显著的减小SVG的文件大小.下面是一些统计数据:
| 未压缩的SVG | W/gzip压缩 | 压缩比 |
| 30,203 | 8,680 | 71% |
| 12,563 | 3,048 | 83% |
| 7,106 | 2,395 | 66% |
| 6,216 | 2,310 | 63% |
| 4,281 | 2,198 | 49% |
其他压缩方法 除了Illustrator自身的压缩方法,其他还有很多:
1.尽可能的使用默认值而不自定义属性
2.引用路径数据的压缩工具--使用相关的物件;使用h和v来代替水平直线和垂直直线;尽可能的使用s和t的二次函数来表示贝赛尔曲线;除去冗余的量
3.多次出现的图像使用同一个symbol(标志)
4.使用CSS遗传特性提高样式表的通用程度
5.使用滤镜效果直接输出图片而不要在客户端再进行操作
压缩的SVG 3.64 kb
压缩的 (<use>, gzip) 0.99 kb
JPEG (中等品质) 9.62 kb
GIF (256色) 12.77 kb
