posted by 내.맘.대.로 2017. 6. 16. 11:33

내맘대로의 EPUBGUIDE.NET에서 편집자의 의도를 그대로 살려 전자책을 제작해 드립니다.

종이책의 편집 스타일을 최대한 유지하며, 팝업 주석 처리, 이미지 확대 축소 등 전자책의 장점을 반영하여 전자책을 제작합니다. 탬플릿을 사용하지 않고, 책 한권 한권 고유 스타일을 살리기 때문에 전자책에서도 종이책 디자인을 느낄 수 있습니다.

한국출판문화진흥원의 [텍스트형 전자책 제작 지원 사업] 선정 도서는 ‘제작 난이도별 제작비 산정 기준에 근거하여’ 제작 단가를 산정하고, 일정에 맞춰 제작을 해 드리니 많은 문의 바랍니다.

자세한 내용은 여기로: https://www.epubguide.net/notice/309

오래 전 작성된 글은 현재의 Sigil 버전과 차이가 날 수 있습니다. 등록 일자를 확인 하고 1년 이상 지난 글은 변경된 내용이 있는지 확인하시기 바랍니다.

이 글은 2017년 6월 16일에 작성됐습니다. 네이버 나눔글꼴이 업데이트 되면 이 글 내용은 신경쓰지 않으셔도 되요.


전자책 만들 때 네이버 나눔명조 사용하시는 분들은 아래 내용 확인하고 작업하세요.


폰트 파일에도 버전이 있습니다. 폰트도 오류가 생길 수 있고 새로운 코드가 추가될 수도 있어요. 그럼 새로운 버전을 내게 됩니다. 사용자들은 폰트 버전을 확인하는 경우가 별로 없어 '나눔명조'하면 모두 똑같다고 생각을 하지만 버전에 따라 다를 수 있습니다.


제가 갖고 있는 나눔명조 파일은 


나눔명조 v3.01

나눔명조 v3.011

모바일 나눔명조


나눔명조 v3.01과 나눔명조 v3.011은 파일명이 똑같이 NanumMyeongjo.ttf(otf), 글자 모양도 똑같아 그냥 보면 구분이 되지 않습니다. 파일 버전을 확인하려면 폰트 관리자로 열어봐야되요.



폰트 관리자로 파일을 열면 이렇게 폰트 버전을 확인할 수 있습니다.


갑자기 폰트 얘기를 왜 꺼냈냐 하면, 나눔명조 3.01버전에 문제가 있어서 이 버전으로 전자책을 만들면 모바일 뷰어에서 오류가 나기 때문이에요.


아래 이미지를 보세요. 같은 EPUB 파일에 한쪽은 나눔명조3.01, 다른 한쪽은 나눔명조3.011 버전을 적용했을 때 모바일(안드로이드) 기기에서 이렇게 보입니다. 본문에 나눔명조를 적용했는데 3.01은 굴림/고딕 계열의 시스템폰트로 대체됩니다. 


왼쪽이 나눔명조 3.01 오른쪽이 3.011 버전. 폰트 외 모든 설정은 동일함


