1.1.1 HTML 문서의 기본 구조

1.1.1 HTML 문서의 기본 구조


ePUB의 본문은 XHTML로 이루어져 있다. HTML이란 HyperText Markup Language의 약자로 주로 웹 문서를 만들때 사용되었다. 초기의 웹에서는 이미자와 텍스트로 이루어진 간단한 문서가 대부분이어서 HTML로도 충분했지만, 웹이 발전하면서 이미지와 텍스트 뿐 아니라 동영상, 소리, 다양한 프로그래밍까지 처리가 가능해 지면서 HTML로는 편집자가 원하는 것을 모두 표현하기 어렵게 됐다. 그래서  XHTML이라는 형태로 발전하게 됐다. 하지만 EPUB을 제작하는데 HTML의 역사나 XHTML과의 차이는 중요하지 않다. 이런 내용에 관심을 갖고 공부를 하면 더 좋긴 하겠지만 HTML과 XHTML을 구분하지 못한다고 EPUB을 제작하는데 아무런 문제가 되지 않는다.

EPUB 파일을 편집기로 열면 최소한 한개 이상의 XHTML파일을 볼 수 있다. XHTML과 HTML에는 약간의 차이가 있으나 EPUB 문서를 만드는 수준에서는 XHTML과 HTML을 구분할 필요가 없기 때문에 이 책에서는 XHTML과 HTML을 구분하지 않고 많은 사람들에게 익숙한 HTML로 통일해서 사용하려고 한다.(단, XHTML과 구분이 필요한 경우에는 XHTML로 표현할 것이다.)


<ePUB을 위한 HTML의 기본 구조>


그림1. HTML의 기본 구조


EPUB은 HTML의 기본 구조를 그대로 따르고 있다. IDPF의 EPUB 표준 문서(OPS 2.0.1 참조)에서는 ①처럼 EPUB 문서가 XHTML을 따르고 있음을 반드시 표시하도록 하고 있다. 이 부분에 대한 설명은 전문적인 내용을 포함하고 있고, 내용을 모르더라도 ①을 그대로 넣으면 되기 때문에 자세한 설명은 생략하도록 하겠다. 


을 넣지 않더라도 대부분의 EPUB뷰어에서는 아무 문제가 없지만 반드시 넣기를 권장한다. 자세한 내용을 알고 싶다면 IDPF의 OPS 문서 Section1.4.1을 참고하기 바란다.


로 묶여있는 <html>...</html>은 문서의 시작과 끝을 나타낸다. 이 부분에 책과 관련된 내용이 모두 들어가게 된다. 


은 책을 보는 사용자에게는 보이지 않지만, 뷰어와 문서 본문에 필요한 내용이 담기는 부분이다. 책 제목, 메타데이터, 스타일시트 같은 내용이 여기에 들어간다.


에서 <title>...</title>은 이 문서의 제목이 들어간다. 뷰어에서 챕터의 제목이 표시되는 영역이 있다면 주로 이 부분에 있는 정보를 가져오게 된다. <link... / >로 묶인 부분은 이 책의 편집 스타일을 모아놓은 외부 스타일을 불러오는 부분이다. <title>...</title>과 <link ... / >는 EPUB의 HTML에서 기본적으로 들어간다. 그 외에도 메타데이터, 내부 스타일, 스크립트 등이 <head>...</head>에 들어간다.


에서 비로소 독자가 볼 수 있는 책의 본문이 들어가게 된다. 그리고 앞으로 정리하게 될 HTML의 기본 문법도 이 영역에 들어가는 태그를 주로 설명할 것이다.  <body>...</body>에는 텍스트를 그대로 입력해도 뷰어에 표시되지만 <p>...</p>나 <div>...</div>같은 태그로 텍스트를 묶고, 태그 단위로 편집을 적용하게 된다. 글자 모양, 크기 색을 변경하고, 이미지를 넣는 등 '전자책 편집'은 모두 이 영역에서 이루어진다.


은 본문의 각 문단이나 구성요소를 표현하는 단위이다. <p>...</p>는 단락을, <h1>...</h1>은 제목을, <img...>는 이미지를 표현하기 위한 태그이며 이런 태그들이 모여 하나의 장이 이루어진다. 


