Jak vzniká ebook „Vzhůru do CSS3“?
Dnes vám nabídneme technické detaily z tvorby ebooků. Třeba vás inspirujeme k přípravě vlastního.
Článek původně vyšel na medium.com.
Už je to rok, co vyšel můj ebook o technologiích dnešní webové kodéřiny. Letos jsem také vydal jeho anglickou verzi — „CSS Mine“.
Nejdřív k formátům, ve kterých se e-knihy vydávají: potřebujete hlavně ePUB pro iOS nebo Android a MOBI pro Amazon Kindle čtečky. Volitelně pak PDF…
Formáty elektronické: PDF musí být
PDF… PDF mě překvapilo! V prvé řadě náročností přípravy, v druhé řadě zájmem ze strany čtenářů.
Oba ebook formáty (MOBI a ePUB) vlastně představují jen specifičtější odrůdu webových technologií HTML a CSS. Jde tedy o volný proud stylovaného textového obsahu.
PDF je formát pevný; má stránky, hlavičky, patičky a podobné srandičky. Ty se v PDF neudělají samy jako v ebook formátech. A musí je do PDF přidat kdo? Ano, my! Proto příprava PDF obnáší daleko, daleko více práce než je tomu u ePUB a MOBI. Pokud s ebooky začínáte, PDF odkládejte nebo prostě vůbec nedělejte.
Mezi webovými vývojáři je o něj ale zájem. Přesné statistiky zatím nemám, ale většina dialogů se čtenáři se točí právě kolem PDF verze.
ePUB a MOBI je určitě dobré mít. Mezi mými čtenáři je o ně menší zájem než o PDF, ale jejich uživatelská báze je v mé cílové skupině nezanedbatelná. A rozhodně poroste, protože oproti PDF mají své výhody.
ePUB je kamarád. MOBI mně nevadí, ale jeho ladění pro všechny možné Kindle čtečky je tak trochu jako když jsem kódoval své první weby koncem devadesátých let. A kodéřina tehdy byla dřina!
Psaní: díky za Markdown!
Texty ukládám v Markdownu Extra. Zkusil jsem hodně možností, ale Markdown vede. Je jednoduchý, široce uznávaný za standard a existuje pro něj řada nástrojů.
Editor Mou. Vzhled náhledu je upravený tak, aby se podobal tomu, co uvidíte na webu nebo v eboocích.
Jako psací editor primárně používám Mou, občas jen Sublime Text s rozšířením Markdown Preview. V případě, že na textu spolupracuji s někým jiným, vezmeme do party Google dokumenty. Odtud jde ale draft textu opět do Markdownu.
Na korekturách nešetřete
Pokud chcete peníze na přípravu ebooku investovat jen do jedné věci, investujte do korektora. Správná gramatika a stylistika je něco, na čem nelze šetřit. Lidé jsou na chyby citliví, zdržují je od čtení a jejich výskyt zbytečně zpochybňuje vaše odborné kvality. Až budete korektora hledat, doporučuji Petra Behúna z Proofreading.cz.
Generování: díky za Pandoc!
Některé texty publikuji na webu a zároveň v ebooku. Než se z Markdown holobrádka stane dospělý článek, jeho HTML kód prochází transformacemi:
Takhle vypadá hlavní zdroják ebooku. Funkci transform() vidět nechcete. Věřte mi!
Transformace obvykle k částem článků přidává nějaký HTML kód nebo naopak odstraňuje text, který je vhodný jen pro zveřejnění na webu. Z Mardown zdrojáků se díky PHP transformacím stane HTML soubor s kompletním obsahem ebooku.
Pak přichází Pandoc, výborný meziformátový převodník. V prvé řadě z HTML souboru generuji ePUB. Tenhle formát je dost dobrý začátek, protože s ním moc problémů nebývá a slouží jako zdroj pro ostatní:
pandoc -o vdcss3.epub vdcss3.html src/isbn-epub.html — epub-metadata=src/metadata.xml — epub-stylesheet=../assets/dist/epub.css — epub-cover-image=src/vdcss3-cover.jpg — toc — toc-depth=3
Příkaz vypadá složitě, že? V zásadě ale kromě převodu z HTML do ePUB přidává jen soubor s ISBN číslem, pak metadata s názvem atd., CSS styly, titulní obrázek a nakonec sám vygeneruje obsah (TOC).
První ebook je na světě. Říkal jsem, že ePUB a Pandoc jsou prima? Proto si i MOBI verzi připravuji v ePUB:
pandoc -o vdcss3-for-mobi.epub vdcss3.html src/isbn-mobi.html — epub-metadata=src/metadata.xml — epub-stylesheet=../assets/dist/mobi.css — epub-cover-image=src/vdcss3-cover.jpg — toc — toc-depth=3
Pro převod z ePUB do MOBI pak používám Kindlegen:
kindlegen -o vdcss3.mobi vdcss3-for-mobi.epub
Máme ePUB a MOBI.
Teď ještě to zpropadené PDF
Po zkoušení všeho možného jsem skončil u mPDF, knihovny pro generování PDF z HTML pomocí PHP. (Aby těch zkratek nebylo málo.)
Skript, který PDF vytvoří, má asi 200 řádek, za každou jsou ale hodiny zkoušení a experimentování. Asi jako když se kodér pustí do programování ebooku. Nakonec to PDF ale nevypadá špatně a hlavně je tam potenciál, aby vypadalo ještě lépe.
PDF, ty potvoro jedna!
Prodej a distribuce musí být automatizované
Od doby, co vyšel, si prakticky každý den někdo ebook koupí.
Umíte si představit, že objednávky vyřizujete ručně? Nevím jak vy, já radši stavím hrady z Dupla.
Samozřejmě, že to musí být automatizované. Po vyplnění objednávky se napojíme na Fakturoid, prohodíme přes API pár slov a chvíli se o vás stará on. Vystaví proforma fakturu. Nabídne všechny možné platby včetně platebních karet. Jakmile zjistí, že se platba provedla, dialog se zákazníkem přesměrujeme na FetchApp, přes který se odehrává finální distribuce souborů.
…a po měsíce trvajícím porodu pak íbůček na obrázku vypadá takhle nevinně.
Závěr
To je zhruba vše. Samozřejmě jsem vynechával detaily, ve kterých je zašitá nejedna zajímavá zkušenost. Pokud by vás zajímaly, neváhejte napsat do komentářů nebo na martin@vzhurudolu.cz.
Tak přátelé, už běžíte napsat vlastní ebook? Podívejte se ještě jak jej dělal Michal Kašpárek nebo třeba Marek Prokop. Můžete si také přečíst článek o „byznysovém“ pozadí práce na mém ebooku.
Martin Michálek
Nezávislý specialista na webový frontend. O responzivním designu, HTML5, CSS3 a dalších tématech píše na blogu Vzhůru dolů nebo v ebooku. Pořádá školení. Na Twitteru je jako @machal.
Na korekturách nešetřete a proto je v článku:
..MOBI m*(N)*ě nevadí.. ? :)
vyzkousej vygenerovat pdf pomoci nodejs (https://github.com/amir20/phantomjs-node) oproti mpdf je to uplne jinde.
Díky! Myslíš http://pdfkit.org/? Mohl bys být konkrétnější?
Já se samozřejmě po Node řešení sháněl, ale mPDF mě nakonec vyšel jako vítěz, protože umí víc. Takže budu rád za každý konkrétní příklad nebo odkaz na článek.
Jelikoz mam vsechny projekty na takovych serverech ke kterym mam plny pristup tak pouzivam wkhtmltopdf – PDF vypadaji stejne jako v Chrome :-)
No právě, že to vypadá stejně jako v Chrome.
Pro generování pořádných PDF z HTML+CSS jsou mnohem lepší nástroje, např. https://www.antennahouse.com/antenna1/formatter/
https://www.princexml.com/
http://www.pdfreactor.com/
Bohužel zatím neexistuje nic pořádného zdarma.
Proč radši nepoužít AsciiDoc?
http://asciidoctor.org/docs/what-is-asciidoc/
http://asciidoctor.org/docs/editing-asciidoc-with-live-preview/
Tady jsem zkusil a zavrhl. On je to parádní a hotový, ale robustní formát. Vzhledem ke svému workflow (obsah někdy pro blog, někdy pro ebook a někdy pro obojí; specifický obsah…) bych z něj tolik nevyužil. Křivka učení je vysoká a jako lepší mě přišlo vytvářet postupně něco jako vlastní formát nad Markdownem.
„Proti gustu žádný dišputáát“, ale vytáhnout si z Asciidocu těch pár věcí co Markdown umí stojí pár minut a rozdíly jsou zanedbatelné. Křivka učení tedy prakticky stejně nízká jako u Markdownu a zůstává výhoda možnosti osvojovat si v budoucnosti další věci, které mám v Asciidoc připravené, bez nutnosti „vynalézat kolo“ v podobě „vlastního formátu“
.
věci, které mám v Asciidoc připravené, bez nutnosti „vynalézat kolo“ v podobě „vlastního formátu“
Problém je v tom co zmiňuji v předchozím komentáři – více ve workflow než ve formátu. Asciidoc mě například nenabídne syntaxi pro blok textu zveřejněný jen na blogu nebo naopak jen v ebooku.
Vynalézat kolo v podobě vlastního formátu je to poslední co chci, věřte mi. :)
Pro méně technicky zdatné by mohla být dobrá alternativa Gitbook. Ať už jen jako toolchain nebo celá platforma. Zdrojový text v markdownu, výstupy do běžných e-book formátů, PDF, HTML. Přizpůsobení pluginy i vlastním CSS a JS.
Tohle je ale super! Z nějakých důvodů mě to uniklo a asi by mi i zpočátku stačilo. Dneska už je to moje workflow srovnatelné.
Dík moc za tip. Určitě pomůže ostatním.
Na psaní a rovnou i prodávání knížek přes GIT je skvělý Leanpub – http://leanpub.com.
Skvělou featurou, kterou se liší od ostatních, je „feedback as you write“ od pár čtenářů. Kniha je tedy od začátku směřovaná ke kvalitě.
Pěkný, díky!
Zaujalo mě to postavení jednoduchého eshopu pomocí Fakturoidu. Zveřejníš zdrojáky?
Já bych radši uvítal rovnou článek 8-)
Eshop bych tomu neříkal. :-) Spíše platební proces implementovaný pomocí Fakturoidu.
Z mého pohledu jsem napsal vše co vím. Kód je součástí zdrojáku Vzhůru dolů, to teď ven pouštět nechci. Kolega, programátor, Přemek Koch s tím má ale zkušenosti, třeba by se mu chtělo něco napsat. ;)