« Webアプリケーションのセキュリティ対策まとめ
nanocでブログをEPUB3電子書籍化する »

EPUB3の作り方

Created at: 2012-08-18 | Tags:

EPUB3はIDPF(国際電子出版協会)が制定している電子書籍のフォーマットです。

EPUB3ファイル(.epub)の実態はXHTML、CSS、画像などがzipでパッケージングされたものです。このため、ウェブ制作の知識があれば比較的簡単に電子書籍を作ることができます。

ここでは、テキストエディタとzip圧縮ツールを使って、ごく基本的なEPUB3電子書籍を作る方法を紹介します。

EPUB3のディレクトリ構造

EPUB3の基本的なディレクトリ構造は以下のとおりです。(日本語名の部分は適宜変更する前提です。)

ドキュメントルート
    mimetype              : .epubファイルのMIMEタイプを示す(必須)
    META-INF/
        container.xml     : .opfの格納されている場所を示す(必須)
    フォルダ名/
        ファイル名.opf    : 書誌情報、全ファイルの場所、掲載順を示す(必須)
        nav.xhtml         : 目次(必須)
        cover.xhtml       : 表紙
        コンテンツ1.xhtml : コンテンツドキュメント
        コンテンツ2.xhtml : コンテンツドキュメント
        images/
            画像ファイル名.jpg
        css/
            style.css     : スタイルシート

「フォルダ名」の部分は自由に設定できますが、EPUB2から慣例的に「OEBPS」が使用されることが多いようです。

EPUB3の構成ファイル

それでは、各ファイルの内容を確認していきましょう。なお、日本語を含むファイルは全てUTF-8で保存する必要があります。

mimetype

.epubファイルのMIMEタイプを示す必須ファイルです。下記1行を記入します。

application/epub+zip

META-INF/container.xml

パッケージドキュメント(.opf)の格納されている場所を示す必須ファイルです。full-pathの値を構成に合わせて変更します。

<?xml version="1.0"?>
<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">
    <rootfiles>
        <rootfile full-path="OEBPS/ファイル名.opf" media-type="application/oebps-package+xml" />
    </rootfiles>
</container>

OEBPS/ファイル名.opf

書籍の情報をまとめたパッケージドキュメントです。「書誌情報」、「全ファイルの場所」、「コンテンツの掲載順」が含まれ、EPUB3の根幹となるファイルです。

<?xml version="1.0"?>
<package version="3.0" xmlns="http://www.idpf.org/2007/opf" unique-identifier="BookID">
    
    <metadata xmlns:dc="http://purl.org/dc/elements/1.1/">
        
        <dc:title>書誌タイトル</dc:title>
        <dc:identifier id="BookID">識別子(任意フォーマット)</dc:identifier>
        <dc:language>ja</dc:language>
        <meta property="dcterms:modified">YYYY-MM-DDT12:00:00Z</meta>
        
        <dc:date>YYYY-MM-DDT12:00:00Z</dc:date>
        <dc:creator>著者名</dc:creator>
        <dc:publisher>発行元</dc:publisher>
    </metadata>
    
    <manifest>
        
        <item id="toc" properties="nav" href="nav.xhtml" media-type="application/xhtml+xml" />
        
        <item id="coverpage" href="cover.xhtml" media-type="application/xhtml+xml" />
        <item id="stylesheet" href="css/style.css" media-type="text/css" />
        <item id="コンテンツ1" href="コンテンツ1.xhtml" media-type="application/xhtml+xml" />
        <item id="コンテンツ2" href="コンテンツ2.xhtml" media-type="application/xhtml+xml" />
    </manifest>
    
    <spine page-progression-direction="ltr">
        <itemref idref="coverpage" linear="yes" />
        <itemref idref="toc" linear="yes" />
        <itemref idref="コンテンツ1" linear="yes" />
        <itemref idref="コンテンツ2" linear="yes" />
    </spine>
</package>

OEBPS/nav.xhtml

目次として表示されるページです。HTML5で記述します。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
    <head>
        <title></title>
    </head>
    <body>
        <section class="frontmatter TableOfContents">
            <nav epub:type="toc" id="toc">
                <h1>目次</h1>
                <ol>
                    <li><a href="コンテンツ1.xhtml">コンテンツタイトル1</a></li>
                    <li><a href="コンテンツ2.xhtml">コンテンツタイトル2</a></li>
                </ol>
            </nav>
        </section>
    </body>
</html>

OEBPS/cover.xhtml

表紙として表示されるページです。HTML5で記述します。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
    <head></head>
    <body>
        <h1>書籍タイトル</h1>
        <h2>サブタイトル</h2>
        <p>著者名</p>
    </body>
</html>

OEBPS/コンテンツ1.xhtml

書籍の本文となるコンテンツです。HTML5で記述します。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
    <head>
        <title>コンテンツタイトル</title>
        <link rel="stylesheet" href="css/style.css" type="text/css" />
    </head>
    <body>
        <h1>コンテンツタイトル</h1>
        <p>本文</p>
    </body>
</html>

OEBPS/css/style.css

スタイルシートです。以下はフォントを指定する例です。

body {
    /* ゴシック体 */
    font-family: sans-serif;
}

EPUB3のパッケージング

構成ファイルが用意できたら、.epubとしてパッケージングします。

.epubファイルがzip圧縮されたファイルであるということは有名ですが、実のところ単純に全てのファイルをzip圧縮しただけだとEPUB3のリーダで正しく開けないため注意が必要です。

EPUB3では、mimetypeファイルのみ非圧縮の状態でzip化するよう定められています。

このため、少々面倒ですがコマンドラインから実行できるzip圧縮ツールのinfo-zipを使用してパッケージングを行います。「Downloads」下部のftp.info-zip.orgから「zip300xn.zip」をダウンロード・解凍し、PATHを通しておきます。

実行するコマンドは以下のとおりです。

> cd path\to\ドキュメントルート
> zip -0 -X ../ファイル名.epub mimetype
  →圧縮率0、ヘッダ追加なしでmimetypeをアーカイブ
> zip -r ../ファイル名.epub * -x mimetype
  →カレントディレクトリ配下のファイル(mimetypeは除外)をアーカイブに追加

EPUB3ファイルの閲覧

PC上で.epubファイルの表示を確認したい場合、以下のツールが使えます。

Javaベースの文法チェッカーも存在するようです。

参考書籍

おわりに

EPUB3による電子書籍の作成は、構成の決まりが分かってしまえばそれほど難しいことはありません。ただ、コンテンツが多くなると.opfや目次に手作業で項目を列挙していくのは面倒です。

次回は、Ruby製静的CMSのnanocを使ってEPUB3のオーサリングを行う方法を紹介します。

« Webアプリケーションのセキュリティ対策まとめ
nanocでブログをEPUB3電子書籍化する »
blog comments powered by Disqus