출력 옵션 설정

최적화된 이미지를 저장할 때 출력 설정을 통해 HTML 파일 서식, 파일 및 분할 영역의 이름 지정 방식, 배경 이미지 처리 방식 등을 조정할 수 있습니다. 이러한 옵션은 [출력 설정] 대화 상자에서 설정합니다.

출력 설정을 저장한 다음 다른 파일에 적용할 수 있습니다.

  1. 다음 중 하나를 수행하면 [출력 설정] 대화 상자가 표시됩니다.

    • 최적화된 이미지를 저장할 때 [최적화 저장]이나 [최적화 다른 이름으로 저장] 대화 상자의 [설정] 팝업 메뉴에서 [기타]를 선택합니다.

    • [웹 및 장치용으로 저장] 대화 상자에 있는 [사전 설정] 메뉴 오른쪽의 [최적화] 팝업 메뉴에서 [출력 설정 편집]을 선택합니다.

  2. (선택 사항) 미리 정의된 출력 옵션을 표시하려면 [설정] 팝업 메뉴에서 옵션을 선택합니다.

  3. 각 옵션 세트를 필요한 대로 편집합니다. 다른 옵션 세트로 전환하려면 [설정] 메뉴 아래에 있는 팝업 메뉴에서 옵션 세트를 선택합니다. 또는 [다음]을 클릭하여 메뉴 목록의 다음 세트를 표시하거나, [이전]을 클릭하여 이전 세트를 표시합니다.

  4. (선택 사항) 출력 설정을 저장하려면 원하는 대로 옵션을 설정하고 [저장]을 클릭합니다. 파일 이름을 입력하고 파일을 저장할 위치를 선택한 다음 [저장]을 클릭합니다.

    원하는 어느 위치에든 출력 설정을 저장할 수 있습니다. 하지만 파일을 Animate 폴더 내의 Optimized Output Settings 폴더에 배치하면 파일이 [설정] 팝업 메뉴에 나타납니다.

  5. (선택 사항) 출력 설정을 로드하려면 [불러오기]를 클릭하고 파일을 선택한 다음 [열기]를 클릭합니다.

HTML 출력 옵션

[HTML] 세트에서 설정할 수 있는 옵션은 다음과 같습니다.

XHTML 출력

내보낼 때 XHTML 표준에 맞는 웹 페이지를 만듭니다. [XHTML 출력]을 선택하면 이 표준과 충돌할 가능성이 있는 다른 출력 옵션은 비활성화됩니다. 이 옵션을 선택하면 [태그 대소문자 및 특성 대소문자] 옵션이 자동으로 설정됩니다.

[태그 대소문자]

태그의 대/소문자를 지정합니다.

[특성 대소문자]

특성의 대/소문자를 지정합니다.

들여쓰기

코드 행 들여쓰기 방법을 지정합니다. 저작 응용 프로그램의 탭 설정을 사용하거나, 지정된 수의 공백을 사용하거나, 들여쓰기를 사용하지 않을 수 있습니다.

선 끝

선 끝이 호환되는 플랫폼을 지정합니다.

인코딩

웹 페이지에 사용할 기본 문자 인코딩 방식을 지정합니다. 이 옵션은 Illustrator에서만 사용할 수 있고 Photoshop에서는 항상 UTF-8 인코딩을 사용합니다.

주석 포함

HTML 코드에 설명이 포함된 주석을 추가합니다.

항상 Alt 특성 추가

정부의 웹 액세스 가능성 표준에 따라 IMG 요소에 ALT 특성을 추가합니다.

항상 특성 인용

모든 태그 특성을 따옴표로 묶습니다. 일부 초기 브라우저와 호환되게 하거나 HTML 표준을 엄격하게 준수하려면 특성을 따옴표로 묶어야 합니다. 그러나 항상 특성을 따옴표로 묶는 것은 좋지 않습니다. 이 옵션이 선택되지 않은 경우 대부분의 브라우저 요건을 충족해야 할 때 따옴표가 사용됩니다.

모든 태그 닫기

XHTML 규격에 맞게 파일의 모든 HTML 요소에 닫는 태그를 추가합니다.

본문 태그에 여백 없음 추가

브라우저 창 내에 있는 기본 내부 여백을 제거합니다. Body 태그에 값이 0인 marginwidth, marginheight, leftmargin 및 topmargin 태그를 추가합니다.

분할 영역 출력 옵션

[분할 영역] 세트에서 설정할 수 있는 옵션은 다음과 같습니다.

표 작성

CSS 대신 HTML 표를 사용하여 분할 영역을 정렬합니다.

빈 셀

비어 있는 분할 영역을 표의 셀로 변환하는 방식을 지정합니다. IMG 태그에 지정된 너비 및 높이 값을 갖는 1픽셀 GIF를 사용하려면 [GIF, IMG W&H]를 선택합니다. TD 태그에 지정된 너비 및 높이 값을 갖는 1픽셀 GIF를 사용하려면 [GIF, TD W&H]를 선택합니다. 표의 데이터에 표준이 아닌 NoWrap 특성을 배치하고 TD 태그에 지정된 너비 및 높이 값을 배치하려면 [NoWrap, TD W&H]를 선택합니다.

