사용 안내서 취소

콘텐츠를 HTML5로 내보내기

  1. InDesign 사용 안내서
  2. InDesign 알아보기
    1. InDesign 소개
      1. InDesign의 새로운 기능
      2. 시스템 요구 사항
      3. 일반 질문
      4. Creative Cloud 라이브러리 사용
    2. 작업 영역
      1. 작업 영역 기본 사항
      2. 상황별 작업 막대
      3. InDesign에서 작업 영역 사용자 지정
      4. 도구 상자
      5. 환경 설정 지정
      6. 속성 패널
      7. 터치 작업 영역
      8. 기본 키보드 단축키
      9. 편집 실행 취소 및 작업 내역 패널 관리
      10. 문서 복구 및 실행 취소
    3. 생성형 AI(중국 본토에서는 사용할 수 없음)
      1. 텍스트를 이미지로
      2. 생성형 확장
      3. InDesign에서 효과 생성(Beta)
      4. 생성형 AI FAQ
  3. 문서 작성 및 레이아웃
    1. 문서 및 페이지
      1. 문서 만들기
      2. 상위 페이지 작업
      3. 문서 페이지 작업
      4. 페이지 크기, 여백 및 도련 설정
      5. 파일 및 템플릿 작업
      6. InDesign에서 PDF를 InDesign 파일로 변환(Beta)
      7. 책 파일 만들기
      8. 기본 페이지 번호 매기기 추가
      9. 페이지, 장 및 섹션 번호 매기기
      10. QuarkXPress 및 PageMaker 문서 변환
      11. 콘텐츠 공유
      12. 기본 관리 파일 작업 과정 이해
      13. 문서 저장
    2. 격자
      1. 격자
      2. 격자 형식 지정
    3. 레이아웃 지원
      1. 눈금자
      2. 눈금자 사용 개체 정렬 및 분산
      3. 측정 도구를 사용하여 오브젝트 측정
  4. 콘텐츠 추가
    1. 텍스트
      1. 프레임에 텍스트 추가
      2. 텍스트 스레드
      3. 동남아시아 언어 스크립트
      4. InDesign의 아랍어 및 히브리어 기능
      5. 패스에 문자 입력
      6. 글머리 기호 및 번호 매기기
      7. MathML을 삽입하여 수학 표현식 만들기
      8. 글리프 및 특수 문자
      9. 텍스트 컴포지션
      10. 텍스트 변수
      11. QR 코드 생성
      12. 텍스트 편집
      13. 텍스트 정렬
      14. 개체 주변 텍스트 줄 바꿈
      15. 고정된 개체
      16. 연결된 내용
      17. 단락 서식 지정
      18. 문자 서식 지정
    2. 입력 체계
      1. InDesign에서 글꼴 사용
      2. 커닝 및 자간
      3. 문자 비율 조정 및 기울이기
      4. 문자에 색상 효과 적용
    3. 텍스트 서식 지정
      1. 텍스트 서식 지정
      2. 자동 스타일 텍스트
      3. 스타일 팩을 사용하여 작업
      4. 탭 및 들여쓰기
    4. 텍스트 검토
      1. 변경 내용 추적 및 검토
      2. InDesign에서 편집 메모 추가
      3. PDF 주석 가져오기
    5. 맞춤법 검사 및 언어 사전
      1. 맞춤법, 자동 수정, 동적 맞춤법 검사
      2. 사전 및 단어 만들기, 추가하기, 관리하기
      3. 사전 환경 설정 변경
      4. Duden 사전
    6. 참조 추가
      1. 목차 만들기
      2. 각주
      3. 색인 만들기
      4. 미주
      5. 캡션
    7. 스타일
      1. 단락 및 문자 스타일
      2. 스타일 매핑, 내보내기 및 관리
      3. 개체 스타일
      4. 단락 시작표시문자 및 중첩 스타일
      5. 스타일을 사용한 작업
      6. 행간
      1. 표 서식을 지정
      2. 표 만들기
      3. 표 및 셀 스타일
      4. 표 선택 및 편집
      5. 표의 획 및 칠
    8. 상호 작용
      1. 하이퍼링크
      2. 동적 PDF 문서
      3. 책갈피
      4. 버튼
      5. 양식
      6. 애니메이션
      7. 상호 참조
      8. PDF 구조
      9. 페이지 전환
      10. 동영상 및 사운드
    9. 그래픽
      1. 패스 및 도형 이해
      2. 연필 도구로 그리기
      3. 펜 도구를 사용하여 그리기
      4. 선(획) 설정 적용 
      5. 컴파운드 패스 및 모양
      6. 패스 편집
      7. 클리핑 패스
      8. 모퉁이 모양 변경
      9. 프레임 및 개체
      10. 개체 정렬 및 분포
      11. 연결 및 임베드된 그래픽
      12. AEM Assets 통합
    10. 색상 및 투명도
      1. 색상 적용
      2. 가져온 그래픽의 색상 사용
      3. 색상 견본을 사용한 작업
      4. 잉크 혼합하기
      5. 색조
      6. 별색 및 배합 색상 이해
      7. 색상 혼합
      8. 그레이디언트
      9. 투명 아트워크 병합
      10. 투명도 효과 추가
  5. 찾기 및 바꾸기
    1. 텍스트 찾기 및 바꾸기
    2. 글꼴 찾기 및 바꾸기
    3. 글리프 찾기 및 바꾸기
    4. GREP 표현식 및 쿼리를 사용하여 찾기 및 바꾸기
    5. 오브젝트 찾기 및 바꾸기
    6. 색상 찾기 및 바꾸기
    7. 옵션을 검색하여 찾기 및 바꾸기
  6. 공유
    1. 클라우드 문서 저장 및 액세스
    2. 클라우드 문서 구성, 관리, 공유
    3. 클라우드 문서 버전 보기 및 관리
    4. InDesign 클라우드 문서에 대한 일반적인 질문
    5. 웹용 InCopy(Beta)
    6. 공유 및 공동 작업        
    7. 검토용으로 공유
    8. 공유 InDesign 문서 검토
    9. 피드백 관리
    10. 편집하도록 초대
  7. 내보내기, 가져오기, 게시
    1. 가져오기, 내보내기 및 게시
      1. 온라인 게시
      2. 온라인 게시 대시보드
      3. 그래픽 복사, 삽입
      4. Adobe Express로 내보내기
      5. EPUB에 사용할 내용 내보내기
      6. Adobe PDF 옵션
      7. HTML5로 내보내기
      8. 콘텐츠를 HTML로 내보내기(이전)
      9. Adobe PDF로 내보내기
      10. JPEG 형식으로 내보내기
      11. SVG 파일 가져오기
      12. DPS 및 AEM Mobile 개요
      13. 지원되는 파일 형식
      14. 사용자 설정 내보내기 및 가져오기
    2. 인쇄
      1. 소책자 인쇄
      2. 프린터 표시 및 도련
      3. 문서 인쇄
      4. 잉크, 분판 및 스크린 빈도 수
      5. 중복 인쇄
      6. PostScript 및 EPS 파일 만들기
      7. 전달 전에 파일 프리플라이트
      8. 썸네일 및 큰 문서 인쇄
      9. 서비스 공급업체용 PDF 준비
      10. 분판 인쇄 준비
  8. InDesign 확장
    1. 자동화
      1. 데이터 병합
      2. 플러그인
      3. InDesign의 Capture 확장 기능
      4. 스크립팅
  9. 문제 해결
    1. 해결된 문제
    2. 알려진 문제
    3. 실행 시 충돌 발생
    4. 환경 설정 폴더 읽기 전용 문제
    5. 파일 문제 해결
    6. InDesign 파일을 PDF로 내보낼 수 없음
    7. InDesign 문서 복구

