Convert InDesign to HTML Using These Simple Steps

Convert InDesign to HTML Using These Simple Steps
Page content

Getting Started

Adobe InDesign is a powerful document layout environment that can be used to create files for the Web as well as for print. In this Adobe InDesign tutorial, you will learn how to convert InDesign files to HTML. To get started, you will need to have Adobe InDesign installed on a computer that meets the minimum requirements for the software. This particular tutorial uses InDesign CS5 running on Windows 7 Ultimate, but users of other versions should be able to follow along.

To begin, open InDesign and create a new document with “Intent” set for “Web.” Save the file as “smile.indd.” You can also define other qualities for your layout in this window and save them as presets if you think you will create numerous documents of the same type.

Now, create your document. For the purpose of this demonstration, we will make a basic layout. This is the best way to learn because complex documents from InDesign to HTML often requires a lot of rework.

indesignHTML02

Convert Your InDesign File to HTML

Now that you have created your layout and saved it as an InDesign file, you can now convert it to HTML in one step. Click on “File” from the main menu and then click “Export for,” followed by “Dreamweaver.”

indesignHTML03

Proceed through the dialog windows and save your exported file as HTML. When you browse to the folder where you saved your HTML file, you will see that InDesign saved a file named “smile.html” and also saved the images from your layout in a folder called “smile-web-images.”

indesignHTML04

You can now open your HTML file in a Web browser to see how the conversion worked.

indesignHTML05

Other Considerations

When you convert InDesign files to HTML, you will probably notice that the formatting does not always remain perfect. To make changes and adjustments to your HTML file you can open your exported file with Dreamweaver, the professional Web site editor that comes with Adobe Creative Suite.

What to do if it just doesn’t look right

Many users who convert InDesign to HTML become frustrated because their converted files do not look right and they believe that too much effort in Dreamweaver is required to correct them. Fortunately, other alternatives exist that will still allow you to present your InDesign layouts on the Web.

Perhaps the most reliable way to preserve formatting is to save your creation as a PDF. You can find this as an option by clicking “File” from the main menu and then “Export.” you can select “PDF” as the destination file type. Using this same procedure you can also export as a Flash document or a JPEG that you can use to display your InDesign content online.

Image Credits: Screen shots taken by Bruce Tyson