posted by 내.맘.대.로 2024. 2. 6. 09:42

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

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

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

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

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

강의 할 때 마다,

그리고 쪽지나 메일로 전자책(EPUB)을 어떻게 하면 잘 만드는지 물어보는 분들이 많이 있습니다.

강의를 할 때면 항상 듣는 질문이에요.

궁금해 하는 분들이 많은 것 같아,

전자책(EPUB)을 빠르게, 잘 만드는 방법 설명드립니다.

그대로만 하면 100% 성공 보장합니다.

1. 서로 다른 디자인으l EPUB을 100개 만들어 보세요.

책의 표지 삽입부터 판권까지 완벽하게 100권만 만들어 보세요.

이때 중요한게 있습니다.

처음 30권 정도는 이곳 저곳에서 스타일 복사해도 됩니다.

스타일 복사해 가면서 책 구조 익히고, 편집 프로그램 사용법을 익히세요.

HTML과 CSS가 무엇인지, 어떻게 작동하는지 감이 올거예요.

하지만 30권이 넘어가면 절대로 스타일 복사하지 말고, 직접 스타일을 잡으세요.

CSS나 HTML 속성을 참고해도 되지만, 복붙은 절대 하면 안됩니다.

EPUB 100개 만들어 보라고 하면,

"그건 너무 시간이 오래 걸리잖아요."

라는 분들이 계십니다.

네. 시간 오래 걸려요.

"좀 더 빨리 배울 방법 없어요?"

있습니다.

좀 더 빨리 EPUB 100개를 만들어 보세요.

그럼 제작 속도도 빨라질 거예요.

2. HTML과 CSS를 공부합니다.

1번 하려면 이건 공부 할 수 밖에 없어요.

HTML과 CSS를 완벽히 익힐 필요는 없습니다. 저도 모르는 태그 많고, 모르는 CSS 속성 많아요.

EPUB2에서는 거의 쓰지 않는 태그와 속성도 많이 있습니다.

전자책에 많이 쓰는 HTML 태그와 CSS 속성을 집중적으로 공부하세요.

그리고 이걸 자유롭게 활용할 수 있어야 합니다.

EPUB 100개를 스타일 복붙 하지 않고 직접 만들다 보면 자연스럽게 HTML과 CSS 공부를 하게 될거예요.

3. 유통사 뷰어를 연구합니다.

EPUB 100개 만들면서 국내 주요 유통사 뷰어에 하나씩 넣어 스타일이 어떻게 보이는지 확인해 보세요.

각 유통사 별로 어떤 CSS속성이 어떻게 표현되는지 확인합니다.

EPUB 100개 정도 테스트 해 보면 유통사 뷰어 별 특성이 보일거예요.

뷰어 특성에 맞게 스타일을 편집할 수 없으니

뷰어 공통으로 적용되는 스타일을 찾아갑니다.

그럼 유통사 뷰어 별로 깨지지 않는 EPUB을 만들 수 있습니다.

4. 폰트를 연구합니다.

폰트 관련 문의 중에, 폰트가 뭔지만 알아도 물어볼 필요가 없는 질문이 많아요.

폰트는 PC에서, 폰에서, 안드로이드에서, 아이폰에서 다른 특성을 보입니다.

PC에서는 볼드로 보이는데 안드로이드에서는 볼드가 아닐 수 있어요.

PC에서는 폰트가 제대로 적용되는데 아이폰에서는 적용 안되기도 합니다.

어떤 폰트는 글자가 있고, 어떤 폰트는 글자가 없습니다.

어떤 폰트는 약물이 전각으로 보이고, 어떤 폰트는 반각으로 보입니다.

이 외에도 수백가지 특성이 있어요.

EPUB 100개 만들면서 다양한 폰트를 써 보고,

유통사 뷰어의 PC, 모바일 뷰어에서 폰트가 어떻게 보이는지 확인해 보세요.

5. 이미지 포멧 별 특성을 공부합니다.

EPUB에서 많이 쓰는 jpg와 png은 확실히 알아야 돼요.

이 두 파일의 차이, 압축 비율에 따른 해상도 변화, 편집 프로그램에 따른 색감 변화 등을 연구합니다.

6. Sigil 또는 자신이 사용하는 편집 프로그램의 모든 기능을 이용해 봅니다.

많은 분들이 자신이 쓰는 기능만 써요.

그럼 발전을 할 수 없습니다.

편집 프로그램에 있는 모든 기능을 하나씩 써보세요.

EPUB 100개 만들다 보면 여러 문제가 생길텐데, 편집 프로그램의 다양한 기능 안에 해결 방법이 있습니다.

각주 800개의 번호를 바꾸려면 4~5시간 걸려요.

Sigil의 기능을 이용하면 30분이면 끝낼 수 있습니다.

이렇게 자신이 쓰는 편집 프로그램을 완벽히 익히세요.

7. 책의 구조를 이해합니다.

인디자인이나 쿽 처럼 종이책 조판을 EPUB으로 변환할 때 필요합니다.