다음 장에서는 EPUB을 편집하기 위해 주로 사용되는 태그를 소개하고 태그의 기본적인 사용법을 설명하겠다.

설정

트랙백

댓글

EPUB 제작을 위한 준비 사항

EPUB은 누구나 제작이 가능합니다. 그렇다고 쉽다는 뜻은 아닙니다. 텍스트나 워드 문서를 EPUB으로 전환하기는 아주 쉽습니다. calibre 같은 변환 프로그램을 사용하면 다양한 형태의 문서를 쉽게 EPUB으로 전환할 수 있습니다. 하지만 이렇게 전환된 EPUB은 개인적인 목적으로 사용할 수는 있지만 저자나 출판사가 판매를 할 목적으로 사용하기에는 많이 부족합니다. 

EPUB 변환 프로그램으로 변환한 파일은 원본파일이 아무리 잘 만들어져 있다 해도 불필요한 정보가 많이 들어가게 됩니다. 그리고 원본의 편집을 그대로 유지되지 않고 편집이 복잡한 경우에는 심하게 변형되기도 합니다.

이런 문제를 해결하기 위해 EPUB 편집 도구의 사용법을 익혀야 합니다. 가장 인기 있는 EPUB 편집기 중 하나인 Sigil이나 인디자인, 쿽 파일을 깔끔하게 EPUB으로 전환해 주는 미투북스, 개인 출판을 목적으로 유통까지 연계할 수 있는 유페이퍼 등 다양한 EPUB 편집기가 있습니다.

편집기마다 장점과 단점이 있습니다. 어떤 편집기가 좋고, 어떤 편집기는 좋지 않다고 말하기는 매우 어렵습니다. 사용 목적과 개인 역량에 따라 적당한 편집기를 선택할 수 있습니다. 

이 사이트에서는 중고급 편집을 위해 Sigil을 사용합니다. Sigil은 오픈소스 프로젝트로 여러 개발자가 활발히 참여하고 있는 EPUB 편집기입니다. 무료로 제공되지만 상업적인 목적의 EPUB 제작도 가능하며 EPUB 편집을 위한 다양한 기능을 제공하고 있습니다. 그리고 자동 생성되는 코드가 다른 편집기에 비해 깔끔하고 이미지, 폰트, 본문 등의 파일 관리가 직관적으로 되어 있습니다.

Sigil 다운로드 : https://code.google.com/p/sigil/

위 사이트에서 Sigil을 다운로드 해서 설치하면 이 사이트에서 설명하는 다양한 예제를 실습할 수 있습니다. 

Sigil은 강력한 EPUB 편집 기능을 제공하지만 초보자에게는 조금 어려울 수 있습니다. WYSIWYG 방식의 편집을 제공하지만 Code View 방식의 편집 기능이 더 강력하기 때문에 HTML과 CSS를 모르면 다양한 형태의 전자책 편집을 하기 어렵습니다. 제대로 된 EPUB을 만들기 위해서는 간단한 홈페이지를 만들 수 있는 수준의 HTML, CSS 실력이 필요합니다. HTML과 CSS 역시 EPUB 제작자에게는 꼭 필요한 항목입니다.

 

'EPUB 제작의 기초 > EPUB이란?' 카테고리의 다른 글

EPUB 제작을 위한 준비 사항  (0) 2013.10.11
EPUB 파일의 구조 및 요소별 기능  (0) 2013.10.10
IDPF의 EPUB 공개 표준 명세서  (1) 2013.10.10
EPUB의 기본 정의  (0) 2008.10.08

설정

트랙백

댓글

EPUB 파일의 구조 및 요소별 기능

EPUB 파일은 여러개의 파일이 ZIP으로 압축된 패키지 파일입니다. 이 패키지 파일에는 여러개의 파일이 존재하는데 OCF에서 기본 구조를 정의하고 있습니다. EPUB파일의 확장자를 ‘.zip’으로 수정한 후 압축프로그램으로 열면 아래와 같은 구조를 확인할 수 있습니다. 