페이지, 스프레드 또는 선택한 개체를 HTML5 형식 유형으로 내보내는 방법을 알아보세요.

InDesign 문서를 HTML5로 내보내서 플랫폼간 호환성을 보장하고 풍부한 대화형 콘텐츠, 향상된 사용자 참여 및 접근성을 지원할 수 있습니다. 또한 SEO 및 웹 페이지 성능도 향상됩니다. 내용을 HTML5로 내보낼 때 텍스트를 내보내는 방법을 설정할 수 있습니다.

HTML5 패키지 내보내기

  1. 파일 > 내보내기를 선택합니다.

  2. 다른 형식으로 저장(Windows) 또는 형식(macOS)에서 HTML5를 선택합니다.

  3. 파일 이름을 동일하게 지정하려면 InDesign 문서 이름을 출력 파일 이름으로 사용을 선택하고 저장을 선택합니다.

  4. 필요에 따라 HTML5 패키지 내보내기 대화 상자에서 HTML 텍스트 태그 또는 HTML SVG 태그를 선택합니다.

    HTML5 패키지 내보내기 대화 상자
    이제 InDesign 문서를 HTML5 패키지로 내보낼 수 있습니다.

  5. 내보내기를 선택합니다.

HTML5 내보내기: 온라인 게시 대화 상자에서 적용된 주요 속성 