책의 구조도 모르면서 책을 만들려는 분들이 많더라구요.

책의 구성 요소는 아주 다양합니다.

표지, 날개, 간지, 속표지, 부, 장, 절, 판권, 제목, 본문, 인용, 참고문헌, 주석, 첨자.....

책에 어떤 요소가 있는지 알아야 책을 만들 수 있어요.

그리고 책의 구조를 알면, 인디자인이나 쿽 파일을 EPUB으로 변환 할 때 속도를 엄청나게 줄일 수 있습니다.

8. EPUB 표준 문서를 꼼꼼히 읽고 이해합니다.

EPUB 전문가라고 주장(?)하는 사람들 중에도 EPUB 표준문서 제대로 본 사람이 별로 없습니다.

그래서 EPUBCheck오류를 물어보면 "아마 이런 이유일거예요."라고 어림짐작으로 얘기를 하지요.

이런 사람들은 표준문서를 제대로 안본거예요.

표준 문서는 EPUB을 만드는데 필요한 모든 지식이 담겨있는 문서예요.

이 문서를 제대로 이해하면 EPUBCheck에서 생기는 모든 오류를 다 잡아낼 수 있습니다.

"정말이요?"

네. EPUBCheck는 EPUB 표준문서에 위배되는 내용을 찾는 프로그램이에요.

그러니 EPUB 표준문서를 알면, EPUBCheck가 표준문서에 위배된다고 찾은 항목의 원인, 수정 방법을 알 수 있지요.

진짜 전자책 편집을 잘 하려면 표준문서 이해는 필수입니다.

책 100권을 어디서 구하냐는 분들이 계세요.

각 유통사 온라인 서점 들어가 보세요.

본문 도입부까지 미리보기 할 수 있습니다.

전자책 만드는데 본문 내용은 전혀 중요하지 않아요.

구조만 동일하면 내용이 뭐든 상관 없이 스타일을 적용할 수 있어요.

본문은

lorem ipsum dolor sit amet, consectetuer adipiscing elit.

이거면 됩니다. HTML과 CSS 공부하는 사람들 한테 아주 유명한 문장이에요.

본문은 저 문장 넣고, 유통사에서 다양한 분야 책 미리보기 100권 찍어서

종이책 스타일 그대로 전자책을 만들면 됩니다.

이정도만 하면

누구나 EPUB을 빠르고 깔끔하게 만들 수 있습니다.

100% 성공 보장합니다.

반응형
posted by 내.맘.대.로 2024. 1. 23. 08:17

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

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

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

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

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

이 글은 2024년 1월 23일 기준입니다. 유통사가 뷰어 업데이트를 하면 문제가 해결될 수 있습니다.

 

CSS 값 중 max와 min이라는 값이 있습니다.

 

이미지 폭을 조절할 때, 일정 해상도 까지는 화면에 맞춰 키우고,

일정 폭을 넘어가면 고정 값으로 하고 싶을 때,

 

width : 고정값;

max-width : 100%;

 

이렇게 하면 됩니다.

이 의미는 이미지를 고정값으로 보줘라.

하지만 고정값 보다 폭이 작으면 폭에 맞춰 100%로 맞춰라.

입니다.

 

이걸 한 줄로 표현을 하면

 

width : min( 고정값, 100%)

 

이렇게 할 수 있어요.

 

하지만 교보ebook(PC), 예스24(PC)는 이 값을 지원하지 않습니다.

 

이 값을 사용하면 문제가 생길 수 있어 두 유통사가 해결하기 전까지는 사용하지 않는 것이 좋습니다.

반응형
posted by 내.맘.대.로 2023. 12. 29. 08:33

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

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

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

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

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

전자책을 만들다 보면 애매한 길이를 잡아야 할 때가 있습니다.

폭 100%에서 2em만 빼야 한다던가...

예를 들면 이런거.

이런 스타일 만드는 방법은 여러가지예요.

그런데 저 선을 background-image, linear-gradient 조합으로 만들고

background-size로 맞춘다. 이렇게 생각했을 때 문제가 되는 부분은 선의 길이지요.

예전에는 선 길이를 3000px 정도 줬습니다. 그럼 UHD 모니터도 문제 없었지요.

그런데 지금은 3000px보다 해상도가 좋은 모니터가 나오니 문제가 됩니다.

그렇다고 5000px, 10000px... 무한대로 갈 수도 없고.

이럴 때 calc 속성을 써보세요.

100%-5em

이렇게 하면 화면 폭 100% 길이에서 5em 만큼 빠진 길이로 항상 맞춰줍니다.

이미지 폭 맞출 때,

좀 안다는 분들은

width : ...

max-width : ...

이렇게 할 거예요.

여기서 조금 더 아는 분들은

width : min(...)

이렇게 합니다.

width + max-width, width + min-width 조합을

min, max 속성으로 처리할 수 있어요.

더 자세한 내용을 알고 싶다면