EPUB파일 안에는 여러개의 폴더가 존재합니다. EPUB의 가장 바깥쪽 폴더에는 mimetype 파일과 [META-INF], [OEBPS(OPS)] 폴더가 있으며 [OEBPS]폴더 내에는 content.opf, toc.ncx 파일이 존재합니다. 

minetype 파일은 반드시 동일한 이름으로 존재해야 하는데 일반 텍스트 편집기로 열어보면 'application/epub+zip' 이런 정보가 담겨 있어 이 파일이 EPUB 파일임을 알려줍니다. EPUB2.0에서는 반드시 이 텍스트가 들어가야하며 공백 등 다른 문자를 허용하지 않습니다. 또한 이 파일은 압축을 하면 안되도록 규정되어 있으나 EPUB3.0에서는 이런 제한이 사라졌습니다.

[META-INF] 폴더 안에는 container.xml 파일이 반드시 포함되야 합니다. 이 파일은 뷰어가 EPUB파일을 열 때 다른 파일들이 어디에 있는지 위치를 알려주는 역할을 합니다. 

  <?xml version="1.0" encoding="UTF-8" ?> 

-<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">

- <rootfiles>

  <rootfile full-path="OEBPS/content.opf" media-type="application/oebps-package+xml" /> 

  </rootfiles>

  </container>

container.xml 에는 이 전자책의 루트 폴더(최상위 폴더)가 어디에 위치하는지를 알려주고, content.opf 파일의 위치를 지정합니다. 여기서 지정된 내용에 따라 [OEBPS]폴더 명이 달라질 수있습니다. 아울러 container.xml에 적혀있는 파일명과 위치에 정확히 content.opf 파일이 존재해야 합니다. 따라서 content.opf 파일은 container.xml파일의 정보에 따라 파일명을 변경할 수 있습니다. 


 이외에도 metadata, manifest, rights, signatures 등 다양한 메타 정보 파일이 들어올 수 있습니다. 아이북스(iBooks)에 필요한 정보인 [com.apple.ibooks.display-options.xml] 파일 역시 이 폴더 안에 들어갑니다. 


[OEBPS]는 실제 EPUB의 콘텐츠가 들어가는 폴더입니다. 폴더명을 [OPS]나 [CONTENT] 등 임의의 폴더명으로도 지정할 수도 있습니다. 단, 위에서 설명한 container.xml에 정확한 이름이 명시되어야 합니다. 이 폴더에는 폰트, 이미지, 텍스트, CSS파일 등이 들어가는데 파일을 저장하는 규칙은 임의로 지정할 수 있습니다. 예를 들어 이미지 파일을 [Images]폴더가 아닌 [Text]폴더 내에 넣을 수도 있고, [Images]폴더 명을 [Img]나 [Media] 등으로 변경할 수도 있습니다. 


[OEBPS]는 EPUB 파일의 Root폴더 역할을 하며 콘텐츠 제작시 아주 중요한 역할을 합니다. Root 폴더란 컴퓨터에서 최상위 폴더를 의미하며 윈도우 PC에서 ‘C:/’에 해당합니다. Root 폴더가 중요한 이유는 두가지입니다. 첫째, 콘텐츠 파일은 루트폴더 내에 존재해야 하기 때문에 콘텐츠 편집에 필요한 모든 파일은 [OEBPS] 폴더 내에 위치하기 때문입니다. 둘째, [OEBPS]폴더가 Root 폴더 역할을 하기 때문에 콘텐츠의 위치를 알려주는 ‘경로’는 모두 [OEBPS]폴더로부터 시작하기 때문입니다. 


첫번째 이유는 다른 설명이 없어도 이해하기 쉽습니다. 콘텐츠 제작에 필요한 모든 파일을 [OEBPS]폴더 안에 넣으면 됩니다. 하지만 두번째 이유는 파일시스템을 이해하지 못하면 어려울 수 있습니다.

