shape-outside와 몇가지 재미있는 샘플

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

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에서도 이렇게 뒤집었습니다.

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

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

​

​

​

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

​

​

​

이런 것도 있습니다.

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

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

 

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

​

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

​

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

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

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

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

​

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

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

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

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