Successfully reported this slideshow.

いいパブッ!! はじめてのEPUB 3

39

Share

Loading in …3
×
1 of 73
1 of 73

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

いいパブッ!! はじめてのEPUB 3

  1. 1. はじめてのEPUB 3 高瀬 拓史/ @lost_and_found August 25, 2012. プログラミング生放送勉強会#17
  2. 2. Who are you? ろす / @lost_and_found 高瀬 拓史 / Takase, Hiroshi イースト株式会社 ブログ 「電書ちゃんねる」管理人 • 日本電子出版協会 「Minimal Requirements on EPUB for Japanese Text Layout」 • 電子出版環境整備事業「EPUB日本語拡張仕様策定」 電書ちゃん 「電書ちゃんねる」マスコットキャラクター 電子書籍の世界を案内してくれる謎の女の子 性格キツめ 立ち絵が少ないのが弱点 イラストは© (有)JCN & Garakuta
  3. 3. たまに ITmediaの eBook USER にお邪魔したり します。
  4. 4. Contents • 電子出版を3つの観点で整理する • EPUBとは? そしてEPUB 3とは? • EPUB 3の何が新しいの? • 進化を続けるEPUB
  5. 5. 電子出版を 3つの観点で整理する
  6. 6. 電子出版って 広すぎるテーマで いやんなっちゃう ありきたりだけど 現状のサービスを 次の3つの観点から 考えましょう
  7. 7. Aspects Reading Platform Format System リーディングシステム プラットフォーム フォーマット
  8. 8. リーディングシステムは 電子出版物を閲覧する ハードウェアまたは ソフトウェアのことね ビューワとかリーダーとか 呼ばれることが多いかしら
  9. 9. Reading System Computer E-Ink Smart Tablet Device Phone Device
  10. 10. プラットフォームは 「土台」のことよね 転じて出版社などが 電子ブックでビジネスする 土台となる環境のことよ
  11. 11. Platform Publisher Author Consumer
  12. 12. フォーマットは 電子ブックのデータ形式ね 仕様が公開されている オープンなものと 特定の企業による 独自のものがあるわ
  13. 13. Format Open EPUB PDF AZW U.S. KF8 (Mobi) Pro- prietary Japan .book XMDF
  14. 14. リーディングシステム プラットフォーム フォーマット それぞれプレイヤー毎に まとめてみたわ 日本のプレイヤーには こんなにスッキリ書けない ものも多いんだけど……
  15. 15. Reading System, Platform & Format Apple iBookstore EPUB iBooks B&N Nook Book Store EPUB Nook SONY Reader Store EPUB Reader 楽天 Kobo ebook Store EPUB Kobo Sharp GALAPAGOS STORE XMDF GALAPAGOS Amazon Kindle Store AZW, KF8 Kindle
  16. 16. EPUBとは? そしてEPUB 3とは?
  17. 17. これから学ぶEPUBが 広く使われている フォーマットなのは わかったかな じゃあEPUBの話を 始めてゆくわよ まずEPUBのロゴはこれよ 2010年に コンペを経て決まったの
  18. 18. Designed Good! 【参考】Gマーク (グッドデザイン賞) by 日本デザイン振興会
  19. 19. ………………。 でも良くデザインされた フォーマットなのは確かよ
  20. 20. EPUBを 開発・管理しているのは (国際電子出版フォーラム) という非営利の団体よ IDPFのサイトでは EPUBを次のように 解説しているの
  21. 21. EPUB is the and distribution interchange format for digital based on publications web standards. ウェブ標準をベースにした 電子出版物の配信・交換フォーマット
  22. 22. 配信フォーマット はわかるけど 交換フォーマットって 聞き慣れないね 異なるシステム間で データをやり取りするのに 使うフォーマットだと 考えてね
  23. 23. Interchange vs Distribution Interchange Distribution 交換 配信 EPUB AZW Publisher Kindle Store Consumer EPUB EPUB Publisher Reader Store Consumer
  24. 24. ウェブ標準がベース ってどういう意味? EPUBはウェブの分野で 広く使われている規格を たくさん取り入れてるの
  25. 25. EPUB & Web Standards HTML5 Unicode MathML CSS Dublin SMIL Core JavaScript XML SSML EPUB 3 Namespaces SVG in XML PLS XML OpenType WCAG Signature XML WOFF Encryption ...etc.
  26. 26. ウェブ標準を ベースにすると、 何かいいことあるの? ・フォーマットの長期生存 ・ウェブ制作スキルの活用 ・ブラウザエンジンの転用 ができるのは大きなメリットね
  27. 27. EPUBの特徴を もう一つ挙げるとしたら リフローね スクリーンの幅や文字の大きさを 条件にして行の折り返し位置が 変化するの 小さなスクリーンでも テキストを読みやすいのが 長所だわ
  28. 28. Reflow iBooks
  29. 29. EPUBと EPUB 3は どういうご関係で? 正確には EPUB 3.0 EPUBの3回目の メジャー改訂バージョンよ できたてホヤホヤなんだから
  30. 30. History OEBPS 1.0 EPUB 2.0 EPUB 3.0 1999 2007 2011
  31. 31. そろそろ EPUB 3の具体的な イメージを掴みたいな それなら EPUB 3をどうやって 作るのかを知るのが 手っ取り早いわ
  32. 32. How to create Content Documents Package Document EPUB Container コンテンツ文書 パッケージ文書 EPUBコンテナ • XHTML5 • metadata • zip • CSS, images...etc. • manifest • reading order
  33. 33. ものすごく簡略化したら 1.XHTML5で書いたコンテンツ   を用意する 2.メタデータなどの情報を持った   パッケージ文書を作る 3.全部のファイルをzipでまとめる ってステップになるわね できたEPUBの中身はこんな感じに なってるの
  34. 34. Structure Package Document Content Documents Navigation Document パッケージ文書 コンテンツ文書 ナビゲーション文書 XML mimetype META-INF/ mybook.opf chapter1.xthml nav.xthml ...etc. XML CSS js F container.xml other resources EPUB Container zip container mybook.epub EPUBコンテナ
  35. 35. ず、ずるい! さっきの説明になかった ファイルや ディレクトリがある だから簡略化したって 言ってるじゃない zipの中の構造にも ルールがあるのよ 別に難しいものじゃないわ
  36. 36. ナビゲーション文書って なんだよ? コンテンツ文書の一種よ 目次がXHTML5で 書いてあるの
  37. 37. 今日はあんまり踏み込んだ 話はしないわ 代わりに仕様の話をします 複数の文書があるんだけど 制作に関するものは 次の4つよ
  38. 38. Specification EPUB EPUB Open Content Container Documents Format 3.0 3.0 EPUB EPUB Media Publications Overlays 3.0 3.0
  39. 39. さっきのステップに 対応してる感じだね 1つだけ知らないのが あるけど EPUB Media Overlays (メディアオーバーレイ) については後で解説するわ
  40. 40. EPUB 3の何が新しいの?
  41. 41. 話は変わるけど EPUB 3の どの辺が 新しくなったの? オーディオ・ビデオが使えたり インタラクティブな コンテンツが作れたり 日本語を含む多様な言語に 対応したり……
  42. 42. New Features Multimedia Media Overlay マルチメディア メディアオーバーレイ Scripting Globalization スクリプティング グローバリデーション
  43. 43. 表現力の向上については HTML5をベースに したのが大きいわね <audio>, <video>, <svg>, <math> などのタグをネイティブに 使えるんだもん あとはCSS3を取り入れて レイアウトの幅も広がったの
  44. 44. CSS3って まだ勧告されていない ものがたくさんあった ような……? EPUB 3では コンテンツに使用できる/ リーディングシステムが対応すべき CSSの目安をプロファイルとして 定めているわ
  45. 45. EPUB 3 CSS Profile • CSS3 Speech • CSS3 Fonts • CSS3 Text • CSS3 Modes Writing CSS3 • Media Queries • CSS3 Namespaces • CSS3 Multicol CSS2.1 • CSS3 Ruby Baseline
  46. 46. グローバリゼーションの 例として代表的なものは なんといっても 日本語テキストの いろいろなレイアウトに 対応したことね
  47. 47. Japanese Text Layout Ruby Annotation Vertical Writing Tate-chu-yoko Right to Left Page Progression Kobo Touch
  48. 48. メディアオーバーレイは 仕様のところでも 出てきたよね そろそろkwsk…… コンテンツのテキストに 音声を同期させて 読み上げるための仕様ね アクセシビリティを 向上させるわ
  49. 49. Media Overlays Media Overlay Document メディアオーバーレイ文書 .smil Content Document Audio clip Sync
  50. 50. さて、 EPUB 3の本を 読みたい人は どのリーディングシステムを 使えばいいの? 代表的なものを紹介するわ でもEPUB 3の仕様を 完全に実装した リーディングシステムは 実はまだないのよね
  51. 51. Reading System toward EPUB 3 Windows Kinoppy Adobe Readium Digital Chrome Editions Extension MacOS 1.8 preview Murasaki kitabu iOS iBooks DL Kinoppy Reader Andorid Himawari Reader E-Ink Reader Kobo PRS-T1 Touch
  52. 52. 2012年8月24日時点で 日本で使える EPUB 3の機能を 取り入れた代表的なものを 表にしてみたけど 今は変化が激しいから すぐにあてにならなく なっちゃうかもね
  53. 53. Readiumってのが やたら存在感を 放ってるんだけど…… ReadiumはIDPFや会員企業が 協力してリーディングシステムの お手本となる実装を開発する オープンソースプロジェクトよ
  54. 54. Readiumは WebKitをベースにした エンジン部分の開発と Chrome拡張による 読書機能部分の開発が 行われているわ 後者はChrome Web Storeで入手可能よ
  55. 55. Readium Chrome Extension
  56. 56. 進化を続けるEPUB
  57. 57. EPUB 3ができた後、 作ってた人たちは 何やってんの? EPUBに さらなる改良を加えるための 検討や策定を続けているわよ 幾つか例を紹介するわね
  58. 58. Fixed layout 出典: http://code.google.com/p/epub-samples/downloads/detail?name=page-blanche-20120808.epub
  59. 59. EPUBといえば リフローが特徴だけど、 レイアウトが重要な コンテンツもあるのよね レイアウトが固定された ページを扱うための EPUB 3 Fixed-Layout Documents という文書が2012年に 公開されたわ
  60. 60. Adaptive layout 出典: http://code.google.com/p/epub-revision/downloads/detail?name=adaptive-layout.zip
  61. 61. 複数の領域にまたがったり 特定の形状をなぞったり…… リフローを高度に制御して 複雑なレイアウトを実現する 方法も検討が続いているの
  62. 62. Hybrid layout 出典: http://code.google.com/p/epub-revision/downloads/detail?name=COSMO-BNFF_V2_drp.epub
  63. 63. 固定されたレイアウトと リフローするレイアウトを 切り替え可能にする方法も 検討する動きがあるわね
  64. 64. いろんな話があって 何だか眠くなって きちゃった…… デモ用のコンテンツを見て 気分転換してみましょうか あと、次に同じこと言ったら グーで殴るわよ
  65. 65. Demo • JavaScript • Multimedia • Fixed Layout • Canvas • Media Overlays http://shop.oreilly.com/ http:// https:// product/ kanakanabooks.com/ docs.google.com/ 0636920022473.do category/books open? id=0ByYcqDWy0uj4dW NvdXF5dE1XeTQ
  66. 66. うっうっ…… EPUB最高や…… 電子ブックの フォーマットは EPUBに統一せなあかん! ちょっと、それ本気で 言ってるの?
  67. 67. フォーマットごとに 得意不得意があるわけだし 高い 多機能 均質な表現を 紙面の再現が アクセシビリティ 汎用的 保証 得意 DAISY EPUB Mobi PDF 一つの本が複数のフォーマットで 提供されることも珍しくないのよ
  68. 68. それにいくらEPUBがオープンでも DRMによって相互運用性が 損なわれることはあるわ Adobe Content Server Reader Store (SONY) FairPlay iBookStore (Apple)
  69. 69. EPUB 3はオープンで 汎用性も高いけど 万能とまでは いかないわけか それでもEPUBが 重要であることに 変わりはないわよ みんなが共通に使える標準は どう考えても必要だもの
  70. 70. EPUBにも電子出版にも いろいろ課題は 残されているけど どちらも確実に進化を 続けているのは間違いないわ 豊かなコンテンツを 便利に楽しめる時代が 待ち遠しいな
  71. 71. For more information • “EPUB 3” The International Digital Publishing Forum. http://idpf.org/epub/30. • “EPUB 3 Fixed-Layout Documents” The International Digital Publishing Forum. http://idpf.org/epub/fxl/. • “EPUB 3 仕様書・関連文書日本語訳一覧” IMAGEDRIVE. http://blog.imagedrive.jp/web/2012-05-08/epub-3-specification-ja. • Matt Garrish. “What is EPUB 3?” O'Reilly Media. http://shop.oreilly.com/product/0636920022442.do. • Matt Garrish. “Accessible EPUB 3” O'Reilly Media. http://shop.oreilly.com/product/0636920025283.do.
  72. 72. See also いいパブッ!! よくわかるEPUB 3 EPUB 3を、もう少し細かいレベルで 解説しています。 HTML5とか勉強会発表資料 http://www.slideshare.net/lost_and_found/iipabu-11542571 かたログッ!! 本をネットに解き放て 電子出版物の配信技術OPDSカタログに 本をネットに解き放て ついて解説しています。 日本電子出版協会EPUBセミナー発表資料 http://www.slideshare.net/lost_and_found/ss-12020124 高瀬 拓史 @lost_and_found March 15, 2012
  73. 73. Thank you! Densho-chan illustration; © 2010 Jcn, Inc & Garakuta. DefaultIcon; © CC-BY-ND 3.0 2010-2011 Apostolos Paschalidis interactivemania.

×