Importing HTML into InDesign
We have recently been exploring ways to import HTML files into InDesign. This is not an effortless task, as HTML files are primarily designed for web use, while InDesign is intended for print output. For instance, images with a resolution of 72 dpi in HTML are not suitable for print. Importing text-based elements, including tables, is generally the most practical approach.
Some of the Issues
One major challenge is converting CSS styles to InDesign styles. CSS often relies on defaults, whereas InDesign requires explicit style attributes. A potential solution is to create a template in InDesign that matches HTML tags and CSS classes with InDesign styles. Additionally, having a tool to generate paragraph styles in InDesign based on HTML tags and classes could ensure consistent styling.
CSS Defaults for Text
Here is an example of matching CSS properties to InDesign defaults:
| CSS Property | Default Value | InDesign Property | InDesign Default Value |
|---|---|---|---|
| font-family | sans-serif | fontFamily | Arial |
| font-size | 16px | fontSize | 12pt |
| color | black | fillColor | Black |
| line-height | normal | leading | Auto |
| text-align | left | justification | LeftAlign |
| text-transform | none | capitalization | Normal |
| font-weight | normal | fontStyle | Regular |
| font-style | normal | fontStyle | Regular |
| text-decoration | none | underline | None |
| letter-spacing | normal | kerning | Auto |
Typically, CSS properties vary in their ease of recreation in InDesign, depending on the quality of the original HTML design.
The Best Solution
The easiest solution may be to provide a substitution table for tags and classes, without attempting to extract individual attributes from the HTML. A report identifying the tags present in the HTML would also be beneficial.
An Existing Solution
Currently, InDesign’s Import XML feature allows text import from HTML, but the <head> tag section must be removed from the HTML file.
Our Development Services
Mapsoft provides custom software development services for Adobe InDesign and other Creative Cloud applications such as Adobe Illustrator and Adobe Photoshop. We also provide development for Adobe Acrobat and the Adobe PDF Library.
Contact Information
Michael Peters – Technical Director
Email: mpeters@mapsoft.com
LinkedIn: https://www.linkedin.com/in/mpmapsoft/
Website: https://www.mapsoft.com
