SlideShare a Scribd company logo
1 of 16
Download to read offline
Web上で動作する新たな組版エンジン
〈次世代CSS組版〉
Vivliostyle プロジェクト
2015-02-04 #page2015
村上 真雄 (@MurakamiShinyu)
自己紹介:村上 真雄,Vivliostyle Inc.代表
• 1990年ごろ、テキスト整形ツール「XTR」を開発しフリー
ソフトウェアとして公開。それ以来マークアップ言語と組
版に関心。
• 1999年、XML 自動組版ソフトの開発を、アンテナハウス
に企画提案。AH Formatterとして製品化。W3C 標準の XSL-
FO および CSS Paged Media 仕様の実装に携わる。
• 電子出版や組版に関わる W3C の標準化活動に参加。
• 2014年8月、次世代CSS組版エンジン開発プロジェクトの
ため、株式会社ビブリオスタイルを設立(アンテナハウス
が出資)。
2
XML 組版から
W3C標準のレイアウト指定言語を使う
XML自動組版(アンテナハウスでの取り組み)
• XSL-FO (Extensible Stylesheet Language - Formatting
Objects)
• XSLT (XSL Transformation)と組み合わせて利用
• 最終版は2006年 XSL 1.1(W3C 標準化活動は終了)
• 製品マニュアルなど多くのXML自動組版用途に利用
• CSS (Cascading Style Sheets)
• Web (HTML)用だがXMLと組み合わせても利用可能
• CSS Paged Media仕様によりページ組版にも利用可
• W3Cでの標準化活動が活発。CSS仕様は進化中
4
アンテナハウス AH Formatter の処理
AH Formatter の組版フロー(アンテナハウスのサイトより)
• XSL-FO(XML+XSL→XSLT)からPDFの組版への利用がメイン
• HTML+CSS→PDF で書籍組版への利用例も
5
CSS 組版
O'Reilly社のプレゼンより
HTML+CSSで(電子)書籍制作(米O'Reilly社)
EPUB, Kindle, PDF(印刷用も), Web
閲覧用を HTML + CSS で同時制作
HTML + CSS → PDF の組版に AH
Formatter が使われている。
7
日本語組版も! W3C技術ノート
『日本語組版処理の要件』(JLREQ)
• JIS X 4051「日本語文書の組版方法」をベ
ースに、W3C仕様で参照できるように英語
と日本語で公開
• W3Cのi18n (Internationalization)活動
• 紙の書籍版(東京電機大学出版局)は、
CSS組版(AHFormatter 利用)
8
Web ブラウザで組版
「Webブラウザを組版エンジンに」
• BookJS―― 『ツール・オブ・チェンジ
本の未来をつくる12の戦略』 で紹介さ
れている。開発者は Johannes Wilm。
☞デモ(対応ブラウザ:Safari)
• Webブラウザの CSS 実装では不十分なペ
ージの組版の機能を JavaScript で実現
• ブラウザからPDF出力
• 問題点は:レイアウト指定に CSS だけで
なく JavaScript を駆使する必要、特定のブラウザの機能に
依存、など
10
次世代 CSS 組版
Vivliostyle
オープンソースプロジェクト
Vivliostyle プロジェクトとは
• Web ブラウザの組版をもっと良くして、電子出版(EPUBも)
と印刷出版の共通の組版エンジンに
• CSS 組版機能を JavaScript でも実装 (Polyfill)
• 印刷に使える高品質な PDF 出力を実現
• CSS 組版関連仕様の W3C 標準化と連携して実装を推進
• オープンソースで開発
GitHub: https://github.com/vivliostyle
12
Vivliostyle で作ろうとしてるもの
• Vivliostyle Formatter — 次世代CSS組版エンジン。構造化文
書(HTML/XML/EPUB等)をCSSで組版して高品質なPDFを
生成
• Vivliostyle Browser — Webブラウザ拡張または拡張ブラウ
ザ。WebやEPUBの組版をもっと良くしてページ表示と印
刷機能を拡張
• Vivliostyle.js — JavaScriptライブラリ。Webサイトに埋め込
みWebコンテンツやEPUBの高品質な組版表示を可能に
13
WebブラウザベースCSS組版のメリット
• 進化し続けるWebブラウザのHTML5/CSS3/JS/各種APIなど
最新の標準技術を利用可能
• JavaScript を使って組版機能を拡張することや自動処理を
組み込むことが可能
• 印刷・PDF用の組版だけでなく、ブラウザ画面表示の組版
も同様に高品質に
• ブラウザ画面と印刷・PDF用で同じエンジンなのでCSSを
共通化でき、Media Queryで各媒体に最適にするのも容易
14
開発スケジュール
• 最初の製品リリース版を、2015年の秋に発表できること
を目指しています。
• アルファ評価版:2015年春
• ベータ評価版:2015年夏
• リリース版発表:2015年秋
• GitHub上でオープンソースで開発し、評価版は随時テスト
できるようにします。
• Vivliostyle.js のテストサイト: Try vivliostyle.js!
15
Vivliostyle どうぞよろしく
開発に関心、資金その他の協力いただける方連絡ください
• Vivliostyle Inc.: http://vivliostyle.com/
• 株式会社ビブリオスタイル: http://vivliostyle.co.jp/
プロジェクト / Q&A / 会社案内 / 開発チーム、アドバイザー / 他
• Facebook 公開グループ Vivliostyle Forum:
https://www.facebook.com/groups/vivliostyle/
• 公開メーリングリスト Vivliostyle Project JA:
https://groups.google.com/forum/#!forum/vivliostyle-ja
• GitHub: https://github.com/vivliostyle/
16

More Related Content

What's hot

Vivliostyle.js における CSS Paged Media の実装
Vivliostyle.js における CSS Paged Media の実装Vivliostyle.js における CSS Paged Media の実装
Vivliostyle.js における CSS Paged Media の実装Shinyu Murakami
 
「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何か「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何かShinyu Murakami
 
カスタムフィールド 匠の流儀
カスタムフィールド 匠の流儀カスタムフィールド 匠の流儀
カスタムフィールド 匠の流儀loftwork
 
2012-02-25 wikiチュートリアル
2012-02-25 wikiチュートリアル2012-02-25 wikiチュートリアル
2012-02-25 wikiチュートリアルYuka Egusa
 
html5j 電子出版部セッション「Webと本の未来どうなる?」
html5j 電子出版部セッション「Webと本の未来どうなる?」html5j 電子出版部セッション「Webと本の未来どうなる?」
html5j 電子出版部セッション「Webと本の未来どうなる?」Shinyu Murakami
 
WordCampOsaka2012 闇WordCamp XOOPS編
WordCampOsaka2012 闇WordCamp XOOPS編WordCampOsaka2012 闇WordCamp XOOPS編
WordCampOsaka2012 闇WordCamp XOOPS編Takashi Uemura
 
Kintonecafé埼玉vol.4
Kintonecafé埼玉vol.4Kintonecafé埼玉vol.4
Kintonecafé埼玉vol.4kintone papers
 
日本語版Codexを救うんだ(公開用)
日本語版Codexを救うんだ(公開用)日本語版Codexを救うんだ(公開用)
日本語版Codexを救うんだ(公開用)Michiko Takekoshi
 
いまいまMySQL@OSC2016長岡
いまいまMySQL@OSC2016長岡いまいまMySQL@OSC2016長岡
いまいまMySQL@OSC2016長岡sakaik
 
いまいまMySQL@OSC2016島根
いまいまMySQL@OSC2016島根いまいまMySQL@OSC2016島根
いまいまMySQL@OSC2016島根sakaik
 
いまいまMySQL@OSC2016福岡
いまいまMySQL@OSC2016福岡いまいまMySQL@OSC2016福岡
いまいまMySQL@OSC2016福岡sakaik
 

What's hot (11)

Vivliostyle.js における CSS Paged Media の実装
Vivliostyle.js における CSS Paged Media の実装Vivliostyle.js における CSS Paged Media の実装
Vivliostyle.js における CSS Paged Media の実装
 
「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何か「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何か
 
カスタムフィールド 匠の流儀
カスタムフィールド 匠の流儀カスタムフィールド 匠の流儀
カスタムフィールド 匠の流儀
 
2012-02-25 wikiチュートリアル
2012-02-25 wikiチュートリアル2012-02-25 wikiチュートリアル
2012-02-25 wikiチュートリアル
 
html5j 電子出版部セッション「Webと本の未来どうなる?」
html5j 電子出版部セッション「Webと本の未来どうなる?」html5j 電子出版部セッション「Webと本の未来どうなる?」
html5j 電子出版部セッション「Webと本の未来どうなる?」
 
WordCampOsaka2012 闇WordCamp XOOPS編
WordCampOsaka2012 闇WordCamp XOOPS編WordCampOsaka2012 闇WordCamp XOOPS編
WordCampOsaka2012 闇WordCamp XOOPS編
 
Kintonecafé埼玉vol.4
Kintonecafé埼玉vol.4Kintonecafé埼玉vol.4
Kintonecafé埼玉vol.4
 
日本語版Codexを救うんだ(公開用)
日本語版Codexを救うんだ(公開用)日本語版Codexを救うんだ(公開用)
日本語版Codexを救うんだ(公開用)
 
いまいまMySQL@OSC2016長岡
いまいまMySQL@OSC2016長岡いまいまMySQL@OSC2016長岡
いまいまMySQL@OSC2016長岡
 
いまいまMySQL@OSC2016島根
いまいまMySQL@OSC2016島根いまいまMySQL@OSC2016島根
いまいまMySQL@OSC2016島根
 
いまいまMySQL@OSC2016福岡
いまいまMySQL@OSC2016福岡いまいまMySQL@OSC2016福岡
いまいまMySQL@OSC2016福岡
 

Similar to 〈次世代CSS組版〉Vivliostyle プロジェクト

Data API ことはじめ
Data API ことはじめData API ことはじめ
Data API ことはじめYuji Takayama
 
MTDDC Meetup FUKUSHIM 2010プレゼン資料
MTDDC Meetup FUKUSHIM 2010プレゼン資料MTDDC Meetup FUKUSHIM 2010プレゼン資料
MTDDC Meetup FUKUSHIM 2010プレゼン資料Toshihito Gamo
 
JAWS-UG AI支部 #2 re:Invent アップデート
JAWS-UG AI支部 #2 re:Invent アップデートJAWS-UG AI支部 #2 re:Invent アップデート
JAWS-UG AI支部 #2 re:Invent アップデートYasuhiro Matsuo
 
OpenTypeカラーフォントと関連技術の動向
OpenTypeカラーフォントと関連技術の動向OpenTypeカラーフォントと関連技術の動向
OpenTypeカラーフォントと関連技術の動向Jun Fujisawa
 
Introduction to VSCode
Introduction to VSCodeIntroduction to VSCode
Introduction to VSCodeYuki Igarashi
 
OSSを利用したプロジェクト管理
OSSを利用したプロジェクト管理OSSを利用したプロジェクト管理
OSSを利用したプロジェクト管理Tadashi Miyazato
 
FirefoxとMozillaでのSVGの取り組み
FirefoxとMozillaでのSVGの取り組みFirefoxとMozillaでのSVGの取り組み
FirefoxとMozillaでのSVGの取り組みMakoto Kato
 
concrete5 harvest festival 2016
concrete5  harvest festival 2016concrete5  harvest festival 2016
concrete5 harvest festival 2016武彦 大山
 
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyoto
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyotoconcrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyoto
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012KyotoHishikawa Takuro
 
OSSとクラウドによるコンピューティングモデルの変化
OSSとクラウドによるコンピューティングモデルの変化OSSとクラウドによるコンピューティングモデルの変化
OSSとクラウドによるコンピューティングモデルの変化Nobuyori Takahashi
 
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介馮 富久
 
Contao Open Source CMS 〜 3.3からその向こう
Contao Open Source CMS 〜 3.3からその向こうContao Open Source CMS 〜 3.3からその向こう
Contao Open Source CMS 〜 3.3からその向こうTakahiro Kambe
 
使ってみよう、WebMatrix3
使ってみよう、WebMatrix3使ってみよう、WebMatrix3
使ってみよう、WebMatrix3Narami Kiyokura
 
コラボレーションツールWikiの活用110616
コラボレーションツールWikiの活用110616コラボレーションツールWikiの活用110616
コラボレーションツールWikiの活用110616伸夫 森本
 
Small Language Model Local Launch on AI Tour Tokyo
Small Language Model Local Launch on AI Tour TokyoSmall Language Model Local Launch on AI Tour Tokyo
Small Language Model Local Launch on AI Tour TokyoTakao Tetsuro
 
Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後FatWireKK
 

Similar to 〈次世代CSS組版〉Vivliostyle プロジェクト (20)

CSS組版について
CSS組版についてCSS組版について
CSS組版について
 
Data API ことはじめ
Data API ことはじめData API ことはじめ
Data API ことはじめ
 
MTDDC Meetup FUKUSHIM 2010プレゼン資料
MTDDC Meetup FUKUSHIM 2010プレゼン資料MTDDC Meetup FUKUSHIM 2010プレゼン資料
MTDDC Meetup FUKUSHIM 2010プレゼン資料
 
概説 Data API v3
概説 Data API v3概説 Data API v3
概説 Data API v3
 
JAWS-UG AI支部 #2 re:Invent アップデート
JAWS-UG AI支部 #2 re:Invent アップデートJAWS-UG AI支部 #2 re:Invent アップデート
JAWS-UG AI支部 #2 re:Invent アップデート
 
OpenTypeカラーフォントと関連技術の動向
OpenTypeカラーフォントと関連技術の動向OpenTypeカラーフォントと関連技術の動向
OpenTypeカラーフォントと関連技術の動向
 
あしたのVivliostyle
あしたのVivliostyleあしたのVivliostyle
あしたのVivliostyle
 
Introduction to VSCode
Introduction to VSCodeIntroduction to VSCode
Introduction to VSCode
 
OSSを利用したプロジェクト管理
OSSを利用したプロジェクト管理OSSを利用したプロジェクト管理
OSSを利用したプロジェクト管理
 
FirefoxとMozillaでのSVGの取り組み
FirefoxとMozillaでのSVGの取り組みFirefoxとMozillaでのSVGの取り組み
FirefoxとMozillaでのSVGの取り組み
 
concrete5 harvest festival 2016
concrete5  harvest festival 2016concrete5  harvest festival 2016
concrete5 harvest festival 2016
 
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyoto
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyotoconcrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyoto
concrete5 最新バージョンと国内コミュニティ活動の紹介 OSC2012Kyoto
 
OSSとクラウドによるコンピューティングモデルの変化
OSSとクラウドによるコンピューティングモデルの変化OSSとクラウドによるコンピューティングモデルの変化
OSSとクラウドによるコンピューティングモデルの変化
 
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介
未来の“普通”を今。技術評論社が目指すWebベースの電子出版サービスのご紹介
 
Contao Open Source CMS 〜 3.3からその向こう
Contao Open Source CMS 〜 3.3からその向こうContao Open Source CMS 〜 3.3からその向こう
Contao Open Source CMS 〜 3.3からその向こう
 
使ってみよう、WebMatrix3
使ってみよう、WebMatrix3使ってみよう、WebMatrix3
使ってみよう、WebMatrix3
 
Thing.jsについて
Thing.jsについてThing.jsについて
Thing.jsについて
 
コラボレーションツールWikiの活用110616
コラボレーションツールWikiの活用110616コラボレーションツールWikiの活用110616
コラボレーションツールWikiの活用110616
 
Small Language Model Local Launch on AI Tour Tokyo
Small Language Model Local Launch on AI Tour TokyoSmall Language Model Local Launch on AI Tour Tokyo
Small Language Model Local Launch on AI Tour Tokyo
 
Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後
 

Recently uploaded

TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdfTSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdftaisei2219
 
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する       2024/04/19 の勉強会で発表されたものですSOPを理解する       2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものですiPride Co., Ltd.
 
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システムスマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システムsugiuralab
 
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...Toru Tamaki
 
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A surveyToru Tamaki
 
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略Ryo Sasaki
 
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNetToru Tamaki
 
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介Yuma Ohgami
 
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)Hiroki Ichikura
 

Recently uploaded (9)

TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdfTSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
 
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する       2024/04/19 の勉強会で発表されたものですSOPを理解する       2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
 
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システムスマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
 
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
 
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
 
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
 
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
 
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
 
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
 

〈次世代CSS組版〉Vivliostyle プロジェクト