HTML5 Conference 2017 電子出版部セッション基調トーク 「Webと出版が融合する新しい標準 Web Publications〈ウェブ出版物〉ができることで、Webと本の未来はどうなる？」 #html5jpub

1. Web 出版 融合 新 標準
Web Publications “ 出版物”
出来 、
Web 本 未来 ?
HTML5 Conference 2017-09-24
html5j 電⼦出版部セッション
#html5jpub
村上 真雄 (@MurakamiShinyu)
Founder & CTO, Vivliostyle Inc.

2. ⽬次
1. Webと出版が融合？ 3
2. Web＋出版の新しい標準「Web出版物」って何？ 5
3. WebコンテンツからWeb出版物へ 13
4. それで、Webと本の未来どうなる？ 17
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 2

3. Web 出版 融合?
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 3

4. Web標準 出版 統合=“Web出版”標準化
２つの標準化団体の連携によりWeb標準を使う電⼦出版(EPUB)が実現した
W3C (World Wide Web Consortium)
IDPF (International Digital Publishing Forum)
そしてW3Cへの統合、Webと出版の標準がひとつに
2017年2⽉: W3CとIDPF正式統合 - 出版の未来形を描くロードマッピング
〈出版〉をオープンWebプラットフォームの⼀級市⺠とすること
「Web出版物」(Web Publication)の標準化へ
オンラインでもオフラインでもシームレスに読める
Webサイトでも、EPUBのようなパッケージ形式でも
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 4

5. Web+出版 新 標準
「Web出版物」 何?
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 5

6. Web出版物(Web Publication)
W3C Publishing Working Groupで仕様策定が始まったWeb+出版の標準
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 6

7. 「マニフェスト」を介してまとめられた1つ以上のリソース（HTMLファイル
など）の集合
デフォルトの読む順番を持つ
⼀意に識別可能（URLなど）
Open Web Platformテクノロジーを⽤いて閲覧できる（ブラウザでOK）
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 7

8. Web出版物 「 」
マニフェスト（manifest）とは、積み荷⽬録や乗客名簿のこと
（政党の宣⾔の「マニフェスト」のほうは “manifesto”）。
他の複数のファイルのことを記述してメタデータを含むファイルのこと
EPUBのパッケージドキュメント（OPFファイル）に相当
ファイルのフォーマットはJSON型式。くわしい仕様策定はこれから
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 8

9. 例：Web出版物の「マニフェスト」はだいたいこんな感じ
{
"metadata": {
"title": "Webと本の未来",
"author": "村上 真雄",
"language": "ja",
...
},
"spine": [
{"href": "第1章.html", "title": "Webと出版が融合？"},
{"href": "第2章.html", "title": "電⼦出版の新しい標準"},
{"href": "第3章.html", "title": "それでWebと本の未来はどうなる？"},
...
],
...
}
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 9

10. 「Web出版物」 従来 Web 何 違 ?
複数のHTMLページを論理的にひとつにまとめるマニフェストファイルがあ
ること
「Web出版物」対応のUA（ブラウザ、リーディングシステム）で「本」の
ように読むことができること
オフラインでも読むことができること
パッケージ（1つのファイル）にまとめた形式（PWP =
Packaged Web Publication、あるいは次世代EPUB）にもする
ことができて、⽂書ファイルの1種として扱えること
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 10

11. 「Web出版物」対応UA
ブラウザが標準で対応、あるいは専⽤アプ
リ、あるいはブラウザ拡張機能として提供さ
れるだろう
リンクをクリックすることなく複数の章からなる読み物を連続して読むこ
とができる
⽬次のナビゲーション機能も標準で備わる
スクロール⽅式（Web的）とページめくり⽅式（書籍的）のどちらもあり
Web出版物内の検索や、特定箇所をハイライトしたり注釈をつける機能
オフライン・リーディング機能
Web出版物をまとめてダウンロードできる。PWP (Packaged Web
Publication)型式のファイルになる。
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 11

