내맘대로의 EPUB 제작 가이드

왕초보를 위한 클릭으로 EPUB 만들기 기본 설정 영상입니다.

클릭 한 번으로 기본 설정을 끝낼 수 있어요.

https://www.youtube.com/channel/UC1CLrnVNeqrR2pKdBDn7QgQ

내맘대로의 EPUBGUIDE 유튜브 채널입니다.

'왕초보를 위한 클릭으로 EPUB 만들기' 강좌를 시작으로

'Sigil 완벽 가이드'까지 동영상 강좌를 등록하려고 합니다.

책을 위한 가이드 북을 만들어 달라는 제안이 와서 작업을 했습니다.

디자인이 독특해서 소개해드려요.

제목 스타일은 이렇게 생겼어요.

이걸 어떻게 표현할까 고민하다, 아이디어가 떠올라 만들어 봤습니다.

처음엔 간단할 줄 알았는데, 생각보다 시간이 많이 걸렸어요. 

스타일 잡는데만 거의 30분 정도? 

물론, 방향을 잡기까지가 그 정도라는 것이지요.

글자 세로쓰기는 글상자 폭을 좁힐까 하다 세로쓰기 스타일을 적용했지요.

방향을 확정하고 스타일을 잡으니 이렇게 보입니다.

글자를 키워도 이렇게 깨지지 않고 잘 보여요.

그 다음 스타일은 책을 만들다 보면 종종 접하는 디자인이에요.

이건 간단히 테이블로 작업했습니다.

테이블은 생각할게 많지 않지만, 태그가 복잡해 편집하는 시간이 오래 걸리지요.

그래도 이런 디자인을 작업 할 때 가장 깔끔합니다.

테이블을 쓰지 않는다면 flex를 쓰면 됩니다.

grid는 몇몇 뷰어에서 깨질 때가 있어요. 가장 좋은 방식이지만, 현실적으로 문제가 있으니 뷰어 테스트를 제대로 해야되요.

이 스타일은 EPUB에서 이렇게 보입니다.

글자 크기를 키우면 이렇게...

어떤 편집자는 주소 끝에 줄바꿈 되어 있는 '마'자를 올려달라고 하는데,

이건 전자책이지 종이책이 아니에요.

'마'자를 올리고 싶다면 글자 크기를 줄이거나, 뷰어의 폭을 넓히면 됩니다.

초보 편집자는 단순하지 않은 것을 단순하게 생각할 때가 있습니다.

예를 들면 이런 스타일이요.

제목 위/아래로 이렇게 패턴처럼 보이는 선이 들어가 있습니다.

이 선은 어떻게 넣을까요?

가로로 긴 이미지를 width : 100%;로 넣으면 되지 않아?

이렇게 생각하는 분들이 많을거예요.

가로 폭에 맞춰 넣어도 문제는 없습니다.

그런데 가로 폭에 맞추면, 태블릿에서 가로보기를 하는 독자는 어떻게 보일까요?

잘못된 것은 없지만, 뭔가 아쉽지 않으세요?

그럼 아래 스타일은 어떤가요?

가로보기를 해도 일정 크기를 유지합니다.

스마트폰 처럼 화면 폭이 좁을 때는 화면 폭에 맞춰 100%을 유지하지만,

화면이 일정 크기 이상 늘어나면 더 이상 늘어나지 않도록 스타일을 잡았습니다.

이렇게 하면 PC/태블릿/스마트폰 어떤 기기로 봐도 더 깔끔해 보이지요.

이미지나 다른 패턴을 넣을 때도 무조건 100%로 하거나 고정 크기로 넣기 보다는

작은 화면과 큰 화면 모두 '잘 보이도록' 고민을 해야합니다.

전자책은 페이지가 없기 때문에

제작 단가 처럼 페이지 기준으로 계산을 해야 할 때 어려움을 겪을 수 있습니다.

종이책이 있다면 종이책 페이지를 기준으로 하면 됩니다.

하지만 이 경우에도 공공기관 책자 처럼 A4 판형에 글자 크기가 9pt보다 작게 나온 책은

신국판에 11pt로 나온 책과 같은 기준으로 페이지를 정하기 어렵습니다.

그리고, 페이지를 기준으로 제작 단가를 산정하면 일부 양심 없는 사람들이 이상한 장난을 치지요.

HWP에서 A4 사이즈에 상하좌우 여백 10mm, 글자 크기 7pt, 줄간격 120%...

이렇게 해 놓고 '100쪽이다' 주장을 합니다. 제가 실제로 경험한 사례예요.

이걸 시중에 가장 많이 판매되는 신국판(또는 변형) 기준으로 잡으면 400쪽이 넘어갑니다.

그래서 저는 '일반적인' 판형과 글자크기가 아니면 아래 기준으로 페이지를 정합니다.

