2015/01/28

30분 만에 전자책 만들기 6 : 판권 만들기

안녕하세요.

오늘은 지난번 포스팅에서 예고한 대로, 판권지 제작을 하겠습니다.

판권지는 도서에 대한 권리가 명시되는 부분인 만큼 매우 중요한데요,

전자책에서는 판권지 부분에 회사 홈페이지나 작가 블로그 등을 연결시켜 독자가 직접 작가와 소통할 수 있도록 도울 수가 있습니다. 제가 알려드릴 방법도 판권지에 하이퍼링크를 삽입하여 독자와의 소통(!)을 할 수 있도록 돕는 것입니다.

 

보통 판권지는 본문의 내용보다 글씨 크기가 작으니까 CSS를 수정하면서 오늘의 포스팅을 시작하겠습니다.

 

1. 판권용 CSS 만들기

지난 포스팅에서 완성한 novel.epub 파일을 열어봅시다.

그리고 주저없이 Style 폴더의 novel.css 파일을 더블클릭하여 편집할 준비를 합니다.

 

제일 마지막에 아래의 문구를 넣어줍니다.

/*판권*/

.copy { font-family: "kd"; text-align: justify; font-size: 0.9em; margin: 0; padding: 0; line-height: 1.6em; text-indent: 0; }

보통 판권지의 글자는 본문의 글자보다 작기 때문에 0.9em으로 설정했습니다.

0.8em 미만으로 글씨 크기를 설정할 경우, 뷰어에 따라 정상적으로 보이지 않을 수 있으니 가급적이면 0.8em 미만의 크기는 사용하지 않는 것이 좋습니다.

 

글씨체는 코펍 돋움으로 설정했습니다.

궁서체 같은 진지한 느낌으로...ㄷㄷ

 

첫줄 들여쓰기는 제외했습니다.

판권지의 문장은 들여쓰기 없이 표현될 겁니다.

제가 하는 방법을 쫓아 하셨으면 위의 그림과 같이 CSS가 편집되었을 겁니다.

혹시 더 자유롭게 편집하고 싶으시다면 각 항목을 구미에 맞게 조절하여 설정하시면 됩니다.

하지만 제 강의는 기본 중의 기본이니까, 이 정도에서 다음으로 넘어가겠습니다.

 

2. 판권 내용 입력하기

우선 판권지가 들어갈 위치를 정합니다.

저는 보통 표지 이미지 다음에 판권을 위치시킵니다.

제일 마지막에 넣는 방법도 있는데, 그건 어디까지나 제작자의 취향 문제라고 생각합니다.

(혹 서구식이니 일본식이니 하는 말도 있는데, 그런 건 잘 모르겠습니다.)

 

판권지를 넣을 부분 앞의 챕터에서 Ctrl+Enter를 눌러 새로운 페이지를 작성하시고,

페이지 이름을 copyright로 바꿉니다.

파일 이름이야 마음대로 하시면 되지만 저는 나중에 알아보기 쉽도록 이름을 고쳤습니다.

판권에 들어갈 내용은 여러 가지입니다.

각 출판사별로 정형화된 판권 포맷이 있구요, 저 같은 경우는 기본적인 내용만 적어넣는 편입니다.

 

도서명

출간일

작가명

편집자

표지디자인

홈페이지

ISBN

 

대충 이 정도 되겠군요...ㄷㄷ

그러면 이제 이 내용을 써 넣읍시다.

 

저는 필요한 내용으로 판권지를 입력했습니다.

  <h1 class="copytitle">30분 만에 전자책 만들기</h1>

 

  <p class="copy">초판발행 : 2015년 1월 28일</p>

 

  <p class="copy">&nbsp;</p>

 

  <p class="copy">지은이 : 윤군</p>

 

  <p class="copy">&nbsp;</p>

 

  <p class="copy">펴낸곳 : 윤군의 망상창고</p>

 

  <p class="copy">편집 : 윤군</p>

 

  <p class="copy">표지 디자인 : 윤군</p>

 

  <p class="copy">&nbsp;</p>

 

  <p class="copy">e-mail : hover1005@nate.com</p>

 

  <p class="copy">홈페이지 : http://ygbox.tistory.com</p>

 

  <p class="copy">&nbsp;</p>

 

  <p class="copy">ⓒ 윤군, 2015.</p>

 

필요에 의해 copytitle CSS를 하나 더 만들었습니다.

해당 CSS 내용은 아래와 같습니다.

 

.copytitle {font-family: "kd"; text-align: justify; font-size: 1.1em; margin: 0; padding: 0; line-height: 1.6em; text-indent: 0;}

 

