"縦書き" または "縦書きePub" に関しては、このブログでも随分とこだわり、書いて来た。
だが、"縦書きePub" については、小手先の技を超えた "Web仕様の改変" でもない限り難しいだろうと薄々想定してきた。
そして、その "仕様の改変" が "EPUB 3 仕様" の策定というかたちで実現し、その中には "縦書きePub" という念願のテーマも含まれている。
まだまだ、多くの課題を残してはいるようだが、既に、積極的な開発プロジェクトも動き出しているようである。
そのうちの急先鋒として注目してみたいのは、 「イースト、最新の電子出版フォーマットEPUB3に対応したEPUBファイル生成クラウドサービス「epubpack」(イーパブパック)を世界に向けて無償公開」である。
その「epubpack」(イーパブパック)とは、"縦書き用の css が指定された HTML" をアップロードすれば、"縦書き EPUB" ファイルが自動生成されるというクラウドサービスのようなのである。
今回は、その "下準備" 作業として、先ずは "縦書き用の css が指定された HTML" 作成という、その素材作りを試してみることにした。
以下の shot はそのプロセスを表わしたものである。
"青空文庫" から素材としてダウンロードした "HTML（CSS付き）" のスクリプト
もちろん、元の CSS では「横書き」状態で表示される
スクリプトに「epubpack」提供の "basic_vertical.css" を追加した スクリプト
ブラウザ "Chrome" では瞬時に「縦書き」表示に切り替わる！
なお、"縦書き用の css が指定された HTML" を作成する作業は、以下の引用記事を参照のこと。また、必要なファイルのダウンロードは、それぞれのサイトで行ってください。
―――― ＜縦書きEPUBの作り方
■縦書きのHTMLコンテンツを作るには 縦書きでコンテンツを表示するためにはアップロードするHTMLに縦書き用のcssが指定されている必要があります。 以下は縦書き用のcssの指定の仕方の一例です。 なお、現在これで縦書き表示ができるブラウザは ・Chrome11 ・WebKit Nightly Build(http://nightly.webkit.org/) のみです。...... ＞（ 縦書きEPUBの作り方／epub3pack ）
それで、＜アップロードするHTMLに縦書き用のcssが指定される＞ようにするためには、以下の指示に従った作業をすることになる。
―――― ＜草枕を作ろう =縦書きHTML簡単作成ガイド= *
今年1月、縦書き表示の「草枕」を発表以来、多くの皆様から、どうしたら、縦書き表示ができるのか？ というお問い合わせをいただきました。 このサイトは、HTMLファイルの編集が出来る方を対象に、WebKit nightlybuildや、Chrome10で簡単に縦書き表示させる方法を説明しています。１．以下の「添付ファイル」のzipを解凍したCSSファイルを、皆様が用意されたHTMLと同じフォルダに置きます。
↓ これです。
（※ 省略。末尾の＜添付ファイル (1)＞のこと――引用者）２．HTMLファイル内に以下の形式でスタイルシートを指定します。
<link href="basic_vertical.css" rel="stylesheet" type="text/css" />
※HTMLファイルは、青空文庫(http://www.aozora.gr.jp/)のXHTMLファイルでもOK。<link XXXXX / />を上記に入れ替えてください。３．WebKitまたはChrome10を起動し、作られたHTMLファイルを読み込ませます。
コ・レ・ダ・ケ です。４．EPUBファイルにする場合は、上記のXHTMLをCSSをepubpackに入れてください。
※basic_vertical.css 内の -webkit- は、将来的に不要になります。
※上級者向けに、「EPUB3コンテスト」も開催しています。 チャレンジしてみてください。添付ファイル (1)
（ 草枕を作ろう =縦書きHTML簡単作成ガイド= * ／epub cafe 電子出版環境整備事業 ）
basic_vertical.css - 2011/05/23 20:39、Kazuo Shimokawa (バージョン 1) 1KB ダウンロード＞
この手順で出来た＜縦書きのHTMLコンテンツ＞が "縦書き" として表示されるのは今のところ＜WebKitまたはChrome10＞だけであるため、今ひとつ残念な気もするが、他のブラウザも直に追い付くに違いない...... (2011.08.16）
コメントする