지도상에서 내가 있는 위치를 표시할때 우리는 주소를 사용합니다. [서울시 > 종로구 > 종로1가 > 1번지] 하는 식으로 큰 지역에서 작은 지역으로 주소를 적게 됩니다. 컴퓨터의 파일시스템 역시 이런 규칙을 갖고 있고 이런 주소를 ‘경로’라고 부릅니다. 컴퓨터 하드디스크에서 가장 큰 지역은 [C:/]이고 epub 폴더가 루트에 있다면 [C:/epub/]가 ‘경로’가 됩니다. [C:\]는 가장 큰 값이기 때문에 서울 앞에 [대한민국]을 붙이지 않는 것 처럼 [../epub/]로 표시할 수 있습니다. 여기서 [../]라는 표시는 Root폴더를 의미합니다.


이 규칙을 따르면 위 예제에서의 cover.jpg 파일의 경로는 [C:/epub/OEBPS/Images/cover.jpg] 또는 [../epub/OEBPS/Images/cover.jpg]가 됩니다. 그런데 [C:\epub]폴더는 [C:/]가 아닌 다른 곳으로 이동할 수 있기 때문에 [epub]폴더가 어디에 있느냐에 따라 경로가 변경됩니다. 그래서 [epub]폴더가 변경되더라도 cover.jpg파일의 경로가 항상 동일할 수 있도록 EPUB 뷰어는 [OEBPS]폴더를 Root폴더로 인식하게 됩니다. [OEBPS]폴더가 Root 폴더가 되면 epub 폴더가 어느 위치에 있더라도 cover.jpg 파일의 경로는 항상 [../Images/cover.jpg]가 됩니다.


조금 어려운 내용이라 이해가 어려울 수 있습니다. EPUB을 만들 때 이 내용을 이해하지 않더라도 괜찮습니다. 단, 내가 필요로 하는 파일의 위치가 어디에 있는지를 알려주는 경로가 [OEBPS]에서 시작하고, [OEBPS]를 기준으로 [../Images/cover.jpg][../Fonts/font.tts][../Text/cover.html]이라는 것만 기억하고 있다면 EPUB 을 만드는데 큰 도움이 될 것입니다.


[OEBPS]안에 들어가는 파일명, 폴더명은 편집자가 마음대로 정할 수 있습니다. 챕터 파일을 text01.xhtml, text02.xhtml로 해도 되고, chap01.xhtml, chap02.xhtml로 해도 됩니다. 첫번째 챕터가 01이 아니어도 됩니다. 첫번째 챕터를 chap02.xhtml, 두번째 챕터를 chap01.xhtml로 만들어도 상관 없습니다. 다만, 파일을 수정할 때 구조를 쉽게 알아보려면 일정한 규칙을 정해 놓고 그 규칙을 따르는 것이 좋습니다. 


content.opf, toc.ncx 이 두 파일은 뷰어에서 참조를 합니다. EPUB 내에 있는 모든 파일의 목록을 담고 있는 content.opf 파일은 뷰어가 콘텐츠를 불러들이는 길잡이를 하고 책을 보는 순서를 지정합니다. toc.ncx는 책의 목차 정보를 담고 있습니다. 이 두 파일은 구조가 복잡해서 직접 작성하기는 어렵기 때문에 저작 도구가 자동으로 생성합니다.


content.opf 파일은 container.xml에서 그 위치를 지정해 줘야합니다. 이 파일은 EPUB파일 내에 있는 모든 파일의 위치와 콘텐츠를 보는 순서 정보를 담고 있기 때문에 뷰어가 제일 먼저 확인하는 파일 중 하나입니다. 이 파일에 위치가 지정되지 않았다면 뷰어에서 오류가 날 수 있습니다. 


toc.ncx 파일은 목차 정보를 담고 있습니다. 뷰어에서 [목차]를 선택했을 때 참고하는 파일이기도 합니다. 

 

'EPUB 제작의 기초 > EPUB이란?' 카테고리의 다른 글

EPUB 제작을 위한 준비 사항  (0) 2013.10.11
EPUB 파일의 구조 및 요소별 기능  (0) 2013.10.10
IDPF의 EPUB 공개 표준 명세서  (1) 2013.10.10
EPUB의 기본 정의  (0) 2008.10.08

설정

트랙백

댓글


티스토리 툴바