User Guide Cancel

Export content as HTML5

Search
InDesign

InDesign

Open app
  1. InDesign User Guide
  2. Get to know InDesign
    1. Introduction to InDesign
      1. What's New in InDesign
      2. System requirements
      3. Common questions
      4. Use Creative Cloud libraries
    2. Workspace
      1. Workspace basics
      2. Contextual task bar
      3. Customize your workspace in InDesign
      4. Toolbox
      5. Set preferences
      6. Properties panel
      7. Touch workspace
      8. Default keyboard shortcuts
      9. Undo edits and manage History panel
      10. Document recovery and undo
    3. Generative AI (Not available in mainland China)
      1. Text to Image
      2. Generative Expand
      3. Generate Effect in InDesign (Beta)
      4. Generative AI FAQ
  3. Create and layout documents
    1. Documents and pages
      1. Create documents
      2. Work with parent pages
      3. Work with document pages
      4. Set page size, margins, and bleed
      5. Work with files and templates
      6. Convert PDFs to InDesign files in InDesign (Beta)
      7. Create book files
      8. Add basic page numbering
      9. Number pages, chapters, and sections
      10. Convert QuarkXPress and PageMaker documents
      11. Share content
      12. Understand a basic managed-file workflow
      13. Save documents
    2. Grids
      1. Grids
      2. Format grids
    3. Layout aids
      1. Rulers
      2. Align and distribute objects using rulers
      3. Measure objects using the Measure tool
  4. Add content
    1. Text
      1. Add text to frames
      2. Threading text
      3. South-East Asian Scripts
      4. Arabic and Hebrew features in InDesign
      5. Create type on a path
      6. Bullets and numbering
      7. Insert MathML to create math expressions
      8. Glyphs and special characters
      9. Text composition
      10. Text variables
      11. Generate QR codes
      12. Edit text
      13. Align text
      14. Wrap text around objects
      15. Anchored objects
      16. Linked content
      17. Format paragraphs
      18. Format characters
    2. Typography
      1. Using fonts in InDesign
      2. Kerning and tracking
      3. Scale and skew type
      4. Apply color effects to type
    3. Format text
      1. Format text
      2. Auto Style text
      3. Work with Style Packs
      4. Tabs and indents
    4. Review text
      1. Track and review changes
      2. Add editorial notes in InDesign
      3. Import PDF comments
    5. Spell check and language dictionaries
      1. Check spelling, autocorrect, and dynamic spelling
      2. Create, add, and manage dictionaries and words
      3. Change dictionary preferences
      4. Duden dictionary
    6. Add references
      1. Create a table of contents
      2. Footnotes
      3. Create an index
      4. Endnotes
      5. Captions
    7. Styles
      1. Paragraph and character styles
      2. Map, export, and manage styles
      3. Object styles
      4. Drop caps and nested styles
      5. Work with styles
      6. Leading
    8. Tables
      1. Format tables
      2. Create tables
      3. Table and Cell styles
      4. Select and edit tables
      5. Table strokes and fills
    9. Interactivity
      1. Hyperlinks
      2. Dynamic PDF documents
      3. Bookmarks
      4. Buttons
      5. Forms
      6. Animation
      7. Cross-references
      8. Structure PDFs
      9. Page transitions
      10. Movies and sounds
    10. Graphics
      1. Understand paths and shapes
      2. Draw with the Pencil tool
      3. Draw with the Pen tool
      4. Apply line (stroke) settings 
      5. Compound paths and shapes
      6. Edit paths
      7. Clipping paths
      8. Change corner appearance
      9. Frames and objects
      10. Align and distribute objects
      11. Linked and embedded graphics
      12. Integrate AEM assets
    11. Color and transparency
      1. Apply color
      2. Use colors from imported graphics
      3. Work with swatches
      4. Mix inks
      5. Tints
      6. Understand spot and process colors
      7. Blend colors
      8. Gradients
      9. Flatten transparent artwork
      10. Add transparency effects
  5. Find and replace
    1. Find and replace text
    2. Find and replace fonts
    3. Find and replace glyphs
    4. Find and replace using GREP expressions and queries
    5. Find and replace objects
    6. Find and replace colors
    7. Search options to find and replace
  6. Share
    1. Save and access cloud documents
    2. Organize, manage, and share cloud documents
    3. View and manage versions in cloud documents
    4. Common questions about InDesign cloud documents
    5. InCopy on the web (Beta)
    6. Share and collaborate        
    7. Share for Review
    8. Review a shared InDesign document
    9. Manage feedback
    10. Invite to edit
  7. Export, import, and publish
    1. Place, export, and publish
      1. Publish online
      2. Publish online dashboard
      3. Copy, insert graphics
      4. Export to Adobe Express
      5. Export content for EPUB
      6. Adobe PDF options
      7. Export to HTML5
      8. Export content to HTML (Legacy)
      9. Export to Adobe PDF
      10. Export to JPEG format
      11. Import SVG files
      12. DPS and AEM Mobile overview
      13. Supported File Formats
      14. Export and import User Settings
    2. Printing
      1. Print booklets
      2. Printer's marks and bleeds
      3. Print documents
      4. Inks, separation, and screen frequency
      5. Overprinting
      6. Create PostScript and EPS files
      7. Preflight files before handoff
      8. Print thumbnails and oversized documents
      9. Prepare PDFs for service providers
      10. Prepare to print separations
  8. Extend InDesign
    1. Automation
      1. Data merge
      2. Plug-ins
      3. Capture extension in InDesign
      4. Scripting
  9. Troubleshooting
    1. Fixed issues
    2. Known issues
    3. Crash on launch
    4. Preference folder read-only issue
    5. Troubleshoot file issues
    6. Unable to export InDesign file to PDF
    7. InDesign document recovery

