Pin Me

How to Convert InDesign Files to HTML

written by: Bruce Tyson•edited by: Amy Carson•updated: 8/22/2010

Learn how to convert InDesign to HTML by following the simple instructions presented in this InDesign tutorial. By following these easy steps you can transform InDesign files to HTML and reuse the same content you created for print as Web based content.

  • slide 1 of 3

    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.

    indesignHTML01 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.


  • slide 2 of 3

    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."


    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."


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


  • slide 3 of 3

    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

More To Explore