주요 유통사 뷰어 표현성 비교
background-color |
작년 9월(http://epubguide.net/241)부터 틈날 때마다 조금씩 업데이트 하던건데 간만에 업데이트 해서 공유합니다.
표현성 비교가 왜 필요한지 모르는 분들을 위해 예를 하나 보여드릴게요.
아래 이미지만 봐도 감이 딱! 하고 오는 분이 계실거고, 아래 이미지의 의미가 무엇인지 파악이 안되는 분도 계실거예요.
전자책을 제작하며 표현성 문제를 경험하신 분들이라면 설명하지 않아도 이해하실거예요.
EPUB은 표준입니다. 적합성에 문제가 없는 EPUB은 어떤 EPUB 뷰어에서도 잘 보여요.
EPUB 표준문서에는 뷰어가 지켜야 하는 규칙도 들어있습니다. 이 규칙을 잘 지키면 표준 EPUB 뷰어예요.
만약 뷰어가 지켜야 하는 규칙이 10개인데 어떤 뷰어는 자체적인 규칙을 포함해 기본규칙10개 + 유통사 규칙 5개를 넣는다면?
이 역시 표준 뷰어입니다.
그리고, 이 부분이 표현성에서 중요한데,
IDPF 표준문서에 규칙을 지켜야 한다는 내용은 있지만 '어떻게' 지켜야 하는지에 대한 설명은 없습니다.
그래서 규칙1을 지킨다 해도 뷰어마다 규칙1이 적용되는 방식은 제각각일 수 있어요.
여기서 표현성 문제가 생깁니다.
표현성 비교표에서 body > background-color 항목을 보고 아래 이미지를 보세요.
모두 같은 EPUB입니다. 속성은 단 하나,
<body style="background-color : red;">
교보 뷰어에서는 화면 전체가 빨간색으로 표현됩니다.
알라딘 뷰어 역시 화면 전체가 빨간색으로 표현됩니다.
리디 뷰어(캡쳐 방지때문에 일부만 보여요)는 뷰어의 자체 테두리가 있어 테두리 안쪽만 빨간색이 됩니다.
iBooks는 뷰어의 자체 테두리도 있고, 높이도 본문 내용에 따라 달라집니다.
캘리버는 교보, 알라딘처럼 전체가 빨간색입니다.
뷰어 모두 표준을 지켰습니다. 어떤게 더 좋다고 말 할 수도 없습니다. 각각 장단점이 있어요.
스타일은 하나인데 표준을 지킨 뷰어에서 같은 스타일이 조금씩 다르게 보입니다.
전자책 제작자라면 뷰어에서 스타일이 어떤 형태로 보이는지 잘 알아야되요.
그렇지 않으면 편집 프로그램에서 의도했던 대로 보이는데 유통사 뷰어에서는 다르게 표현될 수 있습니다.
주요 유통사 표현성 비교는
뷰어의 정책에 따라 큰 차이가 날 수 있는 CSS 스타일이나
전자책 편집에 활용할 만한 CSS3 스타일이
각 유통사 뷰어에서 어떻게 보이는지를 정리한 파일입니다.
CSS 외에도 편집에 쓰이는 기술들 중 뷰어에 따라 차이가 나는 것들도 포함되어 있습니다.
전자책 뷰어는 수시로 업데이트 되기 때문에 테스트 날짜를 표시했습니다.
테스트한 날짜에는 문제가 있는데 업데이트 해서 해결이 됐을 수도 있으니, 잘못된 부분 발견하시면 알려주세요.
그리고 전자책 만들다 표현성 문제가 있는 태그를 발견하시면 공유해주세요. 혼자서는 테스트 하기 어렵네요 ^^;