posted by 내.맘.대.로 2023. 1. 19. 09:14

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

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

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

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

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

728x90

전자책 만들다 보면 다양한 테두리를 그리게 됩니다.

테두리 모양은 전부 제각각이라 초보 편집자에게 종종 질문을 받아요.

테두리는 아무리 복잡해도 '기본'만 알면 쉽게 그릴 수 있습니다.

그 기본이란,

border(border와 연결된 속성 전부)

border-image

background(background와 연결된 속성 전부)

이렇게 3개.

이 3개가 어떻게 쓰이는지 예시로 보여드릴게요.

아래 예시 이미지는 모두 왼쪽이 종이책(PDF), 오른쪽이 전자책입니다.

1. 패턴이 들어간 테두리 선, 그리고 안쪽 영역 라운딩 처리

이런 테두리는 background-image를 사용합니다.

박스를 2개 그리지요. 패턴 이미지가 있는 바깥쪽 상자, 그리고 흰색 안쪽 상자.

안쪽 상자에 border-top-left-radius를 주면 라운드 처리를 할 수 있지요.

 

2. 너무 쉬운데 의외로 그릴 줄 아는 사람이 별로 없는 테두리

이런 테두리는 아주 그리기 쉽습니다.

border와 border-radius 속성만 있으면 됩니다. 상자도 하나면 되고요.

border-radius를 어떻게 쓰는지 공부하면, 아주 쉽게 그릴 수 있는 테두리입니다.

 

이 테두리는 여러가지로 활용을 할 수 있습니다.

예를 들어 이런거.

앞쪽에 있는 반달 모양의 원형 테두리 역시 border와 border-radius로 만들 수 있어요.

위, 아래, 좌, 우, 타원형, 원형 등 어떤 형태로든 만들 수 있기 때문에

연 평균 200~300권 만들다 보면 10번 정도 쓰게 되는 스타일입니다. 이정도면 엄청 높은 빈도예요.

3. 팁상자/상자형 각주 스타일

이건 단순하게 border만 이용하면 됩니다.

너무 쉬워서 설명할 필요도 없을 것 같지만,

의외로 float 속성을 모르는 사람들이 많아 가볍게 언급합니다.

float은 이미지에만 사용하는 줄 아는 초보 편집자가 많아요. float은 block, inline 속성 태그면 어디든 쓸 수 있어요.

 

4. border로 그릴 수 없을 때는 border-image로 그리면 된다

이런 테두리는 border로 그릴 수 없습니다.

위, 왼쪽은 2줄, 각 모서리 모양이 모두 다르고, 오른쪽 아래에는 돋보기 아이콘까지 들어있지요.

이런 테두리를 그리라고 하면 상자를 여러개 중첩시킬 생각을 하는데,

그냥 border-image를 쓰면 간단해요.

 

5. border와 background의 활용

이건 2번에서 설명한 테두리와 똑같아요. border와 border-radius를 이용했지요.

그런데 왼쪽 위에 연필 아이콘이 있습니다.

이렇게 연필 아이콘이 있으면, 이미지를 직접 삽입하는 분들이 많더라구요.

그냥 background-image를 쓰세요.

왜? 간단하니까.

종이책(PDF)

전자책(EPUB)

이미지를 직접 삽입한다면 태그가

<div class="border-box">

<div class="bullet_image">

<img src="../Images/bullet.jpg" alt="bullet image">

</div>

</div>

이렇게 되고

배경이미지를 쓰면

<div class="border-box"></div>

이렇게 끝나거든요.

6. 한쪽 모양만 다른 테두리

4개 면은 border로 그릴 수 있는데 한쪽만 그릴 수 없다면?

이렇게 복잡하게 생각하지 마세요.

그냥, 이건 border-image로 그리면 됩니다.

4번이랑 이거랑 똑같아요. 4개 면이 다르던, 한쪽 면이 다르던

border로 그릴 수 없다면 border-image를 쓰면 됩니다.

 

반응형

댓글을 달아 주세요

posted by 내.맘.대.로 2023. 1. 4. 12:05

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

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

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

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

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

728x90

* 이 글에서 전자책은 EPUB을 의미합니다. 다양한 전자책 포멧이 있지만, 이 글에서는 EPUB에 대한 정보만 설명합니다.

EPUB을 편집하는 프로그램은 다양합니다.

저는 주로 Sigil을 소개하지만 Sigil만 사용해야 하는건 아닙니다.

EPUB 편집 프로그램은 어떤게 있는지,

편집 프로그램 별로 장단점은 무엇인지 간단히 정리하겠습니다.

 

