情報

YOUJI SAKAI – EBOOK PRODUCTION NOTE

のアーカイブ

EPUB3 とKindle Format 8のHTML5 & CSS3コーディング入門

イーブックデザイナーは、電子書籍の企画から情報設計、ブックデザイン、コーディングまでを請け負う新しい職種です。電子出版は、1990年代から20年以上の歴史がありますが、現在の仕事は、ウェブと密接です。「EPUB3」(電子書籍フォーマットのオープンな標準規格)やKF8(Kindleの新しいフォーマット)は、W3CのHTML5とCSS3を採用していますので、ウェブデザインの作業とあまり変わりません。最初から、ウェブの最先端を取り込んでいる分、(古いブラウザに対応しなければいけない)ウェブデザインよりも一歩先を歩いていると考えてよいかもしれません。
今回は、これから普及し始める「EPUB3」と近々サービスを開始すると言われているAmazon Kindleの「KF8」について解説し、実際に簡単なサンプル(電子書籍)を作成します。

CSS Nite in NAGOYA ♭002

日時:6月10日(日)17:30 – 19:00(90分)

.

形式:セミハンズオン

  • PC持参する方:サンプルデータを使って電子書籍制作を体験できます
  • 聴講する方:スクリーンに大きく表示しますので、解説を聞きながらご覧ください

PCを持参して電子書籍制作を体験される方

  • HTMLとCSSの初歩的な知識があることを前提として進めます
  • HTMLやCSSを編集できるエディタが必要です
  • EPUBに変換するユーティリティが必要です(このページの最後を参照)
  • サンプルファイルをダウンロードしてください
    http://admn.mobi/download/sample.zip
    http://admn.mobi/download/sample_windows.zip (※Windowsを使用する場合)

    ※当日、(ダウンロードできない方のために)サンプルを入れたUSBメモリを用意しておきます

聴講される方

  • 小さな文字などは拡大して操作しますが、できれば前の座席をお奨めします

.

学べること:

  • EPUB とウェブコンテンツとの違いは何か
  • EPUB3 の電子書籍はどのように作成すればよいのか
  • EPUB3 の作業はウェブデザインのスキルでどの程度対応できるか
  • なぜ、日本ではまだEPUBが普及していないのか
  • Amazonの「Kindle」とはどのようなサービスなのか
  • Kindleの電子書籍とEPUBとは何が違うのか
  • どうして、EPUBからKindleの電子書籍をつくるのか
  • もし、国内でKindleがスタートしたら、どのような仕事が発生するのか

.

セミナーの内容:

[1]作業を始める前に [15分]

  • イーブックデザインってどんな仕事?
  • 電子書籍のオープンな技術「EPUB3」を理解しよう!
  • なぜ、国内でスタートしていないKindleについて学ぶの?
  • Kindleの新しいフォーマット「KF8」とEPUB3、何が違う?

[2]EPUB3の電子書籍を設計しよう! [15分]

  • 本の構造を視覚化する
  • 本の情報(メタデータ)を整理する
  • ページの順番を決める
  • 図版(画像ファイル)を準備する
  • 対象とする読書環境を決める

[3]HTML5、CSS3による電子書籍のオーサリングに挑戦! [40分〜]

  • ※セミハンズオン
  • ※テンプレートを開きながら主要な部分のみコーディング
  • ※聴講(PCなし)でも理解可能
  1. EPUBコンテナを作成
  2. パッケージドキュメントを作成
  3. ナビゲーションドキュメント(目次)を作成(HTML5)
  4. コンテンツ「表紙」を作成(HTML5, CSS3)
  5. コンテンツ「章ページ」を作成(HTML5, CSS3)
  6. EPUBファイルを圧縮/検証
  7. iOS、Android、PCで確認
  1. Kindle Format 8に変換
  2. EPUBファイルからグレースフル・デグレデーションファイルを作成
  3. グレースフル・デグレデーションファイルをKindle Format 8に変換
  4. Kindle Fireで確認

[6]電子書籍をリリースしてみよう! [10分]

  • EPUBファイルを販売するには?
  • 注意すること

.

オーサリング作業のワークフロー図(参考):

EPUB3ファイルをKF8に変換するまでの流れ

.

使用するアプリケーションおよびユーティリティ:

PCを持参して電子書籍制作を体験される方へ

  • エディタを用意してください
    使い慣れているものでかまいません
  • EPUBを圧縮するユーティリティを用意してください
  • Mac OS X「ePub Packager
    ※Mac App Storeのリンク
  • Mac OS X(10.6未満)「ePub Zip for Mac OS X
    ※ZIPファイルのリンク
  • Windows「ePubPack

