1.什么是 ai2html
ai2html 是 Adobe Illustrator 的开源脚本，可将 Illustrator 文档转换为 html 和 css，基于 ai2html 的诸多示例登上了 New York Times。
ai2html由不同的组成部分：
ai2html-css：支持插入到 html 中的 css，可以将其包含在 Illustrator 文档中某处的文本块中，但不要包含在画板上。ai2html-js：支持添加始终插入到 html 部分中的 javascript，可以将其包含在 Illustrator 文档中某处的文本块中，但不要包含在画板上。ai2html-html：添加始终插入到 html 部分中的 html，请将其包含在 Illustrator 文档中某处的文本块中，但不要包含在画板上。ai2html-text：可以将文本存储到变量中，并利用基本的 Mustache 或 erb/ejs 表示法将它们插入到文档中。目前 ai2html 在 Github 上开源，是一个值得关注的 AI 类前端开源项目。
2.为什么须要 ai2html很多人会有此疑问，为什么不直接将 Illustrator 文件导出为图像或 SVG？
图像和 SVG 中的文本会随着图像的缩放而缩放，因此当艺术品缩小时，文本很快就会变得难以辨认，或者在放大时看起来非常大。
通过将文本渲染为 html，可以高下缩放“图形”同时保持文本在相同的字体大小和行高下可读，从而适应从手机到巨型桌面显示器的视口。
可以打开链接 http://nyti.ms/1CQdkwq ，然后查看页面时变动窗口大小，此时将看到图稿比例变革，但文本保持相同大小。 更多示例可以查看 https://del.icio.us/archietse/ai2html+responsive
同时，当 Illustrator 保存 SVG 时，每一行文本都会被分解为单独的 SVG 元素，这使得编辑文本变得非常困难。 通过以 HTML 形式渲染文本，编辑职员可以更轻松地进入 CMS 并进行编辑，而无需费力地浏览一堆 SVG 代码。
当然，ai2html 也有一定的局限性，紧张表示在以下几点：
由于在设置文本格式和定位元素时，网页会将数字四舍五入为整像素，因此图形的 html 版本将不会与其 Illustrator 版本完备同等。 如果文本块超过多行并且在 Illustrator 中具有小数行距，则舍入差异会特殊繁芜。设置为 valign:bottom 的非常大的文本目前无法精确定位ai2html 只关注文本，而可能忽略艺术的身分画板该当有唯一的名称。图形工具中的标签将渲染为图像的一部分。 如果希望图表标签显示为 html，则须要取消图表分组。在区域文本块中，由于溢出框而隐蔽的文本将涌如今 html 输出中。3.安装/利用 ai2html将 ai2html 的 CDN 文件下载保存到电脑，下载地址已经在文末给出。
将 ai2html.js 文件移动到脚本所在的 Illustrator 文件夹中。 例如，在运行 Adobe Illustrator CC 2015 的 Mac 上，路径为：
/Applications/Adobe Illustrator CC 2015/Presets/en_US/Scripts/ai2html.js
接着按照以下步骤利用 ai2html：
创建 Illustrator 作品。例如：将画板调度为希望以 div 在网页上显示的尺寸；确保文档颜色模式设置为 RGB；保存文档；利用 Arial 或 Georgia，除非已将自己的字体添加到脚本中的字体数组中。通过选择以下办法运行脚本：File > Scripts > ai2html转到包含 Illustrator 文件的文件夹， 里面有一个名为 ai2html-output 的输出文件夹， 在浏览器中打开 html 文件以预览输出。参考资料http://ai2html.org/
https://github.com/newsdev/ai2html
https://raw.githubusercontent.com/newsdev/ai2html/master/ai2html.js