국립중앙도서관 디지털 정보활용능력 교육 이펍(ePub) 제작 입문 2015. 6. 강사 : 최 현 이북스펍 대표 (http://ebookspub.co.kr) - 1 -
- 강의 내용 - 1. epub 이란 무엇인가 1.1. 전자책 출판 프로세스 이해 1.2. 전자책의 다양한 형태와 제작방식 1.2. epub 개념 이해 및 제작툴 종류 2. epub 제작툴 소개 2.1. 전자책용 한글 편집 디자인 2.2. 시길 인터페이스 및 기본 기능 3. epub 제작 실습 3.1. epub 제작에 필요한 필수 html 코드 3.2. 기본 스타일 및 레이아웃 연습 4. epub 완성 및 테스트 4.1. epub 오류 체크 및 적합성 검사 4.2. 뷰어를 통한 전자책 테스트 필요한 프로그램 - 한글 - SIGIL - 2 -
최 현 [주요 활동] 이북스펍 대표 http://ebookspub.co.kr/ 네이버 이북커 카페 운영자 http://cafe.naver.com/ebookpublisher 이북커 웹사이트 http://contentsa.cafe24.com/wp/ epub 전문 강사 [주요 저서] 시간은 달린다 꽃가루 Windows XP 81가지 명령어 Windows XP 포맷하고 관리하기 Pages로 전자책 만들기 Sigil로 전자책 만들기 Sigil 완벽 입문 전자책 제작 노트 전자책 창업 노트 - 3 -
들어가는 이야기 지난 5년간 이북커 카페를 운영하고, 전자책 관련 강의를 하며 많은 분들의 이야기를 듣게 되었습니다. 이 자료는 전자책을 전혀 모르는 분들도 어떻게 하면 가장 쉬우면서도 좋은 방법으로 epub을 만들 수 있을까? 를 고민하며 만들었습니다. 전문적으로 전자책을 만드는 분들 중에서도 epub 전자책 제작에 어려움을 겪고 있는 분들 이 많습니다. epub을 만드는 것은 그렇게 어렵지 않지만 멋진 epub을 만드는 것은 쉬운 일 만은 아닙니다. 저는 Pages로 전자책 만들기, Sigil로 전자책 만들기, Sigil 완벽 입문, 전자책 제작 노트 등 의 전자책을 내면서 전자책 을 만드는 방법을 여러 가지 관점으로 도전해보았습니다. 그래서 이 자료는 전자책에 관심이 있는 일반인 분들이 epub이라는 전자책에 입문하는 과 정에서 필요한 정보를 담았습니다. 일반인 분들이 쉽게 접근할 수 있도록 되도록 코드는 적게 배치하였습니다. 또한 한글 이라는 프로그램을 활용해서 epub을 만드는 방법에 대하여 기술하였습니다. 이 자료는 이런 분들에게 추천합니다. l epub을 알고 싶다. l 혼자서 epub을 만들고 싶다. l 전자책을 유통해서 많은 분들에게 자신의 노하우와 정보를 제공하고 싶다. 이 자료를 읽었지만 전자책 제작에 어려움을 겪는 분들께서는 이북커 웹사이트를 통해서 출장 강의도 진행해드립니다. 1:1 또는 2:1 강의 또한 보다 고도화 된 전자책을 제작하고 싶 은 분들께도 강의를 진행해드립니다. - 4 -
1. epub 이란 무엇인가 epub(electronic publication)은 국제 디지털 출판 포럼(International Digital Publishing Forum)에서 제정한 개방형 자유 전자서적 표준입니다. epub은 모든 단말기에서 책이라는 형태의 미디어를 충족하고자 자동공간조정(reflowable)이 가 능하도록 디자인 되어있습니다. 즉 3인치, 5인치, 10인치 등 다양한 단말기의 화면에서 콘텐츠를 소비하기 쉽도록 설계되어있는 미디어입니다. 2007년 IDPF에 의해 공식 표준으로 채택되었습니다. 특징 및 장점 l 자유롭게 개발이 가능한 표준 미디어 l 자동공간조정으로 글자크기가 단말기에 맞게 변환. l 래스터(비트맵) 또는 벡터 이미지를 담을 수 있음. l 메타데이터 등록 가능. l DRM(Digital rights management) 지원으로 문서의 불법 복제 최소화. l CSS(Cascading Style Sheets) 지원으로 문서 내 디자인 영역을 보강. l 기능 확장을 위한 XML 기능 지원 epub이라는 미디어는 아직은 일반인 분들에게 많이 생소한 분야입니다. 또한 국제적인 표준으 로 채택이 되었지만 국내에서는 기술적으로도 문화적으로도 아직은 부족한 부분이 많습니다. 그러나 국제 표준으로 자리잡고 있는 epub은 앞으로 도서 출판 시장을 대체할 수 있는 좋은 미디어이자 사업입니다. 국제 표준으로 자리잡고 있어서 매우 큰 장점은 지금 이 시간에도 epub은 아마존, 애플, 구글 을 통해서 외국의 독자들에게 전달되고 있습니다. 특히 선진국에서 살고 있는 독자분들은 자신에 게 필요한 콘텐츠를 유료 구매하는 것에 투자를 아끼지 않습니다. 이는 국내에 최근 트렌드인 창조경제와도 잘 어울리며, 지식 산업으로서 큰 가치를 가지고 있습 니다. - 5 -
1.1. 전자책 출판 프로세스 이해 원고 : 저작권 침해 요소가 없는 콘텐츠를 제작. 저작권이란? 지식재산권 또는 지적재산권의 한 종류입니다. 지식재산권이란 사람의 창작물에 관 한 권리와 표지에 관한 권리를 총칭하는 말로, 크게 산업재산권과 저작권으로 됩니다. 저작권의 의의로는 저작물에 대하여 이를 창작한 사람 등이 갖는 권리를 총징합니다. 협의로는 저작자의 저작재산권과 저작인격권을 의미하며, 넓은 의미로는 저작인접권을 포함합니다. 편집 : 교정 및 교열을 마친 콘텐츠를 편집 디자인으로 완성. 편집이란? 언론 출판 음악 영화 등에서 문자, 이미지, 소리 등을 수집 및 분류하여 내용을 정리 하는 작업을 의미합니다. 편집에서 내용이란 교정 및 교열의 작업입니다. 교정 : 맞춤법 띄어쓰기 등 기초적인 문법 수준에서 인명, 지명, 연도, 사건, 사고의 사실 확인 을 포함합니다. 교열 : 작가의 의도를 살려 오독할 여지가 있는 글을 다듬는 일을 말합니다. 전자책 : 전자책으로 Coding을 하여 최종적으로 전자책 완성. epub 전자책은 IDPF에서 OPS(Open Publication Structure), OPF(Open Packaging Format), OCF(OEBPS Container Format) 세가지로 정의하였습니다. epub 내용을 구성하기 위해 OPS는 xhtml, Css 등을 이용하여 내부의 콘텐츠를 구성하도록 정의하였습니다. - 6 -
데이터 베이스 : 인터넷 서점에게 전자책을 전송하면 데이터 베이스에 저장됩니다. 서점 데이터 베이스에 저장된 전자책은 전자책을 읽고 싶은 독자들에게 전송될 수 있게됩니다. 사용자 : 인터넷 서점을 통해서 전자책을 구입할 수 있습니다. 사용자들은 본인의 취향, 경제적 인 구매력 등에 따라 다양한 환경의 디바이스를 가지고 있습니다. 무료 전자책을 구입할 수 있으며, 유료 전자책을 구입할 수 있습니다. 멀티 디바이스 : 종이책에서 전자책으로 오면서 독자는 다양한 디바이스를 가지게 되었습니다. 여러개의 디바이스를 가지고 있는 사용자도 있고, 한 개의 디바이스를 가지고 있는 사용자도 있 습니다. 또한 인터넷 서점에 따라 epub 전자책을 표현하는 브라우저의 종류도 여러 가지가 있습 니다. 이후에 설명을 하겠지만 OPS를 통해 정의된 기술적인 Wep 언어를 표현하기 위한 브라우저 적 합성도 중요한 이슈가 되었으며, IDPF가 정의한 epub 적합성도 중요한 이슈가 됩니다. 한눈으로 보는 전자책 프로세스 - 7 -
1.2. 전자책의 다양한 형태와 제작 방식 PDF 어도비 시스템즈에서 개발한 전자 문서 형식으로 문자, 도형, 그림, 글꼴을 포함할 수 있습니다. pdf 는 컴퓨터 환경에 관계없이 같은 표현을 위한 목적으로 개발되었습니다. pdf를 제작하는 툴 은 여러 가지가 있으며, 출판물로 제작은 어도비 인디자인을 가장 많이 사용하고 있습니다. pdf를 보거나 편집하는 툴로는 어도비 아크로벳 리더 및 프로가 있습니다. 제작방식 : pdf는 만들 수 있는 기술을 현재 많이 보급되어 있으며, 고도화 되었습니다. 이제는 마이크로 소프트의 MS Word, 한글 등을 활용해서도 만들 수 있으며, 전문적인 출판물은 어도비 시스템지의 인디자인(Indesign)을 많이 사용합니다. FLASH 어도비 시스템즈에서 개발한 상호 작용, 벡터 방식의 기술입니다. FLA와 SWF라는 확장자를 가 장 많이 사용하고 있습니다. 플래쉬는 한때 웹에서 가장 많이 사용했던 콘텐츠 미디어입니다. 제작방식 : 어도비 플래쉬(Adobe Flash)라는 제작툴을 이용하여 제작할 수 있습니다. 물론 pdf 처럼 플래쉬 역시 제작할 수 있는 기술이 많이 보급되어 플래쉬 제작툴외에도 다양한 툴이 존재 합니다. - 8 -
APP (application software) 은 넓은 의미로는 운영체제에서 실행되는 모든 소프트웨어를 뜻합니다. 그러나 스마트 폰의 발 달로 현재 앱(APP)이라는 단어는 좁은 의미로 스마트 단말기에서 사용되는 게임, 전자책 등을 표현합니다. 제작방식 : APP을 정의하는 것에는 모바일 운영체제인 Ios 와 Android os 차이를 이해해야합 니다. 앱 콘텐츠 특성상 전자출판물 외에도 게임, 응용프로그램 등으로도 제작이 되고 있습니다. 일반적으로는 플랫폼에서 제공하는 SDK(software development kit)를 이용하고 있습니다. 전자출판물로서 APP은 크게 3가지 방식으로 제작됩니다. l 네이티브 방식 : Ios의 경우는 Object-C라는 언어를 많이 사용합니다. l 하이브리드 방식 : Web Site를 구축하거나 Web 언어를 이용하여 구축한 뒤에 앱으로 패키 징하는 방식입니다. 많은 웹 개발자들이 선호하는 방식으로 웹 개발자들이 별도의 언어를 배우 지 않고도 앱을 개발하는 목적으로 활용하고 있습니다. l 응용프로그램 방식 : 어도비 시스템즈에서 제공하는 DPS(Digital Publishing Suite)라는 도 구를 이용하기도 하며, 다양한 개발사 또는 민간 개발자가 제공하는 도구를 이용하는 방식입니 다. epub (electronic publication) 국제 디지털 출판 포럼에서 제정한 개방형 자유 전자서적 표준으로 전세계적으로 많이 사용하는 미디어 포맷입니다. 제작방식 : 개방형 오픈소스인 HTML, CSS, Javascript를 이용하여 제작하는 것을 기본으로 합 니다. HTML은 문서의 전체 레이아웃을 만들며, Css를 이용하여 콘텐츠 및 레이아웃 디자인에 효과를 줍니다. javascript는 콘텐츠에 동적인 효과를 줍니다. 무료인 범용 툴로는 Sigil, 이북스타일리스트, 뷰포터 라는 툴이 있으며, 유료로는 나모 펍 트리 등의 툴이 있습니다. - 9 -
1.3. epub 개념 이해 및 제작툴 종류 Wep : 언어로는 HTML, CSS, JAVASCRIPT 등을 이용하고 있습니다. Wep 언어는 W3C(World Wide Web Consortium)에서 표준을 개발하고 사용을 장려하고 있 습니다. epub은 이 웹 언어를 기술적으로 사용하고 있습니다. 그것을 IDPF에서는 OPS로 정의 하였습니다. Coding : 컴퓨터 프로그래밍을 위한 부호를 입력하는 체계적인 작업입니다. 코딩으로 epub을 제작시 SIGIL이나 어도비 드림위버(Adobe Dreamweaver)를 사용하는 것을 추천합 니다. 툴의 사용도 알아야하지만 보다 중요한 것은 Wep 언어를 알고 있어야 합니다. Packege : IDPF에서는 epub을 OPF와 OCF로 Wep 언어 및 콘텐츠 패키징에 대해 정의 하였습니다. SIGIL이나 여타의 범용 프로그램은 일반적으로 자동으로 패키징을 하지만 드림 위버 처럼 코드 자체로 프로그램을 한다면 별도로 패키징을 할 수 있어야 합니다. - 10 -
적합성(Validator) : IDPF에서는 개방형 자유서적으로 채택하는데 매우 중요한 역할로 3가지로 정의된 약속을 잘 지켰느냐를 판단합니다. 이를 적합성이라고 합니다. epub은 오픈된 언어를 사용하므로 개별 저작자의 자유도가 보장되어 있습니다. 이것은 다양한 콘텐츠로 파생될 것으로 예상됩니다. 또한 사용자들의 다양한 독서 환경도 자유도가 높습니다. 그래서 하나의 규약이 필요합니다. 이것을 epub 2와 epub 3로 구분하여 정의하였습니다. 한눈으로 보는 개념 - 11 -
2. epub 제작툴 소개 InDesign : 어도비에서 만든 DTP(Desktop Publishing) 레 이아웃 소프트웨어로 윈도우와 MAC OS에서 사용이 가능합니 다. DTP로서 기능이 충실하며 거의 모든 카테고리(단행본, 잡 지, 카타로그, 브로수어 명함 등) 별 종이책 과 전자책 디자인 이 가능합니다. 한글 : 한글 워드 프로세서(word processor for Korean characters)는 한글과 컴퓨터라는 회사가 만든 응용프로그램으 로 한국 및 한국어에 최대한 효율적으로 개발된 툴입니다. DTP 프로그램으로 활용을 하고 있으며, 책의 형태보다는 문서 의 형태를 제작하는 것으로 활용을 하고 있습니다. SIGIL : 인장 또는 도장이라는 뜻을 가진 낱말입니다. epub 무료 편집기입니다. 빌 마르코비치(Val Markovi?)에 의해 개 발되었습니다. 윈도우, 맥, 리눅스를 지원하며 WYSIWYG (what you see is what you get) 방식으로 epub 파일 코드에 대한 전반적인 편집이 가능합니다. ebook Stylist : (주)미투북스에서 개발한 epub 제작툴로 SIGIL과 거의 유사한 형태의 epub 제작툴입니다. 스타일 시트 를 GUI(graphical user interface) 형태로 제공하기 때문에 epub을 디자인 하는 것이 편리합니다. 무료로 제공하는 툴로 윈도우 맥을 지원합니다. Adobe Dreamweaver : 어도비 회사가 개발한 Code edit 로 HTML 코드와 CSS 를 작성하는 것이 매우 편리합니다. 현재는 CC(Creative Cloud) 버전으로 월 정액제의 형태로 사 용이 가능합니다. 이전에는 패키징 프로그램을 판매하였으나 어도비 정책상 CS(Creative Suite) 버전 6이후로는 CC 버전으 로만 판매를 하고 있습니다. - 12 -
소프트웨어를 이용한 편집에 들어가기 전에 편집은 언론 문학, 출판, 음악, 영화 등에서 문자, 이미지, 소리 등을 수집, 분류하여 내용을 정 리하는 작업을 의미합니다. 전자책의 편집은 크게 콘텐츠에 대한 교정, 교열, 디자인 등의 출판 편집과 html 등의 기술적 인 언어에 대한 편집으로 나누어집니다. 많은 분들은 도서 출판을 하고자 하는 욕구는 있지만 정확한 개념과 프로세스를 소홀하게 생각 합니다. 도서 출판 과정에서 편집의 역할은 디자인의 대한 부분외에도 교정 과 교열을 포함합니다. 전자출판으로는 도서 출판에서 존재하던 편집 영역이 더욱 확장되었습니다. 그것은 IT기술 에 대한 이해와 노하우 라고 생각합니다. 교정 맞춤법, 띄어쓰기 등 기초적인 문법 수준에서 인명, 지명, 연도, 사건, 사고의 사실 확인하는 것 입니다. 그것은 인쇄물의 정확한 생산을 위하여 오류를 검출하는 방법이며, 서면, 시각, 청각 등의 정보 를 전달하는 방법입니다. 완벽하지는 않지만 교정을 보는 편리한 방법이 몇 가지 있습니다. l 한글이라는 프로그램에서 맞춤법 검사기가 존재합니다. 단축기는 [F8]입니다. l 한국어 맞춤법/문법 검사기 사이트는 한글 맞춤법을 위해 개발된 사이트입니다. http://speller.cs.pusan.ac.kr/ l 우리말 배움터 사이트는 국어 평생교육에서 개발한 맞춤법을 위한 사이트입니다. http://urimal.cs.pusan.ac.kr/urimal_new/learn/dictionary/pronun/main.asp 교열 작가의 의도를 살려 오독할 여지가 있는 글을 다듬는 일을 말한다. 일반적으로는 작가와 작품 그리고 에디터들 사이에서 협업이 필요한 때 발생하며 저자의 생각을 기초로 합니다. 그런 과정에서 창조적인 부분과 인간 관계에 대한 부분으로 발전합니다. - 13 -
적합성 OPS, OPF, OCF에 위배되지 않는 규칙으로 만드는 작업을 말합니다. epub 2는 SIGIL이라는 프로그램을 이용하여 적합성을 쉽게 검사할 수 있으나 epub 3는 그렇 지 못합니다. 뷰포터, 펍트리 등의 도구에서 epub 3 적합성을 도구를 제공합니다. 또는 JDK 를 설치하여 epubcheck 파일을 다운받아 CMD에서 명령어를 입력하여 체크할 수 있습니다. l JDK - http://www.oracle.com/technetwork/java/javase/downloads/index.html l epubcheck - https://code.google.com/p/epubcheck/downloads/detail?name=epubcheck-3.0.1.zip l 명령어 - java -jar epubcheck [epub 파일 등록] - 14 -
2.1. 전자책용 한글 편집 디자인 전자책용 편집 디자인 전자책을 편집 디자인 하려면 우선 모바일 모니터의 이해가 필요로 합니다. 모바일 모니터의 종류는 매우 다양하지만 최근에는 LCD또는 LED 패널이 장착된 터치 스 크린이 대세를 이루고 있습니다. 성능의 분류 ㅇ 영상의 크기 : 보통 인치(inch)라고 부릅니다. 1인치는 2.54cm입니다. 보통의 모바일 단말기는 3~10인치를 가지고 있습니다. 약 7.62cm에서 25.4cm 정도의 크기를 가집니다. 그러나 이 정보는 아주 정확하지 않습니다. 대부분의 제조사에서는 액정과 주변의 패널의 사이즈를 무분별하게 사용하기 때문입니다. ㅇ 화면비 : 가로세로비율 이라고 부르기도 합니다. 4:3비율 16:9 비율이라는 이야기를 들어보셨을 것입니다. 실제 영상의 크기가 3인치라고 해도 정사각으로 단말기를 제작하지 않기 때문에 4:3 비율 등으로 화면비를 구현합니다. 세로는 7.62cm이지만 가로는 5.715cm 로 제작하는 것입니다. 모바일 환경상 손에 잡히기 편한 상태로 디자인 되기 때문입니다. ㅇ 해상도 : 모니터 계열에서 해상도는 매우 중요한 영역을 가집니다. 1인치 안에 표현되 는 화소(Pixel) 또는 점(Dot)를 해상도라고 표현합니다. 이를 PPI 또는 DPI라고 합니다. DPI는 주로 인쇄물을 출력하는 단위로 쓰이며, PPI는 화상 출력을 위한 단위로 쓰입니다. 300DPI라고 한다면 1인치 안에 300개의 점이 있다는 말입니다. 300DPI가 72DIP보다 더욱 선 명하게 보일 것입니다. ㅇ 도트피치 : 해상도에서 명시한 점들의 간격을 말합니다. 수치가 낮을 수록 높은 해상 도의 표현이 가능합니다. 도트피치가 0.2mm의 모니터는 같은 크기의 0.3mm의 모니터보다 더욱 선명한 화질을 가집니다. 확장 영역 스마트폰 및 타블릿 PC처럼 모니터와 컴퓨팅 시스템이 함께 나오고 있습니다. 일체형 데스크탑 의 경우도 그렇고, 스마트 TV라는 제품의 경우도 비슷한 맥락으로 이해할 수 있습니다. 사 용자 편의를 위해 모니터 하나로 다양한 기능을 수행할 수 있도록 출시하고 있습니다. 최근 에는 애플 TV 또는 크롬캐스트 처럼 비교적 저렴하게 스마트 TV를 구축할 수 있는 세톱박 스들이 출시 되고 있습니다.이들의 장점은 휴대용 단말기와 세톱박스의 연결된 대형 모니터 를 거울처럼 비춰줄수 있다는 것입니다. 이것을 미러링 또는 미라캐스트 라고 합니다. 스마 트폰 화면을 세톱박스가 연결된 다른 모니터를 이용하여 볼 수 있습니다. 미래에는 이런 모니터를 활용한 제품이 더욱 강세가 될 것으로 예상됩니다. - 15 -
한글 프로그램 활용 글(아래아 한글)이라고도 불리던 프로그램입니다. 1989년 이찬진, 김형집, 우원식이 공동으로 개발하고 발표한 한글은 하국의 대표적인 워드프로 세서 소프트웨어입니다. 최초의 버전은 1.0으로 시작해 지금은 한글 오피스 시리즈로 나오고 있 습니다. 최근에는 맥용 한글도 개발되어 한글은 윈도우 맥을 모두 지원하고 있습니다. 한글 프로그램 자체에서 epub을 지원하지는 않지만 한글 프로그램을 DTP로 사용하는 것은 매 우 유용합니다. 워드 프로세서로서 다양한 포맷을 지원하기도 하며, 한글 PDF 컨버터 프로그램 설치시 PDF 포 맷을 지원하기 때문에 종이책을 만드는 것도 가능합니다. 또한 PDF 포맷은 다른 작업자와 업무 협조를 하기가 매우 좋아집니다. 스타일을 잘 관리하면 html로 출력시 생성된 코드를 활용하여 epub을 작업할 때 매우 유용합 니다. 전자책으로서 완변한 그리드는 어렵지만 디자인 타이포 그라피도 가능하다는 장점도 있습니다. epub을 제작시 가장 중요한 것은 스타일 설정입니다. 이제 한글에서 스타일을 설정하는 방법을 알아보도록 하겠습니다. - 16 -
한글을 이용하여 간단하게 편집 디자인을 진행하였습니다. 좌측 상자에는 스타일 상자를 불러왔습니다. [보기] - [작업창] - [스타일]이며 단축키는 Alt+U+W+Y 순서입니다. 예제에서 사용한 스타일은 [머리말]과 [본문]이라는 스타일입니다. 머리말은 [Kopub 바탕체 볼드. pt14. 우측 정렬] 스타일을 가지고 있습니다. 본문은 [Kopub 바탕 볼드, pt10, 좌측 정렬, 첫줄 들여쓰기 5pt] 스타일을 가집니다. 스타일 설정을 해보겠습니다. 좌측 스타일 상자에 [머리말] 스타일에 마우스 커서를 두고 오른쪽 마우스 버튼을 클릭합니다. [스타일 추가/편집] 옵션이 활성화 됩니다. 실행해주세요. - 17 -
위와 같은 창이 활성화 됩니다. 좌측 하단 주황색으로 체크되어 있는 버튼을 선택합니다. 위 이미지와 같은 옵션을 이용하여 스타일 이름과 문단 모양, 글자 모양을 선택적으로 바꾸어줄 수 있습니다. - 18 -
글자모양을 꾸며 스타일을 바꿀 수 있습니다. 글자 크기, 글꼴, 굵기, 장평, 자간 등을 무작위로 만져주셔도 됩니다. 각각 머리말 스타일과 본문 스타일을 자유롭게 꾸며줍니다. 만들어준 스타일을 이용하여 한글 워드프로세스 본문에 배치된 텍스트에 적용해줍니다. [파일] - [보내기] - [웹 브라우저로 보내기]를 선택합니다. - 19 -
웹 브라우저를 통해 브라우징 되는 것을 확인 할 수 있습니다. - 20 -
브라우저에서 오른쪽 마우스 버튼을 클릭하여 [페이지 소스 보기] 를 통해서 html 소스를 확인해 보겠습니다. 매우 어렵게 느껴지는 소스들이 마구 마구 나오고 있습니다. 그러나 두 려워하지 않으셔도 됩니다. 우리는 여기서 약간의 소스만 가져올 것입니다. - 21 -
이번에는 [파일] - [인쇄] 로 들어가보도록 하겠습니다. Adobe PDF 옵션이 있으면 PDF로 출력이 가능합니다. 만약 아래 처럼 이미지가 뜬다면 한글 PDF 컨버터를 설치해야 합니다. 한글 PDF 컨버터 6.0이 없어서 변환이 잘 안되다는 오류가 나왔습니다. - 22 -
2.2. 시길 인터페이스 및 기본 기능 소개 ㅇ 시길 설치 시길은 WINDOWS 와 MAC에서 무료로 사용할 수 있는 툴입니다. 무료라는 말은 정말 매력적 입니다. https://github.com/user-none/sigil/releases 사이트 접속 후 버전은 0.8.4 버전을 다운로드 합니다. 설치에 대한 가벼운 안내 [http://cafe.naver.com/ebookpublisher/471] - 23 -
시길 프로그램을 실행 처음 실행시 화면에서 구현되는 것은 메뉴바, 구조, 브라우저, 목차의 화면입니다. 상단 메뉴바와 브라우저는 항상 실행되어 있으며, 구조와 목차는 화면에서 [보기] 옵션을 통해 보이게 할 수도 보이지 않게 할 수도 있습니다. 메뉴바에는 여러 가지 버튼이 있습니다. 해당 버튼은 각기 어떠한 목적과 기능을 수행할 수 있 습니다. 메뉴바 아래에서는 메뉴바에 있는 아이콘 기능 중에 꼭 필요한 기능을 설명합니다. - 24 -
왼쪽에서부터 새로운 파일, epub 불러오기, 외부콘텐츠 불러오기, 파일 저장입니다. - 새로운 파일 : 새로운 epub 문서를 실행합니다. - epub 불러오기 : 이미 만들어진 epub을 불러옵니다. - 외부 콘텐츠 불러오기 : 이미지, 오디오 콘텐츠 외에도 XML 등 다른 콘텐츠를 불러올 수 있습니다. - 파일 저장 : epub 파일이 완성되었다면 저장을 합니다. 북 브라우저와 코드 브라우저입니다. 시길을 사용할 때 가장 많이 사용하는 옵션이 될 것입니다. - 북 브라우저 : 코드 없이 책의 콘텐츠만을 볼 수 있는 화면입니다. WYSIWYG 형태로 코드를 보지 않고도 텍스트나 이미지 콘텐츠를 등록할 수 있습니다. 물론 섬세한 표현 이 어렵다는 단점을 가집니다. - 코드 브라우저 : 직접 코드를 입력하는 화면을 보여 줍니다. 미세한 조정과 다양한 표현 을 할 수 있습니다. 단점은 코드를 모르는 분들은 코드 브라우저 자체가 싫어질 수 있 다는 점입니다. Split At Cursor 커서 분할이라는 뜻입니다. 커서를 중심으로 아래를 다음 섹션으로 만들 어 버립니다. 이렇게 만들어진 새로운 섹션은 이전 섹션.xhtml에 있는 </head> 상위에 있 는 태그들을 다음 섹션이 그대로 물려받게 됩니다. 이것은 새롭게 만든 섹션에 새롭게 태그 를 입력하는 낭비를 없애 줍니다. - 25 -
파일 삽입, 특수문자 삽입, 아이디 삽입, 하이퍼 링크입니다. - 파일 삽입 : 다양한 콘텐츠 또는 미디어 파일을 삽일 할때 활용합니다. 파일 삽입 아이 콘을 이용시 html 태그가 자동으로 기재됩니다. 특수문자 삽입 : 콘텐츠에 특수 문자가 필요한 경우 아주 간단한 특수문자를 제공합니다. - 아이디 삽입 : html에서 id는 하나의 요소를 지정해야하는 경우에 활용합니다. 그것은 하나의 문장일 수도 있고, 이미지 등의 콘텐츠일 수 있는데, 그 콘텐츠를 하나의 요소 로 지정할 수 있습니다. - 하이퍼 링크 : 하이퍼 링크는 <a> 태그를 이용하여 외부로 또는 내부에 지정 된 id나 특장한 공간으로 이동이 가능하게 합니다. 메타 데이터 편집기와 차례입니다. - 메타 데이터 : epub에서 메타 데이터는 언어, 도서명, 저자명, 발행인, 그 외 작업자 등 을 기재할 수 있으며, 필수로는 도서명, 언어, 저자명, 발행인입니다. - 차례 : html 태그 중 <h1>~<h6> 사용된 콘텐츠를 차례로 등록 할 수 있습니다. - 적합성 : epub은 IDPF가 제정한 미디어 포맷으로 시길에서는 epub 2의 적합성을 편리 하게 검출할 수 있는 아이콘이 있습니다. - 26 -
구조 epub 2는 Text, Style, Images, Font 콘텐츠를 구조를 통해 삽입할 수 있습니다. - Text : html 또는 xhtml 문서를 넣을 수 있습니다. - Style : css 파일을 넣을 수 있습니다. - Images : 이미지 파일을 넣을 수 있습니다. IDPF에서 권장하는 이미지 포맷은 JPG 와 PNG 파일입니다. 최근에는 벡터방식을 호환하는 SVG 포맷도 허용이 되고 있습니다. - Font : 글꼴 폰트를 넣어서 자신이 원하는 폰트를 표현할 수 있습니다. 파일을 삽입하는 방법은 [파일 삽입] 아이콘을 활용할 수 있습니다. Text나 css는 마우스 포인 트를 폴더에 두고 마우스 옵션 버튼을 통해 새로운 문서를 만들 수도 있습니다. - 27 -
3. epub 제작 실습 HTML 은 하이퍼텍스트 마크업 언어(HyperText Markup Language)의 약자입니다. html은 웹페이지를 구욱하기 위한 마크업 언어로, 글자크기, 색, 모양 등과 같은 본문을 나타낼 수 있고, 이동, 그래픽 등 다른 항목을 구조적인 문서로 만들 수 있습니다. HTML의 표준은 W3C(World Wide Web Consortium)에서 표준을 개발하고 장려합니다. 마크업 방법 html 마크업은 html 요소(Elements)와 속성(Attributes) 으로 html에서 사용하는 명령어는 태그(tag)라고 부릅니다. 태그는 꺽쇠괄호 (<>)를 사용하여 나타내는데, 시작과 끝을 표시하는 TKd으로 이루어진 태그를 문단 태그 라고 하며, 시작태그만으로 이루어진 태그를 단독 태그 라고 합니다. W3C는 웹에서 특정한 규칙을 정했습니다. 이것을 웹표쥰이라고 합니다. 기본이 되는 규칙 은 아래처럼 9줄에 불과합니다. <!doctype html> <html> <head> <title>hello HTML</title> </head> <body> <p>hello World!</p> </body> </html> <html>과</html> 사이의 문자는 웹 페이지를 표현합니다. <head>와</head> 사이의 문자는 눈으로는 보여지지 않지만 웹 페이지가 보여지기 위해 필요한 정보를 가지고 있습니다. <title>과</title> 는 페이지의 제목을 정의합니다. <body>와</body> 사이의 문자는 보여지는 페이지 내용입니다. - 28 -
3.1. epub 제작에 필요한 필수 html 코드 <h1> ~ <h6> - 제목을 의미하는 태그로 epub에서는 차례를 구성하기도 한다. - 문단태그 <a> - 링크 태그로 옆에 href= 주소 속성을 함께 사용한다. - 문단태그 <strong> - 강조를 하고 싶은 경우 함께 사용한다. 문단태그 <span> - 문자 태그로 단락 내용안에 함께 있는 스타일을 적용하고 싶은 경우 사용 문단태그 <sup> - 위 첨자 태그로 숫자 또는 각주 등을 꾸밀 때 유용함. 문단태그 <u> - 태그가 들어가는 단란에 밑줄이 생성. 문단태그 <strike> - 가운데 취소선이 생기는 태그. 문단태그 <p> - 단락을 생성하는 태그 - 문단태그 - 29 -
3.2. 기본 스타일 및 레이아웃 연습 CSS 란? 캐스케이딩 스타일 시트(Cascading Style Sheets)는 W3C의 표준으로 레이아웃과 스타일을 정 의할 때 사용한다. Markup Selector {property : balue; > 선택자 {속성 : 값;} 사용방법 인라인 스타일 <font size="16">hello World!</font> <font size="11">hello World!</font> 결과 hello World! hello World! 임베디드 스타일 <style> h1 {font-size: 16px;}.txt {font-size: 11px;} </style> <body> <h1>hello World!</h1> <p class= txt >hello World!</p> </body> - 30 -
결과 hello World! hello World! 링크 스타일 <head> <link href="../styles/css.css" rel="stylesheet" type="text/css" /> </head> <css.css> h1 {font-size: 16px;}.txt {font-size: 11px;} <body> <h1>hello World!</h1> <p class= txt >hello World!</p> </body> 결과 hello World! hello World! 많이 사용하는 CSS @font-face { font-family: "kpb"; src: url(../fonts/kopubbatang.otf); } body {font-family: "kpb"; } font-family: "kpb ;.text { font-family: "kpb"; color: #00CC99; font-size: 140.0000%; font-style: normal; font-variant: normal; font-weight: bold; letter-spacing: 0.2300em; margin-bottom: 6.2291%; margin-top: 0.0000%; margin-left: 0.0000%; margin-right: 0.0000%; - 31 -
} text-align: left; text-decoration: none; text-indent: 0%; text-transform: none;.w100 { } width:100%;.cvoer { vertical-align: middle; text-align: center; height: 100%; padding: 0; }.box1{ background: #FF8000; padding-left: 20px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; margin-left: 10px; margin-right: 10px; margin-top: 10px; margin-bottom: 10px; }.pagebreak{ } page-break-before:always;.none { } display: none; - 32 -
.center{ display: block; margin-left: auto; margin-right: auto }.left { } float: left; margin-bottom: 0; margin-left: 0; margin-right: 1em; margin-top: 0; padding-bottom: 0em; padding-left: 0em; padding-right: 0em; padding-top: 0em; width: 40%; display: block; - 33 -
4. epub 완성 및 테스트 4.1. epub 오류 체크 및 적합성 검사 ㅇ epub 적합성 테스트 사이트 http://validator.idpf.org/ epub 표준 규격 적합성을 통과해야 제대로 된 epub이라고 할 수 있습니다. 상기 사이트는 10Mb 이하의 epub을 검사할 수 있으며, epub 2 & epub 3를 모두 검사할 수 있는 도구입니다. [파일 선택] 옵션을 통해 epub을 등록하고 아래 [Validate] 버튼을 누르면 검사가 진행됩니다. [SIGIL 완벽입문.ePub] 파일을 체크하였습니다. 아무런 문제가 없다는 답변이 나왔습니다. - 34 -
시길에서는 적합성을 테스트 해주는 도구가 존재 합니다. 우측 상단에 있는 버튼으로 epub 에 문제가 없다면 아래와 같이 나올 것입니다. - 35 -
4.2. 뷰어를 통한 전자책 테스트 제작이 완료된 epub 파일을 테스트 방법은 여러 가지가 있습니다. 그중에서 리디움 브라우저를 통한 방법은 가장 쉽고, 안정성 있는 테스트입니다. http://readium.org/ 리디움 브라우저는 epub 브라우저입니다. 테스트 용도로도 사용할 수 있고, Readium SDK를 활용하여 epub 브라우저를 만들 수 있습니다. 리디움을 설치하려면 먼저 크롬 브라우저를 설치해야합니다. [크롬 다운로드] https://www.google.com/intl/ko/chrome/browser/features.html 크롬을 설치하였다면 웹 스토어를 통해 readium을 설치 할 수 있습니다. 크롬을 실행하여 http://readium.org/로 접속합니다. 좌측 하단 INSTALL FROM CHROME WEB STORE를 클릭하여 설치를 합니다. (이 뷰어는 크롬에서만 설치 됩니다.) - 36 -
크롬 주소창에 chrome://apps/를 입력하면 아래 아이콘이 활성화 되어있습니다. 아이콘을 실행합니다. 리디움 브라우저는 epub 전용 브라우저로 매우 심플하게 작동됩니다. 완성된 epub 전자책을 [로컬 파일에서] - [파일 선택] 버튼으로 등록합니다. 이후에는 완성된 전자책을 독서하면 됩니다. - 37 -
마치며 실제로 책을 만들어 보시니 어떤 느낌을 가지게 되시나요? 사실 우리가 읽는 책이 한권 만들어지는데에는 다양한 업무가 존재합니다. 크게 요약하면 이렇 습니다. l l l l l 원 저작자 : 원 저작물을 기록한 사람의 것 편집자 : 원 저작물의 오류와 시대의 트렌드로 바꾸는 사람의 것 디자인 : 원 저작물의 디자인을 부여하는 사람의 것 발행권 : 계약 기간동안 발행할 수 있는 사람의 것 유통권 : 계약 기간동안 유통을 할 수 있는 사람의 것 전자책은 어떤 변화를 맞이하고 있을까요? 출처 : 2014년 KPIPA 출판산업 동향 - 38 -
여러 산업 종류중에서 지속적인 발전을 가지는 산업은 전자출판임을 발견할 수 있습니다. 출처 : 2014년 문체부보도자료 출판산업 업종별 연도별 매출액 현황은 전자출판업이 가장 크게 성장하고 있습니다. 아래 온라 인 출판 유통업도 전자출판과 맥을 함께하고 있습니다. 전자출판업종이 앞으로도 계속 성장할 것인가 라는 대답은 저도 감히 예측하기 어려운 부분이지만 지난 통계를 비춰보면 장기적으로도 매우 낙관적이며 희망적이라고 예측합니다. 끝. - 39 -