Zbudowany z płynnego kodu **format epub** zachowuje się jak woda.
Wrzucasz swojego nowego, wygenerowanego e-booka do programu Apple Books na nowoczesnym iMacu. Czcionki wyświetlają się zachwycająco, marginesy są równe, widać piękne, delikatne cienie wokół krawędzi obrazków. Dumny z sukcesu przesyłasz ten sam plik znajomemu na jego trzyletni czytnik z e-papierem. Znajomy odpowiada: „Stary, nie da się tego czytać – tekst zlewa się ze zdjęciami, tło jest szare i nie ma żadnych cieni”. Dlaczego tak się stało?
To brutalna prawda o formatach DTP: podczas gdy PDF to zbrojony beton gwarantujący stały wygląd w każdym miejscu we wszechświecie, e-book w formacie EPUB to płynąca woda, dla której kształtem jest każde z setek różniących się urządzeń. Zrozumienie, czym jest e-book typu Reflowable, jest obowiązkiem profesjonalnego składacza tekstu.
Wojna na silniki i ograniczanie wodotrysków
E-book nie posiada stałych gabarytów ani sztywnego łamania stron. Zdania będą samoistnie skracać się i zwężać, aby w pełni dopasować się do węższego wymiaru telefonu lub szerszej krawędzi poziomego tabletu.
Największą zmorą są same silniki renderujące producentów (odpowiedniki przeglądarek internetowych, zainstalowane głęboko w oprogramowaniu czytnika):
- Platforma Apple (WebKit): Jeśli Twój e-book otworzy się na aplikacji iBooks, zaprezentuje wszystko. Ten nowoczesny silnik udźwignie każdy rodzaj zaawansowanego kodu CSS – przeźroczystości, efekty cieni 3D pod obrazkami czy zaimportowane, unikatowe fonty z Google Fonts.
- Ekosystem Kindle i PocketBook: Czytniki bazujące na oszczędnym e-papierze celowo mają zablokowane renderowanie „bajerów” CSS. Zaawansowane marginesy czy wybitnie niestandardowe ustawienia zostaną automatycznie wycięte przez oprogramowanie przed pokazaniem ich na ekranie użytkownika po to, by nie spowalniać odświeżania matrycy.
Media Queries: Ostateczna adaptacja książki do rozdzielczości
Aby zapanować nad książką i mimo wszystkich pułapek sprawić, by dobrze wyglądała absolutnie wszędzie, inżynierowie DTP wykorzystują reguły Media Queries. Są to warunki programistyczne zakodowane wewnątrz pliku CSS e-booka, nakazujące mu zmianę reguł, kiedy wykryje odpowiednią matrycę.
Zamiast ustawiać margines tekstu na sztywno:
/* Margines 30 pikseli - na tablecie spoko, ale na telefonie zabierze 60% ekranu! */
p {
margin: 30px;
}
/* Wstawiamy zapytanie Media Query - reguła dotyczy ekranów węższych niż 600px */
@media screen and (max-width: 600px) {
p {
margin: 5px; /* Minimalistyczny, nieinwazyjny odstęp dla smartfona */
}
}
Dzięki temu jednemu kawałkowi kodu, e-book sam rozpozna, czy „znalazł” się aktualnie w tablecie iPADzie (i zaaplikuje ładne 30-pikselowe marginesy od krawędzi), czy został uwięziony na wąskim, 5-calowym ekranie dotykowym (i natychmiast zrzuci swoje światło do skromnych 5 pikseli, udostępniając czytelnikowi maksymalną powierzchnię czytelniczą).
Uważaj na Dark Mode
Nigdy, przenigdy nie ustawiaj „na twardo” parametrów tekstu takich jak color: #000000; (czarny font). W dobie tzw. trybu ciemnego (Dark Mode), użytkownik przełączający ekran na nocny tryb oczekuje, że ekran zmieni się na czarny tło, a tekst odwróci się na biały. Wymuszenie czarnego fontu w kodzie CSS wygeneruje użytkownikowi czarny font na czarnym tle niszcząc w 100% doświadczenie czytelnicze. Pozwól czytnikowi nadpisać Twoje bazowe wartości i stawiaj treść przed nadmierną formą!
Chcesz poznać pełny proces profesjonalnego przygotowania e-booka? Przeczytaj nasz Kompletny przewodnik po konwersji EPUB (Word do EPUB).