Learn to export a page, spread, or selected object to HTML5 format type.

Export an InDesign document to HTML5 to ensure cross-platform compatibility and support rich interactive content, enhanced user engagement, and accessibility. It also improves SEO and web page performance. When you export content to HTML5, you can control how text is exported.

Export HTML5 Package

  1. Select File > Export.

  2. Select HTML5 from Save as type (Windows) or Format (macOS).

  3. Select Use InDesign Document Name as the Output Filename if you want the same file name, and select Save.

  4. Select HTML text tags or HTML SVG tags as per your requirement in the Export HTML5 Package dialog.

    Export HTML5 package dialog
    You can now export your InDesign document as an HTML5 package.

  5. Select Export.

HTML5 Export: Key properties applied from the Publish Online dialog 

Title

This value will be used to name the exported folder.

Description

Not exported.

Pages

Defined in the Publish Online dialog. All the pages will be included if exporting directly from File > Export > HTML5.

Export as
  • Single: Each page is exported as an individual HTML file, each linked to the main index.html.
  • Spread: Each spread is exported as a single HTML file, linked to the main index.html.

Enable Password Protection

Not applicable.

Cover Thumbnail

Thumbnails are included in the HTML5 package.

Image Settings

Settings from the Publish Online dialog will be applied.

Download PDF Settings

Not applicable.

More Settings

Not applicable.

Google Analytics

If a Google Analytics tag is included in the Publish Online dialog, it will be added to the index.html file in the HTML5 export. When hosting the pages on your website, ensure you obtain user consent via a cookie banner if required.

Quick fixes to resolve HTML5 rendering issues

  • If you used the HTML text tags option, ensure to select the Copy Fonts option during export.
  • If you selected the Copy Fonts option, check if the issue is still caused by a missing font. Try the HTML SVG tags option to confirm if it's a font problem.
  • If it's indeed a font problem and your HTML SVG tags option looks great, check if the fonts you've used in the InDesign document are exported and placed in the fonts folder of the package. If they're not, you may have to copy and place the fonts in the folder manually. 
  • If, after placing the fonts, the issue still persist, please reach out to the Customer support team.
Note:

The use of fonts on a website must comply with the terms of your font license. Self-hosting fonts for a website may require a separate license.

Difference between HTML5 Package and HTML (Legacy)

The HTML5 Package aims to mimic the layout of the InDesign file in the output HTML5 from the start. On the other hand, HTML (Legacy) is a bottom-up approach to creating HTML from an InDesign file, and it has limited layout similarities with the original file.

Known issues

  • Effects such as drop shadow, blur, etc. for text are not exported properly.

Workaround: Select HTML SVG tag instead of HTML text tags to export text.

More like this

Have a question or an idea?

Ask the Community

If you have a question to ask or an idea to share, come and participate in Adobe InDesign Community. We would love to hear from you and see your creations.

 Adobe

Get help faster and easier

New user?

Quick links

View all your plans Manage your plans
View quick links
Hide quick links

Legal Notices    |    Online Privacy Policy