TD W&H

[항상 저장], [저장 안 함] 또는 [자동](권장 설정) 옵션 중 하나를 선택하여 표 데이터의 너비 및 높이 특성을 포함할 경우를 지정합니다.

스페이서 셀

[자동](권장 설정), [자동 (아래)], [항상 저장], [항상 (아래)] 또는 [저장 안 함] 옵션 중 하나를 선택하여 생성된 표 둘레에 1행 1열의 빈 스페이서 셀을 추가할 경우를 지정합니다. 분할 영역 경계가 정렬되지 않은 표 레이아웃의 경우 스페이서 셀을 추가하면 일부 브라우저에서 표가 분리되는 것을 방지할 수 있습니다.

CSS 작성

HTML 표 대신 CSS를 생성합니다.

작성법

CSS를 사용할 때 HTML 파일에서 분할 영역 위치가 참조되는 방식을 지정합니다.

ID별 고유한 ID로 참조되는 스타일을 사용하여 각 분할 영역을 배치합니다.

인라인 <DIV> 블록 요소 선언 태그 내에 스타일 요소를 포함합니다.

클래스별 고유한 ID로 참조되는 클래스를 사용하여 각 분할 영역을 배치합니다.

기본 분할 영역 이름 지정

팝업 메뉴에서 요소를 선택하거나 필드에 텍스트를 입력하여 분할 영역의 기본 이름을 만듭니다. 요소에는 문서 이름, slice라는 단어, 분할 영역 또는 롤오버 상태를 지정하는 숫자나 문자, 해당 분할 영역을 만든 날짜, 구두점 등이 포함되거나 아무것도 포함되지 않을 수 있습니다.

배경 출력 설정

[출력 설정] 대화 상자의 [배경] 세트에서 다음 옵션을 설정할 수 있습니다.

문서 따로 보기

웹 페이지에서 이미지나 단색을 현재 이미지 뒤의 배경으로 표시하려면 [이미지]를 선택합니다. 웹 페이지에서 최적화된 이미지를 타일 모양 배경으로 표시하려면 [배경]을 선택합니다.

배경 이미지

이미지 파일 위치를 입력하거나, [선택]을 클릭하고 이미지를 선택합니다. 지정하는 파일은 웹 페이지에서 최적화된 이미지 뒤에 타일 모양으로 표시됩니다.

색상

[색상] 상자를 클릭하고 색상 피커를 사용하여 배경색을 선택하거나 팝업 메뉴에서 옵션을 선택합니다.

파일 출력 설정 저장

[출력 설정] 대화 상자의 [파일 저장] 세트에서 다음 옵션을 설정할 수 있습니다.

파일 이름 지정

팝업 메뉴에서 요소를 선택하거나, 상자에 모든 파일의 기본 이름으로 결합될 텍스트를 입력합니다. 요소에는 문서 이름, 분할 영역 이름, 롤오버 상태, 트리거 분할 영역, 파일을 만든 날짜, 분할 영역 번호, 구두점 및 파일 확장명 등이 포함됩니다. 일부 옵션은 파일에 분할 영역이나 롤오버 상태가 포함된 경우에만 관련이 있습니다.

이러한 텍스트 상자를 사용하여 파일 이름 부분의 순서와 서식을 변경할 수 있습니다. 예를 들어, 완전한 단어 대신 약어를 사용하여 롤오버 상태를 나타낼 수 있습니다.

파일 이름 호환성

파일 이름이 Windows(긴 파일 이름 허용), Mac OS 및 UNIX와 호환되게 만드는 옵션을 하나 이상 선택합니다.

폴더에 이미지 넣기

최적화된 이미지를 저장할 폴더 이름을 지정합니다. 분할 영역이 여러 개 포함된 문서에서만 사용할 수 있습니다.

저장할 때 배경 이미지 복사

[배경] 환경 설정 세트에서 지정된 배경 이미지를 보존합니다.

이미지에 제목 및 저작권 정보 포함

웹 페이지에 제목과 저작권 정보를 추가하려면 [파일 정보] 대화 상자에 정보를 입력하면 됩니다. 제목 정보는 이미지를 HTML 파일로 내보낼 때 웹 브라우저의 제목 표시줄에 표시됩니다. 저작권 정보는 브라우저에 표시되지 않지만 HTML 파일에 설명으로 추가되고 이미지 파일에 메타데이터로 추가됩니다.

  1. [파일] > [파일 정보]를 선택합니다.

  2. 웹 브라우저의 제목 표시줄에 표시할 제목을 입력하려면 [파일 정보] 대화 상자의 [설명] 섹션에 있는 [문서 제목] 텍스트 상자에 원하는 텍스트를 입력합니다.

  3. 저작권 정보를 입력하려면 [파일 정보] 대화 상자의 [설명] 섹션에 있는 [저작권 고지 사항] 텍스트 상자에 원하는 텍스트를 입력합니다.

  4. [확인]을 클릭합니다.

이 작업에는 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License의 라이센스가 부여되었습니다.  Twitter™ 및 Facebook 게시물은 Creative Commons 약관을 적용받지 않습니다.

법적 고지 사항   |   온라인 개인 정보 보호 정책