https://www.w3schools.com/css/css_math_functions.asp

 

CSS Math Functions

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Functions

 

CSS value functions - CSS: Cascading Style Sheets | MDN

CSS value functions are statements that invoke special data processing or calculations to return a CSS value for a CSS property. CSS value functions represent more complex data types and they may take some input arguments to calculate the return value.

developer.mozilla.org

 

반응형
posted by 내.맘.대.로 2023. 12. 14. 10:15

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

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

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

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

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

알라딘 뷰어(PC)에서 차례가 표시되지 않는 이슈가 있습니다.

뷰어의 기능 제한이기 때문에 오류는 아닙니다. PC 뷰어만 확인을 했고, 모바일 뷰어는 확인하지 않았습니다.

하지만 차례가 보이지 않기 때문에 제작상의 문제로 생각할 수 있습니다.

알라딘 뷰어에서 차례가 표시되지 않는 것은 제작 문제가 아니라 뷰어에서 표시하지 않는 것이니 제작/검수 할 때 참고하시기 바랍니다.

 

전자책 편집시 생성한 차례는 아래와 같습니다.

총 4단계로 제목이 구분되어 있고, 각 단계 별로 상위 제목에 포함되어 있습니다.

 

알라딘 뷰어에서는 3단계 까지만 차례가 표시되고 4단계 이후는 나타나지 않습니다.

또한 2단계 까지만 들여쓰기로 단계를 구분하고 3단계는 2단계와 같은 선에 배치됩니다.

 

교보ebook은 제목을 모두 표시하지만 제목 단계 구분을 3단계 까지만 합니다.

4단계 부터는 3단계와 동일한 선에 표시합니다.

아마도 단계 구분을 위해 들여쓰기를 계속 하면 오른쪽 끝에서 제목이 잘리는 문제 때문에 이렇게 지정한 것 같네요. 

 

리디 뷰어는 4단계 까지 제목이 표시됩니다.

이 책이 4단계 까지만 있어 5단계 이후는 알 수 없습니다.

 

 

반응형
posted by 내.맘.대.로 2023. 10. 26. 14:47

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

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

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

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

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

배경이미지를 깔고 텍스트를 넣으니 글씨가 잘 보이지 않습니다.

그래서 배경색을 넣었더니 이번엔 배경이미지가 보이지 않아요.

그래서 배경색을 투명하게 넣고싶습니다.

이럴 때 쓰는 속성이 opacity입니다.

opacity를 넣으면 배경색 뒤로 배경이미지가 보여 좋긴 한데, 글자도 흐릿해지네요.

글자를 선명하게 넣고 싶은데 방법이 없는걸까요?

이럴 때 쓸 수 있는 속성이 rgba입니다.

rgba는 배경색을 투명하게 하면서 글자는 선명하게 유지할 수 있어요.

rgba와 opacity의 차이가 느껴지나요?

 

둘의 차이를 확실히 비교해 볼 수 있도록 opacity와 rgba를 반반씩 붙여봤어요.

왼쪽이 opacity, 오른쪽이 rgba입니다.

rgba의 글자가 확실히 선명하지요?

반응형
posted by 내.맘.대.로 2023. 10. 26. 14:35

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

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

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

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

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

책을 만들다 보면 여러개의 EPUB을 하나로 합쳐야 할 때가 있습니다.

3권 시리즈물인데 통합하여 한권으로 만드는 경우가 있지요.

이럴 때 이미 만들어 놓은 책을 하나로 합치는 방법이 있습니다.

 

EPUB파일의 압축을 푼 후 파일을 합하고 다시 압축할 수 있습니다.

이 방법을 사용하려면 EPUB의 구조를 잘 알아야 하고, OPF 파일을 제대로 이해하고 있어야 하지요.

자세한 방법은 여기 : https://www.epubguide.net/180

 

[TIP] 두개의 EPUB을 하나로 묶는 방법

‪#‎전자책‬ ‪#‎CSS‬ ‪#‎sigil‬‪#‎전자책_편집을_위한_HTML_CSS‬ 해시태그로 간단한 HTML CSS 강의를 시작합니다. 전자책 편집을 하는 분들에게 자주 받은 질문을 정리하려고 해요. 아주 쉬

www.epubguide.net

 

캘리버를 이용하면 이런 복잡한 과정 없이 보다 간단히 EPUB을 합칠 수 있습니다.

캘리버 EpubMerge라는 플러그인이 있어요.

이 플러그인을 설치하고

 

합칠 파일을 선택한 후

플러그인을 실행합니다.

책의 순서를 정하고

기본 메타 정보를 입력한 후 실행하면 끝.

작업이 끝날 때 까지 잠깐 기다리세요.

책에 따라 2분~3분, 길면 10분 정도 걸릴 수 있어요.

 

유통사에 등록하려면 몇가지 보정이 필요합니다. Sigil에서 병합한 파일을 불러온 후 수정을 하면 유통사에 등록이 가능해요.

반응형