参考:EPUB圧縮ユーティリティの使い方(ビデオ)
こんな感じで使います
http://www.facebook.com/photo.php?v=1699475822644

.

講師が使用するアプリケーションなどを参考情報として記しておきます

  • コーディングで使用するエディタ
    (Macを使用しますので、Jeditを使います)
  • EPUBファイルを圧縮するための専用ユーティリティ
    (Macを使用しますので、ePub Packagerを使います)

以下のアプリケーションは、用意する必要はありませんが、持参するPCにインストールされているとプレゼンを見ながら実際に試すことができます

.

[参考]リソース

EPUB3 関連:

EPUB3 リーディングシステム:

バリデーター:

EPUB3 のサンプル:

EPUB3 固定レイアウト/著作権保護:

参考サイト:

EPUB 関連イベント:

Kindle Format 8 公式ページ:

.

参考書:

EPUB関連

Kindle関連

ユーザーガイド:

.

更新日:2012年5月30日

2012年4月8日の投稿

.

Chip Kidd: Book One: Work: 1986-2006 [ペーパーバック]
チップ・キッド氏の作品集(1986〜2006年)

Chip Kidd: Book One: Work: 1986-2006

TED2012
Chip Kidd: Designing books is no laughing matter. OK, it is.
チップ・キッド 「笑い事ではないけど笑える本のデザインの話

チップ・キッドは本を表紙では判断しません。本を体現する表紙を作るのです。それもお茶目なユーモアをもって。TED2012で一番可笑しかったこの講演で、彼は表紙デザインの芸術と深い思索を披露しています(チー・パールマンとデビッド・ロックウェルがゲストキュレーターを務めたTED2012のセッション「デザインスタジオ」から)。

※以下のビデオを視聴するには、Flashプラグインがインストールされている環境が必要です。Flash未対応の環境では空白になりますが、上記のリンクをクリックすると、視聴可能なページに移動します

.

ARTBREAK
チップ・キッド氏のバンド「ARTBREAK」のPV

CHIP KIDD presents ARTBREAK from gary nadeau on Vimeo.

Here’s a first look at the ASYMMETRICAL GIRL video by ARTBREAK. Featuring CHIP KIDD & MARS TRILLION with a special appearance by Chip’s niece, LAUREN KIDD on drums. Thanks to Tal Unreich (camera), Dan & Andre at dresscodeny.com (motion graphics) Directed by me>GARY NADEAU 😉

“You could baby living it up in that world” CHIPKIDD.COM

投稿:2012年5月3日

There Was an Old Monkey Who Swallowed a Frog


.
Kindle Edition

購入画面

  • Galaxy S IIで購入
  • ダウンロードして開くと、自動的にランドスケープモードに切り替わる(ポートレイトモードでは読めない仕様)
  • スマートフォンなので、文字が読みにくいが、テキストの部分をタップするとポップアップ表示する

テキストポップアップ機能テキストのポップアップ表示

未対応の環境で開いた場合:

  • iPhone 4 のKindleアプリを起動すると、同期機能によってクラウド画面に表示される
  • 試しにタップしてみると、アラートが表示される

iPhoneで開く

投稿:2012年5月3日

4月27日の検証でReadiumの不具合を発見

.

Readium Cloud Reader(クラウドベースのReadium)
見開きページに切り替えて、表示している。EPUBのサンプルは、IDPFのepub-samplesで公開されている「page-blanche-20120314.epub

Readium Cloud Reader

.

最新のGoogle Chrome(18.0.1025.165/2012年5月2日現在)では、以下のように、見開きページに切り替えても、シングルページの状態。表示されないページがあるので、見開きにはなっている。
※前のバージョン18.0.1025.162までは問題なし

最新のGoogle Chrome

投稿:2012年5月2日

 

Adapted

Podcast:
5月1日からイーブックデザイナーとして本格的に活動開始します」- 新しい書籍のカタチ(247)」11:51/MP3

いよいよ本格的に電子出版の仕事をスタートすることになりました。2年前、「2012年頃には、Amazon KindleもApple iBookstoreも国内でサービスをスタートし、EPUBも先行している米国のように商用フォーマットとして普及し始めているはず」という想定で、試行錯誤を繰り返してきましたが、2012年に入っても(明日から5月ですが)まだ環境が整っていません。ただ、水面下では激しい交渉が繰り広げられており、そろそろ見切り発車してもよいと判断しました。

投稿:2012年5月1日