내맘대로의 EPUB 제작 가이드

인천쪽에 계신 분들 중에 전자책 제작 초급 강의 듣고 싶은 분들 신청하세요.

​

초급 과정입니다.

컴퓨터 기초를 알고 있는 분들은 누구나 따라올 수 있습니다.

인터넷에서 파일 다운로드 받고, 다운 받은 파일이 어디 있는지 정도는 알아야 합니다.

압축 파일 푸는 방법도 알아야 하고, 파일을 지정한 폴더로 복사할 수 있어야 하고요.

​

기간 : 8월 5일 ~ 26일 매주 목요일(총 4일)

시간 : 18:30분 ~ 20시(1시간 30분, 총 6시간)

강의 내용 :

- Sigil과 EPUB 탬플릿으로 전자책 제작

- 간단한 CSS 편집으로 스타일 수정

​

​

https://www.gygl.go.kr/culture/app/culture.asp?ptype=view&num=863&page=1&mNo=MC010020000&libno=&sfield=&sword=&path_url=/culture/app/culture.asp

접수신청 | 계양구립도서관> 신청·참여> 독서문화프로그램

프로그램명 나만의 전자책 만들기 도서관명 IT작은도서관 접수기간(시간) 2021-06-09 11:00 ~ 2021-08-02 23:59 강좌상태 신청진행 행사대기 대상 성인 장소 경인교대입구역 IT작은도서관 수강기간 2021-08-05 ~ 2021-08-26 수강시간 18:30 ~ 20:00 ( 1시간 30분 ) 수강요일 목 정원 (접수정원 / 신청인원) 10 / 1 접수대기 (대기자 정원 / 대기자수) 5 / 0 강사명 박웅영 재료비 0원 첨부파일 강의계획서_나만의_전자책_제작.jpg  (119 Kb) 교재비 0 원 ○ 세부 내용...

www.gygl.go.kr

​

http://jikji.duckdns.org/book/133

전자책 제작에 많이 사용하는 무료 글꼴의 옛한글표현 범위 샘플입니다.

Sigil 1.6.0 버전이 공개됐습니다.

https://sigil-ebook.com/2021/05/29/sigil-1-6-0-release/

https://sigil-ebook.com/2021/05/29/pageedit-1-6-0-release/

큰 변화가 있던 1.5 버전의 안정화가 이루어졌고,

OPF, NCX 검색 기능이 추가됐습니다.

메뉴 번역 열심히 해서 이번 버전에 한글화 반영되어 있습니다.

​

중요한 기능 변화

- 탭 파일, CSS 파일, OPF 및 NCX 파일을 포함하도록 확장 된 검색 대상 찾기 및 바꾸기

- 저장된 검색 옵션에 모드, 방향, 옵션 및 대상 등의 옵션까지 저장

- 병합시 자동으로 중복 ID 방지

- 다시 설계된 CodeView 맞춤법 검사를 통해 Sigil-1.3.0 속도로 되돌립니다.

- 외부 XHTML 편집기 기능 향상 - 독립 편집에서 Sigil과 연계한 편집으로

​

그 외 다양한 오류가 수정되었습니다.

1.5 버전에 안정화 이슈가 있었고, 1.5.1을 긴급 배포하여 일부 수정을 했지만 버그가 조금 남아있었지요.

1.6 버전에는 새로운 기능이 추가되면서 1.5.1 버전의 오류도 많이 개선되었습니다.

모두 많이 사용하는 기능들이라 업데이트가 더 반갑네요.

스타일이 재미있는 책이라 소개합니다.

shape-outside를 써야 느낌이 사는 내용이 많이 있고, 이 외에도 다른 재미있는 스타일이 몇가지 있습니다.

Previous imageNext image

먼저 shape-outside를 써서 느낌을 살린 스타일입니다. PDF(종이책)는 위처럼 되어 있습니다.

​

Previous imageNext image

Shape-outside를 써서 느낌을 살려봤습니다. 전자책은 가변적이기 때문에 100% 살리진 못하지만, 다양한 화면에서 깨짐 없이 스타일이 표현이 됩니다.

​

​

그리고 gradient 스타일도 있어요.

본문 글자 색을 gradient로 적용했습니다.

오래 전에 '요리하는 도시 농부'라는 책에서 글자에 gradient 넣는 방법을 설명한적이 있지요.

그 속성을 변형해 사용했습니다.

PDF는 이렇습니다.

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

폭이 가변적이라 스마트폰 같이 좁은 곳에서 보면 한 문단이 2페이지 정도 넘어갑니다.

그럼 gradient 범위가 너무 넓어져요.

그래서 2문단에 gradient를 적용하지 않고 한문단만 적용했어요.

폭이 넓으면 조금밖에 적용되지 않지만, 폭이 좁을때는 1페이지 전체에 gradient가 적용됩니다.

​

​

이런 스타일도 있었네요.

어떻게 할까 고민하다, 간단한 방법으로 해결을 했습니다.

​

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

​

​

아래 PDF는 뒤집힌거 아닙니다.

이렇게 본문 중간에 글자가 뒤집혀있어요.

​

EPUB에서도 이렇게 뒤집었습니다.

