EPUB（いーぱぶ、electronic publication）は、米国の電子書籍標準化団体の1つであるInternational Digital Publishing Forum（IDPF）が普及促進するオープンな電子書籍ファイルフォーマット規格。ネット上では「epub」「ePub」などと表記される場合もある。そのオープン性と単純さから、対応する電子書籍ハードウェアや電子書籍アプリケーションは多い。- Wikipediaより

EPUBファイル作成ツール

sigil・・・テキストベースの書籍向け。
ChainLP・・・コミックや雑誌など、画像をスキャンする書籍向け。

EPUBのファイル構造

EPUBの.zipファイルを解凍すると、こんな構成になっています。

mimetype

必須ファイル。zip圧縮されたePubであることを示す。

META-INF

必須フォルダ。container.xmlを含む。

– container.xml

必須ファイル。content.opfのファイル名とパスを指定。

content.opf

必須ファイル。ePubファイルを構成するファイルのパス

– toc.ncx

任意ファイル。epubファイルの目次

page001.xhtml

任意ファイル。コンテンツページ

style.css

任意ファイル。CSS フォント埋め込み指定

cover.jpg

任意ファイル。画像ファイル

XMLや使えるHTMLタグのフォーマットについてはこちらを参考に。

■Open Publication Structure (OPS) 2.0 v1.0
Open Publication Structure (OPS)日本語訳

■Open Packaging Format (OPF)
OPF 2.0 v1.0 日本語訳

■OEBPS Container Format (OCF) 1.0
OEBPS Container Format (OCF) 1.0

.epubファイルを作成する

上記のXHTMLや画像を編集したら、zipファイル化します。
しかし、「metafileがZIPファイルの最初のファイルで、しかも圧縮されてないことが条件。」
が、通常の圧縮方法ではできないので、cleanarchiverというツールを使ってzipファイルを作ります。
※gzipではなく、zip形式を選択します。

ファイル拡張子を「.zip」→「.epub」に変換します。

iBookにいれてみる。

iTunesのBookに、つくったepubを放り込んでみます。

iBook

epubコンテンツ

こんな形で、書籍形式になりました。

ePubの問題点

-Wikipediaより抜粋

仕様上の問題

縦組みを指定することはできない（縦中横も当然できない）。
圏点を指定することはできない。
割注（本文一行に小さな文字で二行詰め込まれた注）を指定することはできない。
漢文の返り点を指定することはできない。
これらの問題点は、EPUB 2.0.1のベースとなっているXHTML1.1とCSS2に起因する。現在、HTML5とCSS2.1及びCSS3の一部機能を用いてEPUB 3.0を制定する作業が行われており、2011年5月に完成を予定している。
縦組み、縦中横、圏点は、EPUB 3.0で対応することが予定されている。

実装上の問題

ルビの実装は知られていない。
禁則処理などの処理が実装されていないことがある。
正字（たとえば、「嘘」や「頬」や「湮」の正字）をうまく出せない実装がある。
────　のような直線を連続させたとき、この直線が繋がって見えない実装がある。
繰り返し記号（　く　を縦に細長くした記号：縦書きのみ）を表示できない実装がある。

これらの問題点は、閲覧ソフトが対応すれば解決する問題である。

ePub3.0のタイムライン

revision timeline and milestones

June 15 & 16, 2010: Kickoff F2F
June 24: Subgroup requirements: start
July 23: Subgroup requirements: submission to WG
August 27: Subgroup requirements: finalization
August 27: Subgroup implementation proposals: start
August 27: FWD production: start
October 18-20: San Francisco F2F
October 20: Subgroup implementation proposals for first draft: finalization
October 29: First Working Draft
November 30: Second Working Draft
December 23: Public Draft
January 28, 2011: Draft standard for trial use
May 15, 2011: final specification

所感

ePubは簡単なので、導入は簡単ですが、文書構造以外のことはあまりできないので、紙媒体に対してのアドバンテージは、販売PF以外あまりない印象です。
HTML5/CSS/JSがサポートされると、よりインタラクティブなコンテンツが出来ると思いますが、そうなると、ePubというフォーマットとはページの概念と、ビューワーとの相性ぐらいになって、全部Webコンテンツになるのかな、と感じました。

Comments: 0
Trackbacks: 0

PhoneGap – HTML/CSS/JavaScriptで、iPhoneやAndroidアプリを作るフレームワーク

2010-11-06 (土)
HTML/CSS | JavaScrpit | PhoneGap | iPhone
HTML5 | iPhone | JavaScript | PhoneGap | Webkit

■PhoneGapとは
HTML/CSS/JavaScriptで、iPhoneやAndroidアプリを作るフレームワーク。

1. PhoneGapをはじめる。

今回は、iPhoneアプリでのPhoneGapを試します。
Android編はこちらから。

公式サイトもしくは、GitHubから、PhoneGapフレームワークをダウンロードします。

PhoneGap

DLしてきたZipファイルを解凍し、iOSフォルダにある、
「PhoneGapLibInstaller.pkg」を開いて、PhoneGapフレームワークをインストールします。

PhoneGapTemplate

XCodeを起動して、新規プロジェクトを作成すると、
「PhoneGap」というテンプレートが追加されているので
それを、選択してプロジェクトを作成します。

PhoneGapIndex

「www」というフォルダに、index.htmlファイルが追加されています。
このhtmlに、記述したり、PhoneGap APIをJSから使用することで
iPhoneアプリを作成していきます。

PhoneGap – API Reference http://docs.phonegap.com/

Accelerometer
Camera
Contacts
Device
Events
Geolocation
Network
Notification

2. PhoneGap APIの加速度センサーを使ってみる。

Accelerometerを参考に、accelerometer.getCurrentAccelerationを使った加速度センサーのAPIを使ってみます。

前述のwwwフォルダの、index.htmlを記述します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
	<!-- Change this if you want to allow scaling -->
    <meta name="viewport" content="width=default-width; user-scalable=no" />

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">

    <title>PhoneGapTest</title>

	<!-- iPad/iPhone specific css below, add after your main css >
	<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />
	<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />
	-->
	<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
    <script type="text/javascript" charset="utf-8">

	// If you want to prevent dragging, uncomment this section
	/*
	function preventBehavior(e)
	{
      e.preventDefault();
    };
	document.addEventListener("touchmove", preventBehavior, false);
	*/

	// Wait for PhoneGap to load
	function onBodyLoad() {
		document.addEventListener("deviceready",onDeviceReady,false);
	}

	/* When this function is called, PhoneGap has been initialized and is ready to roll */
    // PhoneGap is ready
	//
	function onDeviceReady() {
		navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
	}

	// onSuccess: Get a snapshot of the current acceleration
	//
	function onSuccess(acceleration) {
        alert('Acceleration X: ' + acceleration.x + '\n' +
              'Acceleration Y: ' + acceleration.y + '\n' +
              'Acceleration Z: ' + acceleration.z + '\n' +
              'Timestamp: '      + acceleration.timestamp + '\n');
	}

	// onError: Failed to get the acceleration
	//
	function onError() {
		alert('onError!');
	}

  </script>
  </head>
  <body onload="onBodyLoad()">
  <!-- PhoneGap Test Code -->
  <h1>PhoneGap test.</h1>
  <p>getCurrentAcceleration</p>
  <!-- /PhoneGap Test Code -->
  </body>
</html>

通常のiPhoneアプリと同じように、XCodeから、ビルドします。

phoneGapAPIAccelr