12. 「Web出版物」 読
Service Workerのしくみを使ってWeb出版物をローカルにキャッシュしてオ
フラインでも読めるように
（図 Web Publications for the Open Web Platform (W3C IG Note) より）
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 12

13. Web
Web出版物
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 13

14. Web 「Web出版物」
Webメディアいろいろ
ニュースサイト
オピニオンサイト
まとめサイト
Webマガジン
etc.
情報提供サイト
公共機関のWebコンテンツ
さまざまな公開レポート類
⾃治体の広報誌のWeb版
etc.
企業Webサイトのコンテンツ
取扱説明書
商品カタログ、など
⻑めの読み物は「Web出版物」に
向くだろう
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 14

15. Web 「Web出版物」
読み⼿にとっては、WebサイトごとにばらばらなUI/UXよりも、統⼀された
使い勝⼿で⾊々なコンテンツを読むことができるのが便利
「Web出版物」としての便利さ
標準の⽬次ナビゲーション
機能
ページネーション
オフラインでも読める
etc.
Web出版物を読むためのUI/UXは例えばこんな感じ
（MacのiBooksの画⾯イメージ）
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 15

16. 従来Web 相性
「Web出版物」 最適
⼀般書籍
学術論⽂
etc.
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 16

17. 、
Web 本 未来 ?
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 17

18. 読 美 Web 本
スクロールとページ⽅式のそれぞれの良さ、使いやすさがある
CSS仕様の進化により、さらに豊かなページレイアウト表現が実現（期待）
段組み：CSS Multi-column Layout
任意の形の回り込み：CSS Shapes
ページのレイアウト
CSS Paged Media
CSS Generated Content
CSS Page Templates
CSS Page Floats
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 18

19. Web 本 張 参照 気 箇所
注釈
Web/EPUB Annotationの標準
Hypothes.isというオープンな実装も
「Web出版物」を⼀意に表す識別⼦
（URIなど）とその中⾝の特定箇所を指
す識別⼦
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 19

20. Web 本 便利
コンテンツが「Web出版物」の標準
に従うことで、コンテンツ内のナビ
ゲーションや、⾳声読み上げでの利
⽤がより便利に
コンテンツにセマンティックなメタ
データ
DPUB-ARIA (Digital Publishing WAI-
ARIA)
画⾯を⾳声で読み上げるスクリーンリーダーを
使う⼈のイラスト（「いらすとや」より）
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 20

21. 「Web出版物」 先取 事例
Webブラウザでのページネーション
Vivliostyle
次世代CSSページレイアウト仕様
をJavaScriptで実装し、ブラウザ
上のレイアウト機能を拡張
BiB/i
「BiB/i（ビビ）は、電⼦書籍とウ
ェブをひとつに結び、本を届け
るための EPUB リーダです」
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 21

22. 複数のWebページをスクロールで連続
して読む
ニュースサイト（例： ロイター）
コミックス（例： ツイ4）
これらのWebサイトでは、下にスクロ
ールしていくと次の記事／HTMLページ
に移り（ブラウザでのURL表⽰も変
化）、連続して読み進めることができ
る。
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 22

23. スクロールとページ、横書きと縦書きの切り替えができるEPUBリーダー
（紀伊國屋書店Kinoppyアプリ）
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 23

24. ･ : Web 本 未来 ?
http://events.html5j.org/conference/2017/9/session/#e2
村上 真雄
Vivliostyle Inc.
（株式会社ビブリオスタイル）
松島 智
String & Letters
⽥嶋 淳
（株）三陽社
安藤 ⼀博
国⽴国会図書館
伊藤 俊輔
株式会社キーポート・
ソリューションズ
⽊枝 祐介
清閑堂
モデレーター
下川 和男
イースト株式会社
「APL」の紹介
#html5jpub
html5j 電⼦出版部セッション「Webと本の未来どうなる？」 24