1. Sigil (https://sigil-ebook.com/sigil/)

내맘대로의 EPUBGUIDE.NET에 있는 거의 모든 정보는 Sigil과 관련이 있습니다.

EPUB2, EPUB3를 완벽하게 지원하고,

전자책 편집에 꼭 필요한 기본 기능과

플러그인으로 제공되는 수십종의 부가 기능으로 전자책 편집 시간을 비약적으로 줄일 수 있습니다.

저는 Sigil을 이용해 이미지가 100장 이상 들어가고 주석이 1000개가 넘으며 편집 스타일이 복잡한 인디자인 파일을

7~8시간 정도면 EPUB으로 변환을 할 수 있습니다.

 

장점 :

강력한 편집 기능 / 다양한 플러그인

EPUB2, EPUB3, JavaScript, MathML, 정규식을 이용한 찾기/바꾸기, 페이지 검사(크롬 기반 개발자 도구) 지원

단점 : 초보자는 사용하기 어려운 코딩 기반 편집

 

설치 환경 : 윈도우, 맥OS, 리눅스

 

2. 이북스타일리스트 (http://www.ebookstylist.co.kr/)

초보자도 사용하기 편한 전자책 편집 프로그램입니다.

Adobe Air 기반으로 윈도우와 맥OS에서 동일한 UI로 사용할 수 있습니다.

스타일시트 편집기를 제공하기 때문에 초보자라도 쉽게 CSS 스타일을 만들 수 있습니다.

텍스트 원고를 전자책으로 편집한다면 Sigil보다 더 좋습니다.

다만, 인디자인 파일을 변환한다면 추천하지 않습니다.

 

장점 :

쉬운 사용, CSS 편집기

단점 :

코드 기반 편집이 약하고 편집기에서 강제하는 설정이 많음

Adobe Air를 먼저 설치해야 함

무료 사용은 가능하나, 펜립 정책에 따른 제한 사항이 있음

 

설치환경 : Adobe Air가 설치된 윈도우, 맥OS

 

3. 캘리버(https://calibre-ebook.com/)

전자책 뷰어로 많이 알려져 있지만, 캘리버를 설치하면 Editing e-book도 함께 설치됩니다.

캘리버 편집기를 보면 Sigil과 많은 부분이 닮아있습니다. Sigil 0.7 버전에서 파생되었기 때문에 메뉴 구성이나 UI가 비슷합니다.

하지만 이후 Sigil과 다른 개발팀이 관리하고 있기 때문에 세부적으로 들어가면 큰 차이가 있습니다.

특수문자 삽입 기능이나 규칙 편집기는 Sigil에도 추가되면 좋겠다 싶을 정도로 훌륭합니다.

캘리버를 통해 EPUB으로 변환한 책을 재편집 할 때 아주 좋습니다.

 

장점 : 캘리버와 연동하여 DOC 문서 등을 EPUB으로 변환/수정하기 좋음

단점 : 캘리버 뷰어 만큼 완성도가 높지 않음

 

4. 나모 오서(https://www.arasoft.net/ / https://www.namoauthor.com/)

홈페이지 저작툴로 알려진 나모에서 만든 EPUB 편집기입니다.

어찌된 영문인지 현재는 아라소프트가 관리하고 있습니다.

간단한 인터렉션을 추가한 EPUB3 파일을 만들 때 좋습니다.

 

장점 :

JavaScript를 몰라도 움직이는 이미지, 정답 체크 등의 간단한 인터렉션을 넣을 수 있음

단점 : 오류가 많고 스크립트가 작동하지 않는 뷰어가 많음

 

5. 윙크 2.0 (https://winkeditor.com/)

개발이 멈춰있지만, 초보자가 사용하기 좋은 전자책 편집기입니다.

CSS 편집기가 포함되어 있어 HTML과 CSS를 몰라도 간단한 스타일을 만들 수 있습니다.

Adobe Air를 설치해야합니다.

 

장점 : 초보자가 쉽게 사용할 수 있음

단점 : Adobe Air 설치, 까다로운 스타일 편집은 어려움

 

반응형

댓글을 달아 주세요

posted by 내.맘.대.로 2022. 11. 23. 15:14

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

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

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

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

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

728x90

이 오류는 작성일 기준이며, 향후 유통사의 업데이트로 오류가 개선될 수 있습니다.

오류 개선은 업데이트 하지 않습니다.

전자책 제작에 영향을 주는 정도에 따라 하, 중, 상, 심각으로 구분합니다.

 

 

리디북스 PC 뷰어에서 마진(margin)이 반영되지 않는 문제가 있습니다.

특정 조건에서 생기는 문제 같은데 원인은 모르겠습니다.

 

margin : 1em;

 

이렇게 스타일을 넣으면 여백이 생기지 않습니다.

 

위 이미지가 마진이 적용되지 않았고, 아래 이미지는 수정한 상태입니다.

타 유통사에서는 수정 전에도 아래 이미지처럼 보입니다.

 

아래 두 이미지를 보면 문제가 확실히 보입니다.

본문과 제목에 마진을 줬는데 위 이미지는 제대로 적용이 되지 않았습니다. 

문단과 제목 사이에 이렇게 여백이 있어야합니다.

 

모바일 뷰어는 확인해 보지 않았습니다.

PC 뷰어에서 이런 문제가 생기니 스타일 잡을 때 조치를 취해야합니다.

반응형

댓글을 달아 주세요

posted by 내.맘.대.로 2022. 11. 15. 09:32

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

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

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

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

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

728x90

아마존에서 제공하는 킨들 퍼블리싱 가이드라인입니다.

이 글은 2022년 11월 15일 작성되었고, 아마존의 정책에 따라 링크가 변경될 수 있습니다. 

반응형

댓글을 달아 주세요

posted by 내.맘.대.로 2022. 11. 15. 09:17

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

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

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

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

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

728x90

날 잡아 모질라에 있는 CSS 속성을 전부 하나씩 살펴봐야겠습니다.

이런 좋은 속성을 아직도 모르고 있었다니 ㅜ.ㅜ

이걸로 밥벌이 한지 10년이 다 되어가는데

아직도 아는 것 보다 알아야 할 게 더 많네요.

반응형

댓글을 달아 주세요

posted by 내.맘.대.로 2022. 11. 8. 10:25

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

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

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

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

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

728x90

리디북스에서 제공하는 전자책 제작 가이드입니다.

 

이 글은 2022년 11월 8일 기준으로 작성되었습니다.

리디북스에서 내용을 수정하면 링크가 끊길 수 있으니, 정확한 정보는 리디북스에 확인하시기 바랍니다.

 

https://drive.google.com/file/d/17b0UdlFRzc-fyJpCunBfnuRG_XWRPvri/view

반응형

댓글을 달아 주세요