이 문제를 확인한건 한참 됐는데 그동안은 문제라 생각하지 않았어요. 네이버 홈페이지(http://hangeul.naver.com/font)에서 최신 버전(3.011)을 배포하고 있었거든요. 1년 전인지 2년 전인지는 정확히 기억 안나지만 문제를 파악하고 새로 폰트를 내려받았을 때 수정된 버전이 올라와 있었습니다. 수정 버전을 넣으니 정상으로 보였고요. 


그런데 최근(2017년 7월 16일 기준) 다시 받아보니 문제가 있는 구버전 파일로 바뀌었습니다. 

이유는 모르겠지만 최근에 네이버에서 나눔명조 파일을 다운로드 받은 분이라면 나눔명조 파일로 전자책을 만들면 안드로이드 계열 스마트폰에서는 명조 글꼴이 반영되지 않을거예요. 아이폰 계열은 확인해 보지 못했습니다. 


PC는 나눔명조3.01이 반영되기 때문에 휴대폰에서 확인하지 않으면 이상 없다고 생각하고 유통사에 등록할 수 있습니다. 그러니 등록 전에 꼭 휴대폰에서 확인을 해보세요.



만약 나눔명조를 반영했는데 나눔명조가 아닌 시스템 기본 폰트가 반영됐다면 이 폰트를 다운받아 사용하세요. 


은바탕도 비슷한 문제가 있습니다. 은바탕은 버전이 1.02로 동일한데 2008년에 수정된 배포본이 있어요. 버전 변경은 되지 않아 나눔명조처럼 버전으로 확인은 어렵고, EPUB 파일에 넣어 스마트폰 뷰어로 확인해 봐야 문제가 있는지 알 수 있습니다.


은글꼴에 문제가 있는 분은 이 파일을 다운받아 사용하시면 정상으로 보일거예요.




이 글은 2017년 6월 16일에 작성됐습니다. 네이버 나눔글꼴이 업데이트 되면 이 글 내용은 신경쓰지 않으셔도 되요.

반응형
posted by 내.맘.대.로 2017. 6. 14. 10:50

내맘대로의 EPUBGUIDE.NET에서 편집자의 의도를 그대로 살려 전자책을 제작해 드립니다.

종이책의 편집 스타일을 최대한 유지하며, 팝업 주석 처리, 이미지 확대 축소 등 전자책의 장점을 반영하여 전자책을 제작합니다. 탬플릿을 사용하지 않고, 책 한권 한권 고유 스타일을 살리기 때문에 전자책에서도 종이책 디자인을 느낄 수 있습니다.

한국출판문화진흥원의 [텍스트형 전자책 제작 지원 사업] 선정 도서는 ‘제작 난이도별 제작비 산정 기준에 근거하여’ 제작 단가를 산정하고, 일정에 맞춰 제작을 해 드리니 많은 문의 바랍니다.

자세한 내용은 여기로: https://www.epubguide.net/notice/309

오래 전 작성된 글은 현재의 Sigil 버전과 차이가 날 수 있습니다. 등록 일자를 확인 하고 1년 이상 지난 글은 변경된 내용이 있는지 확인하시기 바랍니다.

전자책을 편집하다 보면 수많은 스타일을 사용하게 됩니다. 그런데 스타일을 span 태그로 적용을 하면 코드가 복잡해지고, 스타일 선택자를 기억하기도 어렵고, 코드도 길어지고.... 불편한 점이 많아요.


영문 표기를 예로 들어 볼까요?


EPUB(electronic publication)은 국제 디지털 출판 포럼(IDPF, International Digital Publishing Forum)에서 제정한 개방형 자유 전자서적 표준이다. EPUB은 자동공간조정(reflowable)이 가능하게 끔 디자인 되었다.


책에서 흔히 보는 편집입니다. 이런 편집을 span 태그로 스타일을 적용하면 이렇게 되요.


<p>EPUB<span class="txt_small">(electronic publication)</span>은 국제 디지털 출판 포럼<span class="txt_small">(IDPF, <span class="txt_italic">italicInternational Digital Publishing Forum</span>)</span>에서 제정한 개방형 자유 전자서적 표준이다. EPUB은 자동공간조정<span class="txt_small">(reflowable)</span>이 가능하게 끔 디자인 되었다.</p>


깔끔함을 떠나서 입력해야 하는 태그와 속성이 너무 많습니다. 당연히 입력 시간이 오래 걸릴 수 밖에 없어요. 그리고 태그와 스타일 속성 역시 파일 크기에 영향을 줍니다. 본문 텍스트 파일은 100kb밖에 안되는데 HTML로 편집하면 200kb가 될 수도 있어요. 파일 용량이 커지면 뷰어 로딩 시간이 길어집니다. 챕터 넘어갈 때 보이는 로딩 표시를 짧게 하려면 파일 용량을 줄이는게 가장 효과적이에요.


어떤 분들은 선택자 이름이 길다고 t1, t2 이렇게 선택자 이름을 짧게 만들어요. 이것도 방법은 되겠지만 추천하고 싶지는 않습니다. 개념 잡힌 편집자(프로그래밍 개발자도 마찬가지고)라면 선택자(개발에서는 변수) 이름은 누가 봐도 쉽게 이해할 수 있는 이름을 사용합니다. 


그럼 선택자 이름을 고치지 않고 위 코드를 어떻게 정리할 수 있을까요?


<p>EPUB<sub>(electronic publication)</sub>은 국제 디지털 출판 포럼<sub>(IDPF, <i>International Digital Publishing Forum</i>)</sub>에서 제정한 개방형 자유 전자서적 표준이다. EPUB은 자동공간조정<sub>(reflowable)</sub>이 가능하게 끔 디자인 되었다.


이 코드는 어때요? 훨씬 깔끔해 졌지요?

span 태그를 쓸 때보다 파일 용량도 훨씬 줄일 수 있고, 보기에도 더 깔끔해 보입니다. 그런데 '누가 봐도 쉽게 이해할 수 있는 이름'인가요?

HTML을 조금만 안다면 <sub>와 <i>태그가 의미하는 바를 정확히 알 수 있을거예요. 


그런데 <sub>는 아래첨자낳아요. 그럼 EPUB(electronic publication) 이렇게 보이지 않나요?


<sub>를 그대로 쓰면 아래첨자로 보이겠지요. 그래서 CSS로 <sub>태그의 기본 스타일을 수정해 줍니다.


 sub { font-size : 0.8em; vertical-align : baseline; }


이렇게 스타일을 수정하면 아래첨자가 아니라 본문 텍스트에 맞춰 작은 글씨로 보이게 되지요.


HTML에는 이렇게 활용할 수 있는 기본 태그가 많이 있습니다.

IDPF의 '공개 출판 구조(OPS) 2.0' '2.2.1 필수모듈'을 보면 xhtml에서 사용 가능한 태그 목록이 나와 있습니다(http://www.odpf.or.kr:8080/wp/?page_id=192#221) 이것만 써야 한다는건 아니고, 최소한 이 태그들을 뷰어가 표현해야 한다는 거예요.


이 태그들 중 텍스트 편집에 활용할 만한 것들을 몇가지 소개합니다. 여기 소개한 태그보다 훨씬 많지만 책 한권 편집하는데 이정도만 사용해도 span 태그를 거의 쓸 일이 없습니다. 본문 안에 다른 종류의 글자가 얼마나 많이 들어가는지 생각해 보세요. 본문, 외국어 표기, 인용구, 이미지 설명(캡션) 등등. 이런 요소가 20개씩 들어가는 책은 찾아보기 힘들잖아요. 아주 복잡한 책이 아니라면 10개 정도 스타일로 본문에 쓰인 텍스트를 대부분 표현할 수 있습니다. 


태그 

기능 및 활용

스타일 예

 <sub>

- 본래 기능은 아래첨자

- 스타일을 주면 외국어 병용 표기[영어English]나 괄호 설명[IDPF(국제 디지털 출판 포럼)] 처럼 본문 글자 아래쪽으로 정렬된 작은 글씨를 표현 가능

 sub {

 font-size : 0.8em;

 vertical-align : baseline;

}

 <sup>

- 본래 기능은 윗첨자

- sub와 비슷하나 위로 정렬된 작은 글씨를 표현 가능 IDPF(국제 디지털 출판 포럼)

 sup {

 font-size : 0.8em;

 vertical-align : 30%;

}

 <cite>

- 문장 내 짧은 인용구(HTML5에서는 작품의 제목)를 표현할 때 사용

- 기본 스타일은 이탤릭이나 CSS 수정 가능

예) 빈 센트 반 고흐 해바라기

예) IDPF(EPUB 전자책 표준을 제안했다)

