2010年頃にたくさん電子書籍の記事をたくさん書いていましたが、久々に電子書籍の記事です。noteも使ったのですが、markdownが利用できません。現在はVS Codeのmarkdownの環境に完全に移行しています。
markdownで技術書(同人誌)を執筆する方法は、実に多彩であり、普段はあんま迷わないのですけど、今回は悩んで軽くいろいろ使ってみることに。せっかく調べたので、覚書程度にまとめておきます。最終的に採用したのは最後のものになります。
目次
【デザイナー/一般人向け】boothで販売する技術書典の同人誌・電子書籍の作り方おすすめ
クリスタ(ePub、Mobi、Mac、Win、iPad以外は有料買取、漫画作成)
漫画制作ソフトの定番CLIP STUDIO PAINTです。漫画家さんはこれ1本ですむため便利でしょう。デザイナーやエンジニアが持っていても電子書籍の表紙作成やSVGデータ生成などに使えるのでわりと便利なソフトです。
クリスタで自動生成した電子書籍に目次を付ける方法
・生成epubの拡張子を.zipに変える
・zipを解凍して出てきたnavigation-documents.xhtmlの中身を書き直す
・「item」「META-INF」フォルダ、「minetype」ファイルをzip
・zipファイルの拡張子を.epubに変える
面倒くさい……#創作同人電子書籍 pic.twitter.com/ujYjJnenvp— クロ僕屋 (@kurobokuya) June 21, 2019
ただ、クリスタは目次の作成がデメリットのようです。
exじゃないとダメなんですね。ProとEXの違いはこちらの記事です。
Adobe InDesign(ePUB、html、PDF有料サブスクリプション)
大手Adobeの出版ソフトといえばAdobe InDesignです。ePUB、html、PDFのエクスポートに対応しています。MacとWindowsどちらでも大丈夫です。
安く入手する方法はこちらです。
一太郎(ePUB、PDf、html、Windows、買い切り)
一太郎はWindowsのみです。わりと評判がよいソフトを作っているジャストシステムさんが作っています。
ポチップ
【エンジニア・githubで管理してい人向け】boothで販売する技術書典の同人誌・電子書籍の作り方おすすめ
まず、ざっくりとぐぐったあと、Twiterrでも情報収集しました。最初は簡単にすませたかったため、PDFを作成できるものを探しましたが、だんだんと組版の欲求がでてきてそこまでやることにしました。
Pandoc を描写エンジンに設定できる VSCode 拡張、Markdown Preview Enhanced、まじ最高なんだけど 80 万ダウンロードのそこそこメジャーなプロダクトなんだから、アイコンくらい設定して。https://t.co/pKg55kqBTD
— 大岡由佳『りあクト! 第3版』Booth/Amazonで近日刊行 (@oukayuka) February 27, 2020
これで全出版プラットフォームいけそうな気がする。
— 大岡由佳『りあクト! 第3.1版』BOOTHで販売中 (@oukayuka) January 5, 2020
① Pandocとpandoc-crossrefプラグインによる拡張Markdownで原稿を書く
② ①をePubで出力しSigilで調整して、楽天KoboとiBooks Store に
③ ②をkindlegenで.mobiに変換してAmazon KDPに
④ ①を.docxで出力、Wordで調整してPDFにして紙の本に
1回docsに変換するのですね。PDFの直変換がぱっとしないときはよいアイデアという気がします。
Markdown Preview Enhanced で Pandoc をパーサーにして青空文庫ルビフィルターをかまし、Solarized Light テーマに合わせてスタイルをカスタマイズ。本文フォントはしっぽり明朝、見出しはヒラギノ角ゴ Pro。
これで ePub も docx も、なんなら PDF もそのまま作れる。これぞ最強の執筆環境だ！ pic.twitter.com/rkw6ajSslk— 大岡由佳『りあクト! 第3版』Booth/Amazonで近日刊行 (@oukayuka) January 12, 2020
参考までに、自分がまとめてる Pandoc 使い方メモです。https://t.co/QkHPLn3HFZ
— 大岡由佳『りあクト! 第3版』Booth/Amazonで近日刊行 (@oukayuka) January 13, 2020
いろいろと参考になりました。
技術同人誌の入稿用PDF作成（組版）については、個人的に「山の登山ルート」がいくつかあるような見方をしている。
– Re:VIEW→（LaTeX/CSS組版）→PDF
– （Markdown→）HTML/CSS→Vivliostyle→PDF（→入稿可能なPDF）
– Markdown→Pandoc→（LaTeX/Word/CSS組版）→PDF
– Word/PowerPoint→PDF— 藤原惟📕 (@skyy_writing) September 1, 2019
Re:VIEW→LaTeX→PDF
HTML+CSS→Vivliostyle→PDF
Markdown→PDF
Asciidoc→PDFお好きなものをお選びください
— なのなの (@nano2_aloerina) December 4, 2018
いろいろとありますね。
EPUB作る人は少数でほとんどは電子版もPDF。組版は粗くてもみんなそこまで気にしない。Re:ViewやSphinx、Pandocなど使われている。TechBoosterさんがテンプレートを出している関係で技術書典ではRe:View使用者が多い。 #jepa
— Jun Tajima (@JunTajima) May 29, 2019
組版はほどほどでいいですかね。ただ、デザインはできるとよいです。個人的にはCSS組版に流れ着きます。
LaTeXとCSS組版の比較
・装飾に強い
・周辺ツールの充実(例えば.mdから本文を生成するツールの選択肢はmd→texよりmd→htmlの方がずっと広い)
・旅行雑誌みたいに文章が並ぶことがメインコンテンツでない場合とかの対応性
あたりになるかと思います— ライアーノーズ (@liarnose) November 20, 2019
夏コミ新刊、mdである程度書いてからRe:VIEW 3.0でレイアウトしたのだけど、システムとしてはありがたかった。でも細部をLaTeXで整えるのが大変すぎたのでCSS組版どうかなーと思ったが、まだやっぱり大変さはありそうという感じだった。
結局、自分が使える知識・技術とのトレードオフになりそう— えすじ (@esuji) August 31, 2019
VS Codeのmarkdownで技術書(同人誌)を執筆する方法一覧
Markdown-pdf
この拡張は簡単だったため、1番最初に試しました。
Markdown Preview Enhanced
pdfやhtmlのエクスポート、pandocについてはこちらにまとめなおしました。
その他のpdf変換
他にもいろいろとあるみたいですね。ただ書籍用というより、ただPDFを作成するものが多いです。
md-to-pdfは複数mdに対応しているよう。
FlightBook
(19) FlightBooks🐤MarkdownでPDFが作れるさん (@FlightBooksJP) / Twitter
FlightBooksという楽にPDFが作成できるサービスのようです。
未使用のため、ざっくりとしかとらえていません。もっといいところもあるかもしれません。こちらは同人誌がでていますね。
gitbook
未使用で詳しく調べていないため、紹介だけです。複数のmdは対応しているようだが、webドキュメントメインでPDFの作成はやや思い通りにならないところがあるよう。
ローカルは問題ないよう。
GitBookをローカルで試してるですが、良すぎて鼻血でそう。。
— ケモケモ@「黒菜んダッシュ」鋭意制作中 (@t2wonderland) November 14, 2018
PDF作成には電子書籍元年の頃?からあるcalibreを使う模様。
ただ、gitbook-cliは開発が止まっている模様。
OSSは停止し、有料化するようです。
Re:VIEW
詳細はこちらの記事に移動しました。
VsCodeの技術同人誌のおすすめは?
Pandoc(htmlとePUB)
(追記)PDFを作る際に辞めにしたのですが、HtmlとePUBはいろいろと試した結果、Pacdocのエクスポート結果が気に入って使うことにしました。日本語情報も豊富です。
Markdown Preview Enhancedをプレビュー用に使っています。詳細はこちらです。
PDFは今のところ、Vivliostyleを使っています。Pandocをインストールして途中までやりましたが、途中でCSS組版に興味がうつり、Vivliostyleに切り替えました。
Pandocはmunepiさんのようなプロフェッショナルと組めば十分商用に耐える品質の制作ができることがわかったのは大きな収穫でした。Pandocはfilterが強力で処理の柔軟性が高く、PC系の書籍編集がほしい機能はだいたいあとからつけられそうです。
— Daiki Noda（技術評論社雑誌編集部） (@nodawep) March 4, 2021
ただPDFもpandocも商用利用にも使われているみたいですね。
Vivliostyle(PDF)
もちろん、各々が触っている言語などにより導入しやすさも変わるでしょうが、個人的にVivliostyleを採用しました。採用理由は以下のとおりです。
markdown→html－[vivliostyle]→pdfをやる時のコツですが md→htmlはpandoc一択です –section-divsとヘッダにclassタグを設定できることを利用するとmdの特定の文法に場所によって違うcssを当てられるってのがだいじです
— ライアーノーズ (@liarnose) May 1, 2016
以前はmd → Html → PDFを生成する流れでやっていたため、少々面倒だったのですが、Create Bookができたのち、mdをpdfにダイレクトに変換できるようになりました。pandocもインストールしたけどいらなく。
Vivliostyleの商用利用は?
ライセンス形態が気になりました。
AGPL ライセンスであることによって、ソースコードを改変して、別製品にしたりWebサービスに埋め込む場合には、改変したソースコードを開示する義務がありますが、Vivliostyle をそのまま利用して、あるいは、Fidus Writer など、Vivliostyle を利用している別のサービスを利用して、商用の書籍を制作することに何ら問題はなく、制限なしで Vivliostyle を印刷やPDF生成に使用することができます。
https://vivliostyle.org/ja/blog/2018/11/12/interview-by-fiduswriter/
Vivliostyleの環境構築で混乱
初回インストールした際に、過去情報もあって若干混乱しました。おそらく下記のように進化しています。
viola-savepdf
↓
vivliostyle-savepdf
vivliostyle-cli
npm install -g @vivliostyle/cli
そうか、viola-savepdf の後継が vivliostyle-savepdf なのか。#Vivliostyle
— 某ZR（ざんねん🙃） (@zr_tex8r) August 31, 2019
その後、create bookができたようです。今ならcreate bookを調べてインストールです。
Vivliostyleの使い方
簡単に書いてみました。
puppeteerとは
puppeteerという言葉がよくでてきます。
PuppeteerとはGoogleのメンバーが開発したOSSで、ChromeやChromium(vivliostyleのプレビューで使われている)のNodeライブラリです。
markdown-pdfの公式ダウンロード、Markdown Preview EnhancedのPDF変換時、そしてvivliostyleも。
現時点の CLI は CSS 組版と PDF 出力を実行するプラットフォームとして Chromium を利用している。これは puppeteer 経由で操作して をインストールすると puppeteer が定義したバージョンの Chromium を一緒にダウンロードする仕組みだ。
https://akabeko.me/blog/2020/11/vivliostyle/
つまり大元はみんな一緒のようです！やれることは似通ってくるかもしれません。
markdown-pdfやMarkdown Preview Enhancedとvivliostyleの違い
vivliostyleは本を作ることを目指しています。
- １番の違いに感じるのは、複数のmdファイルをPDF化できることです。
- 章分けなどヘッダーの設定が充実しています(いまひとつのところもあります)
- プレビュー機能もあります(これはMarkdown Preview Enhancedでもできますけど)
Font AwesomeのPDF埋め込みはライセンス的に可能?
ちょっと気になったので。ここしか記載がないっぽいですね。可能ぽい。
Embed FA Free in documents. (e.g. .pdf, .doc, etc.)
https://fontawesome.com/license/free
stackoverflowにも質問がありました。参考になるかと。
技術同人誌の表紙の作り方
自分で描けるならクリスタがおすすめです。Adobeと違って買い切りなのでたまに描く人におすすめです。
外注化するならココナラやsukimaでしょうか。
ご参考になれば幸いです。
コメント