제목

이 값은 내보낸 폴더의 이름을 지정하는 데 사용됩니다.

설명

내보내지 않았습니다.

페이지

온라인 게시 대화 상자에서 정의됩니다. 파일 > 내보내기 > HTML5에서 바로 내보내면 모든 페이지가 포함됩니다.

내보내기 형식

  • 단일: 각 페이지를 기본 index.html에 연결된 개별 HTML 파일로 내보냅니다.
  • 스프레드: 각 스프레드를 기본 index.html에 연결된 하나의 HTML 파일로 내보냅니다.

암호를 통한 보호 활성화

해당되지 않습니다.

표지 썸네일

썸네일은 HTML5 패키지에 포함됩니다.

이미지 설정

온라인 게시 대화 상자의 설정이 적용됩니다.

PDF 설정 다운로드

해당되지 않습니다.

추가 설정

해당되지 않습니다.

Google Analytics

온라인 게시 대화 상자에 Google Analytics 태그가 포함된 경우 HTML5로 내보낼 때 index.html 파일에 추가됩니다. 웹 사이트에서 페이지를 호스팅할 때 필요한 경우 쿠키 배너를 통해 사용자의 동의를 얻어야 합니다.

HTML5 렌더링 문제를 해결하는 빠른 수정 사항

  • HTML 텍스트 태그 옵션을 사용한 경우에는 내보내기 중 글꼴 복사 옵션을 선택해야 합니다.
  • 글꼴 복사 옵션을 선택한 경우에는 문제의 원인이 여전히 누락된 글꼴 때문인지 확인합니다. HTML SVG 태그 옵션을 사용해 글꼴 문제인지 확인합니다.
  • 실제로 글꼴 문제이며 HTML SVG 태그 옵션이 잘 보이면 InDesign 문서에서 사용한 글꼴을 내보냈고 패키지의 글꼴 폴더에 있는지 확인하세요. 그렇지 않으면 글꼴을 수동으로 복사하여 폴더에 넣어야 할 수도 있습니다.
  • 글꼴을 폴더에 넣은 후에도 문제가 계속되는 경우 고객 지원 팀에 문의하세요.
참고:

웹 사이트에서 사용하는 글꼴은 글꼴의 라이선스 약관에 따라야 합니다. 웹 사이트의 글꼴을 자체적으로 호스팅하는 경우 별도의 라이선스가 필요할 수 있습니다.

HTML5 패키지와 HTML(기존) 간의 차이

HTML5 패키지의 목적은 시작부터 출력 HTML5에서 InDesign 파일의 레이아웃을 모방하는 것입니다. 반면 HTML(기존)은 InDesign 파일에서 HTML를 만드는 상향식 접근 방식으로, 원본 파일과의 레이아웃 유사성이 제한적입니다.

알려진 문제

  • 그림자, 흐림 효과 등과 같은 효과를 텍스트에 사용했을 때 제대로 내보내지지 않았습니다.

해결 방법: HTML 텍스트 태그 대신 HTML SVG 태그를 선택하여 텍스트를 내보냅니다.

관련 항목 더 보기

궁금한 점이나 의견이 있으십니까?

커뮤니티에 질문하기

질문이나 공유할 아이디어가 있다면 Adobe InDesign 커뮤니티에 참여하세요. 여러분의 소중한 의견과 다양한 작품 활동을 기대하겠습니다.

 Adobe

쉽고 빠르게 지원 받기

신규 사용자이신가요?