cite {

 font-style : normal;

 font-size : 0.9em;

}

 <i>

- 기울임

- 기울임 스타일에 사용

- 기울임 글꼴에 다른 속성(색, 글자크기)을 지정해 사용할 수 있음

- 기울임 속성은 유지하기를 권함

i {

 font-style : italic;

 font-size : 1.2em;

 color : blue;

}

 <em>

- 강조(기울임으로 표현)

- 기본 스타일은 <i>처럼 기울임으로 표현되는데 '강조'를 위한 태그임

- 기울임 속성을 지우고 스타일을 지정해 '강조'가 필요한 글자에 사용 가능

em {

  font-style : normal;

  font-size : 1.1em;

  color : red;

 <strong>, <b>

- 강조, 진한 글씨체

- 진한 글씨체로 강조를 해야할 때 사용(진한 글씨체(bold) 속성은 유지하기를 권함. 다른 속성 부여할 수 있음)

 strong, b {

  font-size : 0.8em;

  font-family : '굴림';

}

 <small>

- 본문 보다 작은 글씨체

- 작은 글씨체 속성은 그대로 유지하고 다른 스타일을 적용할 수 있음

 
 <big>

- 본문 보다 큰 글씨체

- 큰 글씨체 속성은 그대로 유지하고 다른 스타일을 적용할 수 있음

 


이정도만 사용해도 웬만한 책은 편집할 수 있을거예요. 

본문보다 작은 글씨체로 외국어 동시 표기가 필요하고, 다른 스타일로 괄호 설명을 넣어야 한다면 <sub>와 <cite>를 쓰는 식으로요.


이렇게 기본 태그를 사용해도 다른 스타일이 필요하다면 그때 <span> 태그를 활용하면 되요. 


중요!!!

태그는 편집자가 CSS에서 어떤 스타일이든 적용할 수 있습니다. 예를 들어 이탤릭 태그인 <i>에 font-style : normal;을 적용하면 기울임이 사라져요. 


하지만 태그 고유의 속성은 그대로 살려두는게 좋습니다. <sub>를 아래첨자 대신 본문글씨 아래쪽에 배치된 작은 글씨체로 사용해도 되지만 본문 위쪽에 배치된 작은 글씨로 사용하는건 피해야 한다는 소리예요. 본문글씨 위쪽에 배치하려면 <sup> 태그가 있습니다. <sub> 태그에 스타일을 적용하면 윗첨자로 사용할 수 있다고 해서 윗첨자로 사용을 하면 '누가 봐도 쉽게 이해할 수 있는' 코드가 아니거든요.


<b> 태그는 진한 글씨체bold 태그인데 bold 속성을 둔 채로 기울임을 적용하는건 괜찮지만 bold 속성을 없애고 기울임 속성만 남기는건 피해야 되요. 기울임 태그<i>가 있는데 <b> 태그로 진한 글씨체 없이 기울임만 적용하면 오류가 나지는 않지만 다른 편집자가 수정할 때 당황할 수 있습니다.


오류가 나지 않는다는 보장도 없어요. 예를 들어 뷰어에서 EPUB 내부의 CSS를 무시하고 뷰어 스타일을 강제 적용 시킬 경우 태그의 원래 속성이 반영될 수 있어요. 뷰어에서 '사용자 설정'을 사용하면 전자책 자체의 스타일을 무시하기도 합니다. 그럼 이탤릭만 설정한 <b>태그가 진한 글씨로 보이게 되지요. 그래서 태그의 원래 기능은 그대로 살려두는게 좋아요.








반응형
posted by 내.맘.대.로 2017. 6. 10. 13:03

내맘대로의 EPUBGUIDE.NET에서 편집자의 의도를 그대로 살려 전자책을 제작해 드립니다.

종이책의 편집 스타일을 최대한 유지하며, 팝업 주석 처리, 이미지 확대 축소 등 전자책의 장점을 반영하여 전자책을 제작합니다. 탬플릿을 사용하지 않고, 책 한권 한권 고유 스타일을 살리기 때문에 전자책에서도 종이책 디자인을 느낄 수 있습니다.

한국출판문화진흥원의 [텍스트형 전자책 제작 지원 사업] 선정 도서는 ‘제작 난이도별 제작비 산정 기준에 근거하여’ 제작 단가를 산정하고, 일정에 맞춰 제작을 해 드리니 많은 문의 바랍니다.

자세한 내용은 여기로: https://www.epubguide.net/notice/309

오래 전 작성된 글은 현재의 Sigil 버전과 차이가 날 수 있습니다. 등록 일자를 확인 하고 1년 이상 지난 글은 변경된 내용이 있는지 확인하시기 바랍니다.

얼마 전 모 출판사 영업자를 만났습니다.

전자책 제작과 관련해 얘기를 하는데 제작 업체와 스타일을 맞춰 만족할 만한 수준까지 오는데 1년 가까이 걸렸다고 하더군요. 이 작업을 다시 하고싶지 않아 같은 업체에 제작을 계속 맡긴다고 했습니다.


이 얘기를 듣고 깜짝 놀랐습니다.

무슨 스타일을 맞추는데 1년식이나 걸리지?

종이책을 기준으로 스타일을 잡고, 출판사에서 수정해 달라는 부분 수정하면 되는데 스타일을 잡는데 1년이 걸린다는건 상식적으로 이해가 되지 않았습니다.  


그런데 최근에 제게 문의를 주신 출판사 대표님을 보고 출판사와 제작사 사이에 무슨 일이 벌어지는지 이해를 할 수 있게 됐습니다. 출판사 대표님이 제작사에 콘텐츠 문제를 몇가지 얘기하며 수정을 요청했는데 제작사에서는 대표님이 전자책을 잘 몰라 그런다며 'EPUB의 특성'이라는 답변을 받았다고 합니다. 정말 대표님의 전자책에 대한 이해가 낮아서 그런건지 저한테 샘플을 보내 확인해 달라고 하셨습니다. 


전자책(EPUB) 파일은 뷰어로 봅니다.

뷰어로 볼 때 글자와 이미지가 제대로 보이면 문제 없다고 생각하지요.

그런데 뷰어로 보이는 부분이 전부가 아닙니다.

뷰어에 글자와 이미지 같은 콘텐츠가 배치되도록 하는 HTML과 CSS라는 코드가 정말 중요합니다.

제가 얘기하는 전자책의 품질은 이 부분입니다.


제가 확인한 제작사의 EPUB은 품질이 형편없었습니다. 

이름만 대면 알만한 규모가 큰 제작사였는데 이 파일을 만든 사람이 전자책 제작 경험이 있나 싶을 정도로 수준이 낮았습니다. 이러니 스타일 잡는데 1년이나 걸리지 하는 생각이 들더군요.


1. 불필요한 코드와 스타일 남발의 문제


* 콘텐츠와 제작사 공개를 원치 않아 내용 파악이 가능할 정도만 남기고 모자이크 처리를 했습니다. 모자이크 윤곽만으로 설명에 대한 이해가 어렵더라도 양해 부탁드립니다. 


불필요한 스타일과 코드가 가득한 제작사의 EPUB(왼쪽)과 이를 수정한 코드


제작사의 EPUB은 필요 없는 코드와 스타일이 가득했습니다. CSS 스타일시트에 정의하지 않은 스타일시트가 본문에 쓰이기도 했고, 


들어갈 이유가 '전혀' 없는 코드도 가득했습니다. 수십만원을 받고 전자책 제작을 전혀 모르는 사람이 편집 프로그램으로 대충 만든 결과물을 제공했던 것이지요.



<span> 태그는 단독으로 쓰일 이유가 전혀 없다. 


쓸 필요가 없는 <span>태그를 남발하고 class="db dbron2 co_23" 같은 의미 없는 속성을 반복해서 사용한다. <p class="txt b1 t1"> <p class="txt b1 t1"> 같은 속성도 쓸 이유가 전혀 없는데 거의 모든 본문에 사용됐다. 



이렇게 만든 결과물이 뷰어에서 제대로 보일리 없습니다. 아래 이미지는 제작사에서 만든 결과물이 뷰어에서 글자크기, 페이지 구분에 따라 어떤 문제가 생기는지 보여줍니다.



이미지의 배치 순서를 보면 아래처럼 오른쪽 어울림 처리한 작은 이미지가 먼저 나오고, 가운데 정렬 된 큰 이미지가 다음에 나와야 한다.(수정한 파일)




제작사의 원본 파일은 일부 뷰어에서는 제대로 보이지만 글자크기나 화면 크기에 따라 엉뚱한 결과가 나온다. 뒷쪽에 들어간 가운데 정렬 이미지가 먼저 나오고, 오른쪽 어울림으로 넣은 이미지가 본문 내용과 상관 없는 자리에 배치됐다.(제작사 원본 파일)


이런 문제는 'EPUB의 특성'이 아닙니다. 그냥 제작을 잘못 한 것 뿐입니다. 그런데 이 문제를 수정해 달라고 하자 EPUB의 특성이라는 답변을 받았다고 합니다. 쓸데 없는 코드가 반복되고, 필요 없는 스타일을 의미 없이 추가하다 보면 제작하는 프로그램에서는 제대로 보이지만 다른 뷰어에서는 엉뚱한 결과가 나올 수 밖에 없습니다. 이 문제를 샘플이 아주 잘 보여주고 있습니다.





2. '실력 없음'은 EPUB의 특성이 아니다.


문제는 이 뿐 아닙니다. 편집자가 CSS의 속성에 대한 이해만 조금 있어도 해결할 수 있는 문제조차 수정이 제대로 되지 않았다고 합니다. 



아래 이미지를 보면(모자이크 처리로 문제점이 한눈에 들어오지 않을 수 있습니다) 왼쪽 이미지는 본문 안에 배치된 사진이 화면 상단에 여백 없이 붙습니다. 오른쪽 이미지는 화면 상단과 사진 사이에 여백이 들어가지요.


배경색이 없었다면 본문 사진의 상단 여백은 아무 문제가 되지 않습니다. 그런데 본문에 배경색이 들어가면 오른쪽 처럼 상단에 여백이 없을 경우 편집에 문제가 있는 것 처럼 보입니다. 편집자라면 당연히 눈에 거슬릴테고 수정을 요청하겠지요.



왼쪽이 제작사, 오른쪽이 수정한 파일. 이미지에 여백을 살짝 주면 해결할 수 있다. 절대 EPUB의 특성 때문에 생기는 현상이 아니다.


EPUB의 특성은 맞습니다. 글자 크기나 화면 크기에 따라 사진이 앞쪽에 들어갈 수도 있고 텍스트 사이에 나올 수도 있습니다. 이렇게 화면 위에 텍스트 없이 사진이 먼저 나오지 않을 수 있지요. 저도 이런 부분을 놓치고 편집한 적이 많이 있습니다.


그런데 검수 과정에서 눈에 띄지 않아 지나친 것과, 출판사에서 문제점을 발견해 수정을 해 달라고 했는데 'EPUB의 특성' 운운하며 문제가 없다고 답변한 것은 차원이 다릅니다. 이 문제 역시 간단히 수정할 수 있었음에도 불구하고 제대로 조치를 취하지 않았다면 이건 실력이 없는것입니다. 



이런 예는 또 있습니다. 아래 이미지는 원래 본문에 텍스트와 오른쪽 어울림으로 이미지가 배치돼야 합니다. 그런데 이 역시 글자크기/화면 크기에 따라 이렇게(왼쪽 이미지) 본문 끝에 배치가 되었습니다. 어떤 뷰어에서는 제대로 보이지만 뷰어에 따라 이런 엉뚱한 결과가 나온 것입니다. 이 역시 간단히 수정을 할 수 있었습니다(오른쪽 이미지) 

수정을 하고 나니 어떤 뷰어에서도 오른쪽과 같은 오류는 나오지 않았습니다. 항상 왼쪽 이미지처럼 본문과 배치가 됐습니다. 수정이 어렵지도 않습니다. CSS에서 속성 한두개만 수정하면 끝나는 아주 간단한 작업입니다. 



이미지는 글자크기/화면 크기와 상관 없이 편집자가 배치한 곳에 표시되야 한다. 본문과 상관 없는 곳에 이미지가 표시되서는 안된다





3. 진짜 EPUB의 특성일 수도 있다. 하지만 방법이 없는건 아니다.


'EPUB의 특성'으로 어쩔 수 없는 부분도 있습니다. 아래처럼 이미지 아래에 텍스트로 캡션을 넣을 경우 한 페이지 내에 이미지와 캡션이 들어갈 공간이 없으면 다음 페이지로 텍스트가 넘어갑니다. 이건 진짜 EPUB의 특성으로 태그와 CSS를 이용해 해결하기 어렵습니다.


그래도 해결 방법이 전혀 없는건 아닙니다. 

저는 전자책을 제작할 때 캡션을 텍스트로 넣을지, 이미지로 넣을지를 고민합니다. 대부분 텍스트로 넣는데 간혹 텍스트를 이미지에 포함시키기도 합니다. 어떤 경우에 이미지로 넣는지 설명은 불가능합니다. 책의 특성에 따라 그때 그때 달라지기 때문이지요.




이 책에도 이미지 크기가 세로로 길어 캡션이 다음페이지로 넘어가는 경우가 생겼습니다. 대표님은 이게 마음에 들지 않아 한 페이지에 표시되기를 원했습니다. 


이 경우 해결 방법은 2가지입니다. 이미지에 텍스트를 넣어 다음 페이지로 넘어가지 않도록 하는 방법과 '제대로 된 설명'을 통해 이 문제를 받아들이도록 하는 것이지요. 저라면 제대로 된 설명을 해서 설득을 했을 것입니다. 


EPUB의 특성은 맞는데 'EPUB의 특성이니 어쩔 수 없다'는 말도 안되는 답변 대신, 왜 이런 문제가 생기고, 이미지로 넣었을 때의 장단점과 텍스트로 넣을 때의 장단점을 제대로 전달한 후 선택을 하도록 했어야합니다.




꾸준히 책을 내는 규모있는 출판사는 1년씩 걸려 스타일을 잡아주고, 가끔 전자책을 제작하는 작은 규모의 출판사에는 'EPUB의 특성'이라며 간단히 수정할 수 있는 것 조차 수정하지 않았다는건 말이 되지 않습니다.


그 전에, 스타일을 맞추는데 1년이 걸린다는 것 자체가 말이 되지 않습니다. HTML과 CSS에 대해 제대로 이해를 하고, 전자책이 홈페이지와 어떤 차이가 있는지를 알면 스타일을 맞추는데 1년이 걸리지 않습니다. 책 한권만 작업하면 출판사가 원하는 편집이 무엇인지 파악할 수 있어야지요.


출판사도 '전자책의 품질'에 관심을 가져야 합니다. 제작사에 맡겨놓고 결과물을 제대로 보지 않으면 이런 문제가 계속 생길 수 밖에 없습니다. 제작사에서 온 EPUB 파일을 유통사 뷰어에 넣고 제대로 보이는지 문제는 없는지 확인해야 합니다. 확인해서 문제가 있다면 수정을 해달라고 요구를 해야하고요.


끝으로...

전자책(EPUB)은 종이책과 다릅니다. 그래서 늘 종이책과 전자책을 똑같이 만들지 말라고 강조를 합니다. 하지만 이 차이를 제작 실력 부족을 감추기 위해 사용해서는 안됩니다. 전자책과 종이책은 분명 다르지만 'EPUB의 특성'을 핑계로 수정 가능한 '문제'를 EPUB의 '특성'으로 속이는 짓을 하는 전자책 제작자는 사라졌으면 하는 바람입니다. 



(출판사 대표님의 요청으로 일부 내용을 수정했습니다.)


반응형
posted by 내.맘.대.로 2017. 6. 2. 14:47

내맘대로의 EPUBGUIDE.NET에서 편집자의 의도를 그대로 살려 전자책을 제작해 드립니다.

종이책의 편집 스타일을 최대한 유지하며, 팝업 주석 처리, 이미지 확대 축소 등 전자책의 장점을 반영하여 전자책을 제작합니다. 탬플릿을 사용하지 않고, 책 한권 한권 고유 스타일을 살리기 때문에 전자책에서도 종이책 디자인을 느낄 수 있습니다.

한국출판문화진흥원의 [텍스트형 전자책 제작 지원 사업] 선정 도서는 ‘제작 난이도별 제작비 산정 기준에 근거하여’ 제작 단가를 산정하고, 일정에 맞춰 제작을 해 드리니 많은 문의 바랍니다.

자세한 내용은 여기로: https://www.epubguide.net/notice/309

오래 전 작성된 글은 현재의 Sigil 버전과 차이가 날 수 있습니다. 등록 일자를 확인 하고 1년 이상 지난 글은 변경된 내용이 있는지 확인하시기 바랍니다.

-내용 추가-
이 글은 2017년 작성되었습니다.

EPUB3 변환 플러그인을 이용하면 아래 설명처럼 복잡한 방법을 사용하지 않아도 됩니다.

https://www.mobileread.com/forums/showthread.php?p=2973066

이제 플러그인으로 클릭 한번이면 EPUB2 파일을 EPUB3로 변환할 수 있습니다.

 

앞 글(http://epubguide.net/224)에서 EPUB2를 EPUB3로 변환해야 하는 상황을 설명드렸습니다. 사족이 너무 길어져 글을 나누게 됐지만, 전자책을 만들다 보면 EPUB2를 EPUB3파일로 변환해야 하는 일이 생길 수 있습니다.

 

이번 글은 Sigil에서 EPUB2를 EPUB3로 변환하는 방법을 설명드리려고 합니다. 

 

EPUB2에서 epub:type 속성을 사용하거나 aside 등의 태그를 쓰면 아래처럼 오류가 발생합니다. 

 

 

 

뷰어에서 보면 아무 문제도 없지만, 유통사에 등록할 때 오류 때문에 등록이 안된다고 할 수 있어요.

오류를 없애는 방법은 2가지. 

 

1. 팝업 주석을 없애고 링크로 연결하거나 미주 처리 한다.

2. EPUB3로 바꾼다.

 

1번은 고려 대상이 아니기 때문에 EPUB3로 바꿔야 합니다. EPUB2를 EPUB3로 바꾸는 방법은 생각보다 간단해요.

 

 

 

1단계. 파일의 패키지 버전을 3.0으로 바꾼다

 

 

OPF 파일의 package version="2.0" 을 version="3.0"으로 수정합니다.

하지만 Sigil에서 수정을 하면 지원하지 않는 버전이라면서 2.0으로 바뀝니다. 

그래서 압축파일을 풀고(EPUB이 zip 압축 파일이라는건 설명 안하겠습니다.) 메모장이나 텍스트 에디터로 version="3.0"으로 수정을 합니다.

 

수정을 하면 다시 압축을 하고 확장자를 epub으로 수정합니다.

 

 

 

Sigil의 '기본설정'에서 파일 버전을 3.0으로 수정합니다.(안해도 될 것 같은데 확인해 보지는 않았어요)

그리고 파일을 Sigil에서 불러옵니다. 그럼 Sigil 상단 제목창에 EPUB3.0으로 표시됩니다.

 

여기까지 했다면 50%는 성공한거예요.

 

 

 

 

2단계. 목차를 생성한다.

 

EPUB2를 EPUB3 로 변환했기 때문에 NCX파일의 목차는 그대로 있습니다. 하지만 '차례' 창에 목차가 나타나지 않습니다. EPUB3 파일은 목차정보를 XHTML로 만들기 때문에 NCX파일이 필요 없습니다. NCX파일이 있으면 EPUB2 뷰어와 호환성을 유지할 수 있으니 EPUB2용 NCX 목차는 그대로 두고, EPUB3를 위한 nav.xhtml 파일로 목차를 새로 생성합니다. 

 

패키지 버전을 EPUB3로 변경하고 Sigil에서 불러오면 nav.xhtml이 하나 만들어집니다. 이게 EPUB3의 목차 파일입니다.

 

 

여기에 목차를 넣게 되는데, 목차를 만드는 방법은 EPUB2와 동일합니다.

메뉴의 [도구 > 차례 > Generate Table of Contents]로 생성합니다.

 

 

 

 

 

 

제목이 생성되면 오른쪽에 있는 '차례' 창에 목차가 표시됩니다.

 

 

 

 

3단계. 메타데이터를 수정합니다.

 

2단계까지 하고 EPUBCheck를 실행하면 오류가 몇개 나옵니다. 

그런데 오류를 보면 전부 OPF파일에서 발생한거예요.

아랫쪽에 toc.ncx 파일 오류가 있지만 이건 샘플파일 만들면서 NCX 파일을 정리하지 않아 그런거고, 정상적인 EPUB2파일이라면 2단계까지 했을 때 epub:type, aside, ruby 등의 오류는 사라지고 opf파일 오류만 남습니다. 

 

 

그리고 하늘색으로 폰트에 관한 INFO가 뜨는데 이건 오류가 아니라 신경쓰지 않아도 됩니다. (이렇게 쓰면 '몰라서 그러는거 아냐?' 라는 의심의 눈초리를 보내는 분이 계신데 ㅎㅎ, EPUB Publications 3.0.1에 있는 EPUB Core Media Types에 폰트는 OpenType, Woff를 지원하고 TTF는 없습니다. 그래서 TTF 폰트를 non-standard font type으로 인식하는 것 같아요^^)

 

 

opf파일 오류는 모두 메타데이터 때문입니다. EPUB2에서 EPUB3로 넘어가면서 메타데이터 정의가 많이 변경됐습니다. 그래서 EPUB2의 OPF파일에 있는 메타정보의 속성과 값을 변경해 줘야합니다.

 

EPUB3에서 필수로 요구하는 메타정보는 아래와 같습니다.

 

1. unique-identifier : <dc:identifier id=”pub-id”>urn:uuid:A1B0D67E-2E81-4DF5-9E67-A64CBE366809</dc:identifier>

2. 책 제목 : <dc:title>책 제목</dc:title>

3. 언어 : <dc:language>ko</dc:language>

4. 수정일 : <meta property=”dcterms:modified”>2011-01-01T12:00:00Z</meta>

 

여기에 추가로 '성실한' 편집자라면 ISBN, 출판사명(Publisher), 저자명 등의 추가 정보를 입력하면 됩니다.

 

Sigil의 메타데이터 편집기를 열고, 입력되어 있는 정보를 수정하면 되는데, 반드시 수정해야 하는 정보가 있고 EPUB2에 있는 정보를 그대로 사용할 수 있는 데이터도 있습니다.

 

메타 정보는 책마다 다르기 때문에 하나씩 설명하기는 어렵고 예로 보여드릴게요.

 

EPUB3 메타정보   EPUB2 메타정보


<dc:title>거울 나라의 앨리스</dc:title>


<dc:language>ko</dc:language>


<dc:identifier>urn:isbn:979-11-000000</dc:identifier>


<dc:publisher>심야책방</dc:publisher>


<dc:creator id="cre">루이스 캐럴</dc:creator>


<meta scheme="marc:relators" refines="#cre" property="role">aut</meta>


<dc:identifier id="BookId">urn:uuid:e0d7dc1c-afa9-49ba-9d25-1fce2f4857b1</dc:identifier>


<meta property="dcterms:modified">2017-06-02T14:30:40Z</meta>
<dc:title>거울 나라의 앨리스</dc:title> 


<dc:language>ko</dc:language>


<dc:identifier opf:scheme="ISBN">979-11-00000000</dc:identifier>


<dc:publisher>심야책방</dc:publisher>


<dc:creator opf:role="aut">루이스 캐럴</dc:creator>


<dc:identifier opf:scheme="UUID" id="BookId">urn:uuid:e0d7dc1c-afa9-49ba-9d25-1fce2f4857b1</dc:identifier>


<dc:date opf:event="modification">2017-06-02</dc:date>

 

 

빨간 색으로 표시된 부분이 수정되야 하는 메타데이터입니다. EPUB3에서는 opf:scheme, opf:role 등의 형식을 사용하지 않기 때문에 이 부분을 EPUB3에 맞게 수정을 합니다. 수정 방법은 간단합니다. 메타데이터 편집기에서 오류가 있는 정보를 삭제하고 다시 입력하면 되요.

 

이렇게 수정을 하고 EPUBCheck로 적합성 검증을 하면 오류가 사라집니다.

 

 

참고로, nav.xhtml은 전자책 뷰어에서 보이지 않습니다. 뷰어의 [목차] 메뉴에서 보는 정보여서 스타일로 편집을 하지 않아도 되지만, 그래도 스타일을 넣고싶다면 아래 두 태그의 스타일을 적용하면 됩니다.

 

/*목차*/ ol { margin-bottom : 1em; } li { font-size : 1em; margin-left : 1em; margin-bottom : 1em; list-style-type: none; }

 

제가 임의로 잡은거라, ol, li 태그의 스타일을 원하는 형태로 수정해 주면 됩니다.

 

그리고 이 목차 파일을 뷰어에서 볼 수 있게 하려면 opf 파일을 수정해 주세요.

<itemref idref="nav.xhtml" /> /*목차가 뷰어에 표시되고 [목차] 메뉴로 볼 수 있음*/

<itemref idref="nav.xhtml" linear="no"/> /*목차가 뷰어에 표시되지 않고 [목차] 메뉴로 볼 수 있음*/

 

 

여기까지 하고 저장을 하면 EPUB2 파일이 EPUB3 파일이 됩니다.

동영상, MP3 이런거 없어도 package version="3.0", nav.xhtml, 그리고 일부 메타정보가 수정되면 EPUB2와 똑같아 보여도 EPUB3 파일이에요.

 

오늘은 여기까지...

 

 

 

 

반응형