ai2html is an open-source script for Adobe Illustrator that converts your Illustrator documents into html and css.
This ai2html.js script creates output that's designed to work with pym.js and the KHN Wordpress CMS.
It's designed to create a full graphic file including header and footer text without requiring node or any JS frameworks. Graphics header and footer text is entered into graphic-config.json, which is injected into the resulting html file in the ai2html script. A companion CSS file containing header and footer styles is also referenced in the script to style that text.
It uses CSS display:none; based on artboard and screen size to toggle which artboard appears rather than JS.
Here are examples of how we’ve used the script at The New York Times and examples of how others have used it. Share your ai2html projects on Twitter, Delicious, etc. using #ai2html.
For documentation and examples on how to use ai2html, please visit ai2html.org.
The Github repository for this site is available at newsdev/ai2html.
Many thanks to Gregor Aisch, Derek Watkins, Josh Katz, K.K. Rebecca Lai, Tom Giratikanon, Matt Ericson, Jeremy Ashkenas and Alan McLean for their incredible contributions to this project, as well as to my colleagues in The New York Times Graphics Department for their patient guidance.
If you’re learning to write Javascript for Adobe Illustrator, John Wundes, has many wonderful scripts. explore.js is particularly helpful for understanding what attributes are attached to Illustrator objects.
Created by Archie Tse / The New York Times
Copyright (c) 2011-2021 The New York Times Company