북뷰로 보면 아래와 같습니다.

좀 투박하기는 하지만... 나쁘지는 않습니다.

판권지는 투박하면서 진실된 맛이 있어야죠.(어디가!)

 

소스뷰로 바꿔서 목차에 나타날 판권지 제목을 바꿔보겠습니다.

지금 대로 한다면... h1 태그로 씌워진 [30분 만에 전자책 만들기]가 목차에 나타날 텐데요...

독자는 내용을 보고 싶은데 판권지가 나타나는 불상사를 막기 위해서는 제목을 바꿔줄 필요가 있습니다.

 

소스뷰에서 <h1 class="copytitle">을 아래와 같이 수정합니다.

 

<h1 class="copytitle" title="판권">

 

그리고 Ctrl+T를 눌러 목차 편집기를 불러오면, '판권'이라는 목차가 생성되었습니다.

OK 버튼을 눌러 판권이 들어간 목차를 생성합니다.

이렇게 판권지를 제작했습니다.

 

판권지 제작도 참 쉽죠?

하지만 아직 끝난 것이 아닙니다.

우리는 판권지에 블로그로 직접 이동할 수 있고, 메일을 보낼 수 있도록 하이퍼링크를 달아줄 겁니다.

그래야 독자와의 쌍방향 의사소통이 가능하지 않겠어요?

 

3. 하이퍼 링크 설정하기

하이퍼 링크를 설정함으로써 우리의 전자책은 더욱 유용해질 겁니다.

그러면 하이퍼링크는 어떻게 설정할까요.

Sigil의 도구버튼 중에 쇠사슬처럼 생긴 친구가 있습니다.

하이퍼 링크를 설정할 부분을 선택한 뒤에 이 친구를 눌러주면 됩니다.

 

이 링크 삽입 버튼을 통해 2가지 링크를 설정할 텐데,

잘 쫓아오시기 바랍니다.

 

외부 링크(홈페이지) 연결하기

링크 삽입 버튼을 누르면 아래와 같이 목표 선택 도우미가 열립니다.

목표 선택 도우미에서는 어떤 곳으로 링크를 걸지 설정하는데,

우리는 외부 홈페이지를 링크할 것이므로, 해당 홈페이지의 주소를 넣으면 됩니다.

저는 제 블로그로 하이퍼 링크를 걸겠습니다.

OK를 누르면 링크가 삽입됩니다.

 

하이퍼링크가 정상적으로 연결되었으면, 홈페이지 옆의 https://www.ygbox.tistory.com이 파란색으로 바뀌었을 겁니다.

우리는 하이퍼 링크에 별다른 설정을 하지 않았기 때문에 기본값으로 표현되는 것이죠.

이 하이퍼 링크를 클릭하면 외부 링크를 작동시키겠냐는 물음이 뜨는데, OK를 누르면 PC에 설정된 기본 인터넷 브라우저가 작동되면서 제 블로그로 연결됩니다.

여기서 블로그 주소를 자신이 사용하고 싶은 주소로 바꿔주면 해당 페이지로 이동하겠지요.

 

이메일 발송 설정하기

 

기본적인 방법은 위의 하이퍼 링크 설정과 동일합니다.

다만 목표 선택을 할 때 다르게 입력하면 됩니다.

메일 주소를 선택하고 목표 설정 창을 띄우고 메일 주소를 입력하면 되는데,

메일 주소 앞에는 꼭 mailto:를 붙여주시기 바랍니다.

 

mailto: 를 붙이는 이유는 자동으로 메일 작성 창이 뜨게 하기 위함입니다.

아웃룩 같은 이메일 관리 프로그램을 사용하시면 자동으로 보내기 창이 뜹니다.

역시 확인은 파랗게 변한 부분을 클릭하면 됩니다.

 

이상으로 하이퍼 링크를 삽입한 판권 페이지를 만들었습니다.

나름 쉽게 설명하려고 노력했습니다... 그런데도 어려우면.. 어쩌지...ㅠㅠ

 

다음에는 오늘 사용한 하이퍼 링크 기능을 이용한 주석 달기 방법을 배우도록 하겠습니다.

물론 현재 EPUB2.0에서 주석은 상당히 불편한 기능이긴 하지만, 없는 것보다는 훨씬 편리하니까요.

 

그러면 오늘도 행복한 하루 보내시기 바랍니다.

 

오늘의 예제 EPUB입니다.

↓ novel.epub [다운로드]




#CSS #강의 #전자책 #하이퍼링크 #epub #전자책제작 #sigil 

사진 관련 소식