========
편집 기준
========
한글워드(HWP)
용지 : 신국판(148 * 225)
여백 : 상하 25mm / 좌우 20mm
글꼴 : 함초롬바탕
글자 크기 : 11pt
줄간격 : 200%

이렇게 해야 양심 없는 사람들의 장난질을 막을 수 있어요.

그런데 이 기준으로 해도,

모든 의뢰자에게 HWP에 넣어 페이지를 계산해 달라고 할 수는 없습니다.

로판무 같은 연재 원고는 텍스트 파일로 작업하는 경우도 있고요.

그래서 글자 수 기준으로 페이지를 대신 할 때가 있습니다.

이럴 때는 어떻게 할까 고민을 하다,

제가 편집하는 책 몇권의 글자 수를 직접 세 봤습니다.

그림/표/도표가 없는 소설을, 장 구분 없이 텍스트만 꽉 채워서 계산해 보니

대략 아래처럼 나오네요.

========
글자 수 기준 : 공백 제외(실제 글자 수)
========
400쪽 : 200,000자
300쪽 : 140,000자
200쪽 : 90,000자
100쪽 : 50,000자

========
글자 수 기준 : 공백 포함(실제 글자 수)
========
400쪽 : 250,000자
300쪽 : 180,000자
200쪽 : 120,000자
100쪽 : 60,000자

평균치이고, 10,000단위에서 올리거나 내렸습니다.

반올림도 애매하고, 버림이나 올림도 애매해 임의로 판단해 잘랐어요.

그래도 대략 반올림이다 생각하면 됩니다.

이렇게 계산해 놓고 보니,

대략 100쪽이 공백 제외 기준 5만자, 공백 포함 6만자입니다.

200, 300, 400쪽 배수로 해도 이 기준으로 하면 어느정도 맞아 떨어집니다.

책의 분량을 계산해야 하는데 기준이 모호해 합의가 어려울 때

글자 수를 기준으로 하면 깔끔하게 정리할 수 있지 않을까요?

물론, 이 기준은 글자 수만 계산했기 때문에

표/도표/이미지 같은 부속 요소가 포함된 책에도 같은 기준을 적용할 수는 없습니다.

이미지가 많이 들어간 책이라면 5만자라도 200쪽이 넘어갈 수 있지요.

100쪽 분량에 1장인 책과 10쪽 분량이 1장인 책 역시 같은 5만자여도 10쪽 이상 차이가 날 수 있습니다.

이미지가 많이 들어간 2.5만자 100쪽 책과

이미지가 없는 5만자 100쪽 책을 글자 수로 계산해 제작 난이도를 따질 수도 없습니다.

그래서 글자수로만 책의 분량을 정하고, 분량에 따라 제작 난이도를 판단해서는 안됩니다.

전자책 제작 시간은

글자 수, 부속 요소(이미지/도표/표 등), 본문과 다른 편집 요소(첨자, 주석, 박스글 등),

별면, 부/장/절 구분 등 다양한 편집 항목이 서로 영향을 주기 때문이지요.

책을 만들다 보면 만들기 까라로워 보이는 글상자가 종종 나옵니다.

한쪽 모서리에 불릿 이미지가 들어가거나, 테두리 선이 특이한 경우도 있습니다.

이럴 때 border-image를 사용하면 복잡한 테두리도 쉽게 만들 수 있습니다.

아래처럼 테두리 선이 겹쳐 있고 아래쪽에 돋보기 불릿이 들어있는 스타일 역시 border-image로 만들 수 있습니다.

전자책에서는 이렇게 보이지요.

이런 테두리는 border-image로도 만들 수 있고, border와  border-radius를 이용해 만들 수도 있습니다.

둘 중 어떤게 더 좋은가라고 질문을 하는 분들이 있는데, 그때 그때 다릅니다.

전자책에서는 이렇게 보입니다.

이렇게 한쪽 면만 다른 선으로 되어 있는 테두리도 있습니다. 이것 역시 border-image를 사용해 만들었습니다.

전자책에서는 일렇게 보이지요.

테두리 상자 디자인이 복잡하다고 border를 이용해 단순하게 만들거나 이미지로 잘라 넣는 것 보다는 테두리 안에 들어 있는 내용이 독자들에게 필요한지 생각해야 합니다. 그리고 디자이너가 왜 이런 디자인을 선택했는지도 고민해 봐야지요.

책을 만든 경험이 풍부한 전문 편집 디자이너라면 쓸데 없이 예뻐보이려고 디자인을 하지는 않습니다. 위에 두 상자만 봐도, 하나는 독자가 의견을 생각해야 할 때와, 질문에 부가 정보를 제공하는 상자가 다른 모양입니다. 상자 디자인만 봐도 둘의 차이를 쉽게 파악할 수 있지요. 그러니 살릴 수 있는 디자인은 최대한 살려서 전자책을 편집해야 합니다.