종이책처럼 페이지 전체를 뒤집은건 아니고,

전자책은 페이지를 특정할 수 없기 때문에 일정 범위의 문단을 뒤집은거예요.

​

​

​

독특한 스타일이 많다보니 이런건 애교 수준이네요.

​

​

​

이런 것도 있습니다.

위쪽 사선은 쉽게 처리할 수 있지만, 아래쪽 사선은 가변적이기 때문에 처리하기가 정말 어려워요.

그래서 가변 적용까지는 포기하고, 일정 폭에서라도 비슷하게 보이도록 만들었습니다.

일정한 폭에서는 종이책과 똑같은 지점에서 스타일이 적용됩니다. 하지만 폭이 바뀌면 문단 범위가 조금 달라져요. 아래 문단이 사선 안쪽에 들어올 수도 있고, 사선 안쪽 문단이 벗어날 수 있지요.

​

간만에 재미있는 책을 만들어 스타일 몇개 소개해 드렸습니다.

​

전자책은 텍스트와 이미지 대충 얹힌 수준이라 생각하는 분들이 여전히 많습니다.

전자책은 제대로 표현만 하면 종이책보다 더 다양한 형태로 편집이 가능합니다.

가변적이기 때문에 표현할 수 없는 것도 존재하지만

팝업 주석 처럼 종이책에서는 불가능한 것들을 적용할 수 있지요.

​

'그건 전자책에서는 안돼요' 라는 사람이 있으면

왜 안되는지, 표현할 방법은 없는지 물어보세요.

진짜 안되는 것 몇가지를 제외하면,

종이책에서 편집 가능한 건 전자책도 다 표현 가능해요.

이런 분들은 전자책 제작 강의 듣기 전에 컴퓨터 기초부터 배우세요.

컴퓨터 기초도 모르면 전자책 제작 할 수 없습니다.

최소한, 저는 전자책 제작 방법을 가르칠 수 없습니다.

컴퓨터 기초도 모르면서 전자책 제작을 배우려는 분들은

전자책 제작이 쉽다고 가르치는 분들께 배우세요. 저는 그정도 실력이 안되거든요.

​

강사. 파일 다운로드 하세요. 다운로드 한 파일을 Sigil에 추가하세요.

수강생. 다운받은 파일이 어디있나요?

​

강사. 이 파일을 ...에 있는 폴더에 복사하세요.

수가생. 파일 어떻게 복사해요?

​

강사. 파일 저장하세요.

강사. Sigil 종료하고, 다시 실행시킨 다음 저장한 파일 불러오세요.

수강생. 저장한 파일 어디 있어요?

​

강사. 편집 메뉴에서 설정 누르세요.

수강생. 설정이 어디있어요?

강사. 편집 메뉴에 있어요.

수강생. 편집이 뭐예요?

​

강사. 압축파일에 있는 *** 파일을 여세요.

수강생. 파일이 안열려요.

강사. 압축울 푸세요.

수강생. 압축 풀었는데요.

강사. 탐색기에서 압축 파일 목록 보여주는거 말고, 압축 파일을 푸세요.

수강생. ...

​

수강생. 시키는 대로 똑같이 했는데 스타일 적용이 안돼요.

강사. 똑같이 안해서 그래요.

수강생. 정말 똑같이 했어요.

강사. 오타 있나 보세요.

수강생. 오타 없어요.

강사. 정말 시키는 대로 했는데 안되면 오타가 있을거예요.

수강생. 오타 없다니까요.

강사. 시키는 대로 했고, 오타가 없으면 적용 될거예요.

수강생. 진짜 안돼요.

강사. (수강생 화면 보고) 여기 오타 있네요.

​

강사. A 하고, B 한 다음, C를 하세요.

강사. 다시 한번 설명합니다. A 하고, B 한 다음, C를 하세요.

강사. 천천히 다시 한번. A 하고, B 한 다음, C를 하세요.

강사. A 하고, B 한 다음, C 하셨어요?

수강생. 뭐 하라고요?

요즘 일에 치여서 글을 올리지 못했네요.

게시판이 너무 오래 쉬고 있으면 안되겠기에...^^;;

간만에 스타일 하나 올립니다.

형광펜 중간에 십자가 표시 보이시나요?

하나는 파란색, 하나는 파란색 테두리입니다.

파란색은 쉽지만, 테두리는 어떻게 할까요?

​

테두리를 그리는 스타일은 없습니다. 글자 테두리 색과 안쪽 색을 지정하는 스타일도 없고요.

이건 그림자 속성을 활용한거예요.

​

상하좌우 그림자를 1px로 주고, 그림자 색을 원하는 것으로 지정하면 되지요.

​

text-shadow: -1px 0 #0181C6, 0 1px #0181C6, 1px 0 #0181C6, 0 -1px #0181C6;

color : #FFFFFF;

눈에는 파란색 테두리 처럼 보이지만, 사실 그림자입니다.

안쪽 글자는 흰색으로, 글자 안쪽은 흰색으로 넣었어요.

​

그런데 회색 바탕이라 티가 안나지만, 글자 안쪽 색을 지정하지 않고 투명하게 하려면 어떻게 하면 될까요?

​

이건 퀴즈로 남겨봅니다.