EPUB3技術解説セミナー3フォント埋め込み/ウェブフォント/最新動向    2012年7月26日(木)15:00           境祐司   @commonstyle ¦ 電子書籍メディア論
profile          YOUJI SAKAIInstructional Designer | eBook Designer                境祐司
BOOKSウェブレイアウトの   EPUB3スタンダード    Webデザイン基礎   教科書        デザインガイド         改訂3版      InDesign CS6で作るEPUB 3 標準ガイドブック           ...
community       電子書籍メデ ア論             ィ http://www.facebook.com/eBookStrategy         デザインの未来http://www.facebook.com/TheFu...
テキスト
EPUB3技術解説セミナー3本日のテーマ:      フォント埋め込み      ウェブフォント      EPUB3 最新動向
EPUB 3 Font embedding / Web Fonts電子書籍の検証方法
EPUB 3 Font embedding / Web Fonts検証用のEPUBファイルを作成
EPUB 3 Font embedding / Web Fonts   Sigil   http://code.google.com/p/sigil/
EPUB 3 Font embedding / Web Fonts   Sigil   http://code.google.com/p/sigil/
EPUB 3 Font embedding / Web Fonts   Sigil   http://code.google.com/p/sigil/
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts         Making epub happenThe development blog of Sigil, the epub editor            http...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                            メタエディター
EPUB 3 Font embedding / Web Fonts        メタエディター
EPUB 3 Font embedding / Web Fonts        メタエディター
EPUB 3 Font embedding / Web Fonts        メタエディター
EPUB 3 Font embedding / Web Fonts                            EPUBファイルを                            保存
EPUB 3 Font embedding / Web Fonts テキストをコピー見出しのマークアップ
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                                    大見出し                                    タイトル
EPUB 3 Font embedding / Web Fonts                                    中見出し                                    章のタイトル
EPUB 3 Font embedding / Web Fonts                                    小見出し                                    節のタイトル
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                       <p><br /></p> を削除
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                        [見出しから目次を生成]
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                         ファイル名を付けて保存
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontsリーディングシステムで確認
EPUB 3 Font embedding / Web Fonts     Adobe Digital Editions 1.8.x
EPUB 3 Font embedding / Web Fonts     Adobe Digital Editions 1.8.x
EPUB 3 Font embedding / Web FontsiOS, Androidで確認
EPUB 3 Font embedding / Web Fonts    Dropboxにコピーする
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts      Himawari Reader Pro
EPUB 3 Font embedding / Web Fonts      Himawari Reader Pro                            デフォルトスタイル
EPUB 3 Font embedding / Web Fonts              iPad
EPUB 3 Font embedding / Web Fonts                                    iBooks
EPUB 3 Font embedding / Web Fonts                                    iBooks                           デフォルトスタイル
EPUB 3 Font embedding / Web Fonts検証用のスタイルシートを追加
EPUB 3 Font embedding / Web Fonts  空のスタイルシートを追加
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                  *{                       margin: 0;                       padding: 0;  ...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts<link href="../Styles/Style0001.css" rel="stylesheet" type="text/ css" />
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts  font-size: 100%; を追加
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontsfont-weight: normal; を追加
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontsリーディングシステムで確認
EPUB 3 Font embedding / Web Fonts                                    iBooks
EPUB 3 Font embedding / Web Fonts      Himawari Reader Pro
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontsデフォルトスタイル                       スタイルのリセット
EPUB 3 Font embedding / Web Fontsフォント埋め込みFont embeddingウェブフォント Web Fonts
EPUB 3 Font embedding / Web FontsEPUB 3フォントのコアメディアタイプ   OpenTypeフォント     application/vnd.ms-opentype     WOFFフォント         ...
EPUB 3 Font embedding / Web Fonts                                 OSA                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                 OSB                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                 OSC                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                 OSD                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                GALAPAGOS                                STORE           ...
EPUB 3 Font embedding / Web Fonts                                    GALAPAGOS                                    STORE   ...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontsデバイス                                       インストールフォント                                    ...
EPUB 3 Font embedding / Web Fonts                                 OSA                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                縦書きビューワ                                for Android       ...
EPUB 3 Font embedding / Web Fonts                                    縦書きビューワ                                    for Android
EPUB 3 Font embedding / Web Fonts                                    縦書きビューワ                                    for Android
EPUB 3 Font embedding / Web Fonts                                    縦書きビューワ                                    for Android
EPUB 3 Font embedding / Web Fonts                                縦書きビューワ                                for Android
EPUB 3 Font embedding / Web Fontsデバイス                                       インストールフォント                                    ...
EPUB 3 Font embedding / Web Fonts                                    Himawari                                    Reader Pr...
EPUB 3 Font embedding / Web Fonts                                    Himawari                                    Reader Pr...
EPUB 3 Font embedding / Web Fonts                                    Himawari                                    Reader Pr...
EPUB 3 Font embedding / Web Fontsデバイス                                       インストールフォント                                    ...
EPUB 3 Font embedding / Web Fonts                                 OSA                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                 OSA                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web FontsiPadで使用できるフォント             iOS5 ※リーディングシステムによっては表示できないので検証必須
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                                    中国語
EPUB 3 Font embedding / Web Fonts日本語
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                                    iOS Fonts                                    http://i...
EPUB 3 Font embedding / Web Fonts                                 OSB                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts        font-familyp{ font-family: "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", serif;}
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                                                     iBooks                              ...
EPUB 3 Font embedding / Web Fonts                                                     iBooks                              ...
EPUB 3 Font embedding / Web Fonts                                                     iBooks                              ...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts デフォルト                       ヒラギノ明朝 ProN W3
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fontscom.apple.ibooks.display-options.xml
EPUB 3 Font embedding / Web Fontscom.apple.ibooks.display-options.xml              iBooks
EPUB 3 Font embedding / Web Fonts                                 OSC                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fonts                                 OSD                             フォント     コンテンツ          ...
EPUB 3 Font embedding / Web Fontsフォント埋め込みFont embedding
EPUB 3 Font embedding / Web Fonts                                                 Adobe Digital Editions 1.8sample;Pigs, G...
EPUB 3 Font embedding / Web Fonts                                    iBooks                                    iOS WebKit
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                                    DL Reader                                    iOS WebKit
EPUB 3 Font embedding / Web Fonts                                    Kinoppy                                    iOS WebKit
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts           サンプルの場合TrueType
EPUB 3 Font embedding / Web Fonts@font-face { font-family: Prophecy Script; font-style: normal; font-weight: normal; src:u...
EPUB 3 Font embedding / Web Fontsp.letter { font-family: "Prophecy Script";}<p class="letter">Dear sir I received your let...
EPUB 3 Font embedding / Web FontsEPUB 3フォントのコアメディアタイプ   OpenTypeフォント     application/vnd.ms-opentype     WOFFフォント         ...
EPUB 3 Font embedding / Web Fonts公開されているEPUB3固定レイアウトのサンプル        epub-samples         http://code.google.com/p/epub-sample...
EPUB 3 Font embedding / Web Fontswasteland-woff-20120118.epub
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts                   スタイルシート@font-face {  font-family: OldStandard;  font-weight: normal;  ...
EPUB 3 Font embedding / Web Fonts                   スタイルシート@font-face {  font-family: OldStandard;  font-weight: normal;  ...
EPUB 3 Font embedding / Web Fonts     パッケージドキュメント(.opf)<manifest><item id="font.OldStandard.regular"href="OldStandard-Regu...
EPUB 3 Font embedding / Web Fonts              パッケージドキュメント(.opf)<manifest><item id="font.OldStandard.regular" href="OldSta...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts流用を防止するための「難読化」 EPUB Open Container Format (OCF) 3.0 5 Font Obfuscation(フォントの難読化) http://...
EPUB 3 Font embedding / Web Fonts                        EPUBオーサリングソフト                        「Sigil」はフォントデータの            ...
EPUB 3 Font embedding / Web Fonts                           フォント難読化
EPUB 3 Font embedding / Web Fonts                              encryption.xml
EPUB 3 Font embedding / Web Fontsウェブフォント Web Fonts
EPUB 3 Font embedding / Web Fonts海外では2010年頃から、画像を極力使用せず、CSSの指定だけでデザインされたウェブサイトが増えてきた
EPUB 3 Font embedding / Web Fontsウェブフォントはサーバに置かれており指定されたフォントを配信閲覧者のデバイスにフォントデータがインストールされていなくても、同一の表示が可能になる
EPUB 3 Font embedding / Web Fontsウェブフォント配信サービスではすでに権利処理が完了しているため制作者はCSSでフォントを指定するだけでよい
EPUB 3 Font embedding / Web Fonts問題点:ダウンロードからレンダリングまでのタイムラグがあるため指定したフォントに切り替わる様子が見えてしまう
EPUB 3 Font embedding / Web Fontsダイナミック・サブセッティング・テクノロジーDynamic Subsetting Technology
EPUB 3 Font embedding / Web Fonts文字のサブセットを効率よくダウンロードダイナミック・サブセッティング・テクノロジーDynamic Subsetting Technology
EPUB 3 Font embedding / Web Fonts TypeSquare     http://typesquare.com/
EPUB 3 Font embedding / Web Fonts・モリサワのフォントから154書体を利用可能・閲覧環境に応じてTrueType もしくはWOFFフォーマットで配信
EPUB 3 Font embedding / Web Fonts利用したいサイトのURLを登録生成されるスクリプトをページのhead要素内にコピーフォント指定は、font-familyプロパティ例:font-family: "Ryumin R...
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts
EPUB 3 Font embedding / Web Fonts現在、埋め込みフォントの扱いには制限があるブラウザベースの電子書籍コンテンツであれば利用者の閲覧環境に左右されないページデザインが可能になる...かもしれない
EPUB 3 Font embedding / Web FontsEPUB3 最新動向
EPUB3の最新情報はIDPFのサイトで確認してください    http://idpf.org/
Thank you for your attention.  ご清聴ありがとうございました
EPUB3技術解説セミナー3フォント埋め込み/ウェブフォント/最新動向    2012年7月26日(木)15:00           境祐司   @commonstyle ¦ 電子書籍メディア論
community       電子書籍メデ ア論             ィ http://www.facebook.com/eBookStrategy         デザインの未来http://www.facebook.com/TheFu...
Upcoming SlideShare
Loading in...5
×

20120726_openend_ebookpro_mediverse_sakai_font_emb

4,037

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
4,037
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
26
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

20120726_openend_ebookpro_mediverse_sakai_font_emb

  1. 1. EPUB3技術解説セミナー3フォント埋め込み/ウェブフォント/最新動向 2012年7月26日(木)15:00 境祐司 @commonstyle ¦ 電子書籍メディア論
  2. 2. profile YOUJI SAKAIInstructional Designer | eBook Designer 境祐司
  3. 3. BOOKSウェブレイアウトの EPUB3スタンダード Webデザイン基礎 教科書 デザインガイド 改訂3版 InDesign CS6で作るEPUB 3 標準ガイドブック 森 裕司, 境 祐司, 林 拓也, 向井 領治
  4. 4. community 電子書籍メデ ア論 ィ http://www.facebook.com/eBookStrategy デザインの未来http://www.facebook.com/TheFutureDesign
  5. 5. テキスト
  6. 6. EPUB3技術解説セミナー3本日のテーマ: フォント埋め込み ウェブフォント EPUB3 最新動向
  7. 7. EPUB 3 Font embedding / Web Fonts電子書籍の検証方法
  8. 8. EPUB 3 Font embedding / Web Fonts検証用のEPUBファイルを作成
  9. 9. EPUB 3 Font embedding / Web Fonts Sigil http://code.google.com/p/sigil/
  10. 10. EPUB 3 Font embedding / Web Fonts Sigil http://code.google.com/p/sigil/
  11. 11. EPUB 3 Font embedding / Web Fonts Sigil http://code.google.com/p/sigil/
  12. 12. EPUB 3 Font embedding / Web Fonts
  13. 13. EPUB 3 Font embedding / Web Fonts Making epub happenThe development blog of Sigil, the epub editor http://sigildev.blogspot.jp/
  14. 14. EPUB 3 Font embedding / Web Fonts
  15. 15. EPUB 3 Font embedding / Web Fonts メタエディター
  16. 16. EPUB 3 Font embedding / Web Fonts メタエディター
  17. 17. EPUB 3 Font embedding / Web Fonts メタエディター
  18. 18. EPUB 3 Font embedding / Web Fonts メタエディター
  19. 19. EPUB 3 Font embedding / Web Fonts EPUBファイルを 保存
  20. 20. EPUB 3 Font embedding / Web Fonts テキストをコピー見出しのマークアップ
  21. 21. EPUB 3 Font embedding / Web Fonts
  22. 22. EPUB 3 Font embedding / Web Fonts
  23. 23. EPUB 3 Font embedding / Web Fonts
  24. 24. EPUB 3 Font embedding / Web Fonts 大見出し タイトル
  25. 25. EPUB 3 Font embedding / Web Fonts 中見出し 章のタイトル
  26. 26. EPUB 3 Font embedding / Web Fonts 小見出し 節のタイトル
  27. 27. EPUB 3 Font embedding / Web Fonts
  28. 28. EPUB 3 Font embedding / Web Fonts
  29. 29. EPUB 3 Font embedding / Web Fonts <p><br /></p> を削除
  30. 30. EPUB 3 Font embedding / Web Fonts
  31. 31. EPUB 3 Font embedding / Web Fonts
  32. 32. EPUB 3 Font embedding / Web Fonts [見出しから目次を生成]
  33. 33. EPUB 3 Font embedding / Web Fonts
  34. 34. EPUB 3 Font embedding / Web Fonts
  35. 35. EPUB 3 Font embedding / Web Fonts ファイル名を付けて保存
  36. 36. EPUB 3 Font embedding / Web Fonts
  37. 37. EPUB 3 Font embedding / Web Fontsリーディングシステムで確認
  38. 38. EPUB 3 Font embedding / Web Fonts Adobe Digital Editions 1.8.x
  39. 39. EPUB 3 Font embedding / Web Fonts Adobe Digital Editions 1.8.x
  40. 40. EPUB 3 Font embedding / Web FontsiOS, Androidで確認
  41. 41. EPUB 3 Font embedding / Web Fonts Dropboxにコピーする
  42. 42. EPUB 3 Font embedding / Web Fonts
  43. 43. EPUB 3 Font embedding / Web Fonts
  44. 44. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro
  45. 45. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro デフォルトスタイル
  46. 46. EPUB 3 Font embedding / Web Fonts iPad
  47. 47. EPUB 3 Font embedding / Web Fonts iBooks
  48. 48. EPUB 3 Font embedding / Web Fonts iBooks デフォルトスタイル
  49. 49. EPUB 3 Font embedding / Web Fonts検証用のスタイルシートを追加
  50. 50. EPUB 3 Font embedding / Web Fonts 空のスタイルシートを追加
  51. 51. EPUB 3 Font embedding / Web Fonts
  52. 52. EPUB 3 Font embedding / Web Fonts *{ margin: 0; padding: 0; }
  53. 53. EPUB 3 Font embedding / Web Fonts
  54. 54. EPUB 3 Font embedding / Web Fonts
  55. 55. EPUB 3 Font embedding / Web Fonts<link href="../Styles/Style0001.css" rel="stylesheet" type="text/ css" />
  56. 56. EPUB 3 Font embedding / Web Fonts
  57. 57. EPUB 3 Font embedding / Web Fonts font-size: 100%; を追加
  58. 58. EPUB 3 Font embedding / Web Fonts
  59. 59. EPUB 3 Font embedding / Web Fontsfont-weight: normal; を追加
  60. 60. EPUB 3 Font embedding / Web Fonts
  61. 61. EPUB 3 Font embedding / Web Fontsリーディングシステムで確認
  62. 62. EPUB 3 Font embedding / Web Fonts iBooks
  63. 63. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro
  64. 64. EPUB 3 Font embedding / Web Fonts
  65. 65. EPUB 3 Font embedding / Web Fonts
  66. 66. EPUB 3 Font embedding / Web Fontsデフォルトスタイル スタイルのリセット
  67. 67. EPUB 3 Font embedding / Web Fontsフォント埋め込みFont embeddingウェブフォント Web Fonts
  68. 68. EPUB 3 Font embedding / Web FontsEPUB 3フォントのコアメディアタイプ OpenTypeフォント application/vnd.ms-opentype WOFFフォント application/font-woff
  69. 69. EPUB 3 Font embedding / Web Fonts OSA フォント コンテンツ リーディング (電子書籍) システム フォントなし フォント
  70. 70. EPUB 3 Font embedding / Web Fonts OSB フォント コンテンツ リーディング (電子書籍) システム フォントなし フォントなし
  71. 71. EPUB 3 Font embedding / Web Fonts OSC フォント コンテンツ リーディング (電子書籍) システム フォント フォントなし
  72. 72. EPUB 3 Font embedding / Web Fonts OSD フォント コンテンツ リーディング (電子書籍) システム フォント フォント
  73. 73. EPUB 3 Font embedding / Web Fonts GALAPAGOS STORE ビューアアプリ
  74. 74. EPUB 3 Font embedding / Web Fonts GALAPAGOS STORE ビューアアプリ
  75. 75. EPUB 3 Font embedding / Web Fonts
  76. 76. EPUB 3 Font embedding / Web Fontsデバイス インストールフォント フォント
  77. 77. EPUB 3 Font embedding / Web Fonts OSA フォント コンテンツ リーディング (電子書籍) システム フォントなし フォント
  78. 78. EPUB 3 Font embedding / Web Fonts 縦書きビューワ for Android ※EPUBは簡易対応
  79. 79. EPUB 3 Font embedding / Web Fonts 縦書きビューワ for Android
  80. 80. EPUB 3 Font embedding / Web Fonts 縦書きビューワ for Android
  81. 81. EPUB 3 Font embedding / Web Fonts 縦書きビューワ for Android
  82. 82. EPUB 3 Font embedding / Web Fonts 縦書きビューワ for Android
  83. 83. EPUB 3 Font embedding / Web Fontsデバイス インストールフォント フォント
  84. 84. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro for Android
  85. 85. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro for Android
  86. 86. EPUB 3 Font embedding / Web Fonts Himawari Reader Pro for Android
  87. 87. EPUB 3 Font embedding / Web Fontsデバイス インストールフォント フォント
  88. 88. EPUB 3 Font embedding / Web Fonts OSA フォント コンテンツ リーディング (電子書籍) システム フォントなし フォント
  89. 89. EPUB 3 Font embedding / Web Fonts OSA フォント コンテンツ リーディング (電子書籍) システム フォントなし フォントなし
  90. 90. EPUB 3 Font embedding / Web FontsiPadで使用できるフォント iOS5 ※リーディングシステムによっては表示できないので検証必須
  91. 91. EPUB 3 Font embedding / Web Fonts
  92. 92. EPUB 3 Font embedding / Web Fonts 中国語
  93. 93. EPUB 3 Font embedding / Web Fonts日本語
  94. 94. EPUB 3 Font embedding / Web Fonts
  95. 95. EPUB 3 Font embedding / Web Fonts iOS Fonts http://iosfonts.com/
  96. 96. EPUB 3 Font embedding / Web Fonts OSB フォント コンテンツ リーディング (電子書籍) システム フォントなし フォントなし
  97. 97. EPUB 3 Font embedding / Web Fonts font-familyp{ font-family: "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", serif;}
  98. 98. EPUB 3 Font embedding / Web Fonts
  99. 99. EPUB 3 Font embedding / Web Fonts iBooks iOS WebKitヒラギノ明朝 ProN W3
  100. 100. EPUB 3 Font embedding / Web Fonts iBooks iOS WebKitヒラギノ明朝 ProN W3
  101. 101. EPUB 3 Font embedding / Web Fonts iBooks iOS WebKitヒラギノ明朝 ProN W3
  102. 102. EPUB 3 Font embedding / Web Fonts
  103. 103. EPUB 3 Font embedding / Web Fonts
  104. 104. EPUB 3 Font embedding / Web Fonts デフォルト ヒラギノ明朝 ProN W3
  105. 105. EPUB 3 Font embedding / Web Fonts
  106. 106. EPUB 3 Font embedding / Web Fonts
  107. 107. EPUB 3 Font embedding / Web Fontscom.apple.ibooks.display-options.xml
  108. 108. EPUB 3 Font embedding / Web Fontscom.apple.ibooks.display-options.xml iBooks
  109. 109. EPUB 3 Font embedding / Web Fonts OSC フォント コンテンツ リーディング (電子書籍) システム フォント フォントなし
  110. 110. EPUB 3 Font embedding / Web Fonts OSD フォント コンテンツ リーディング (電子書籍) システム フォント フォント
  111. 111. EPUB 3 Font embedding / Web Fontsフォント埋め込みFont embedding
  112. 112. EPUB 3 Font embedding / Web Fonts Adobe Digital Editions 1.8sample;Pigs, Gourds, and Wikis: Embedding Fonts in EPUB- iPad, iPhone AND nookhttp://www.pigsgourdsandwikis.com/2011/04/embedding-fonts-in-epub-ipad-iphone-and.html
  113. 113. EPUB 3 Font embedding / Web Fonts iBooks iOS WebKit
  114. 114. EPUB 3 Font embedding / Web Fonts
  115. 115. EPUB 3 Font embedding / Web Fonts DL Reader iOS WebKit
  116. 116. EPUB 3 Font embedding / Web Fonts Kinoppy iOS WebKit
  117. 117. EPUB 3 Font embedding / Web Fonts
  118. 118. EPUB 3 Font embedding / Web Fonts サンプルの場合TrueType
  119. 119. EPUB 3 Font embedding / Web Fonts@font-face { font-family: Prophecy Script; font-style: normal; font-weight: normal; src:url("Fonts/Prophecy_Script.ttf");}p.letter { font-family: "Prophecy Script";}
  120. 120. EPUB 3 Font embedding / Web Fontsp.letter { font-family: "Prophecy Script";}<p class="letter">Dear sir I received your letter and Iam sorry that I can not comply withyour wishes ....</p>
  121. 121. EPUB 3 Font embedding / Web FontsEPUB 3フォントのコアメディアタイプ OpenTypeフォント application/vnd.ms-opentype WOFFフォント application/font-woff
  122. 122. EPUB 3 Font embedding / Web Fonts公開されているEPUB3固定レイアウトのサンプル epub-samples http://code.google.com/p/epub-samples/ ダウンロードリスト http://code.google.com/p/epub-samples/downloads/list
  123. 123. EPUB 3 Font embedding / Web Fontswasteland-woff-20120118.epub
  124. 124. EPUB 3 Font embedding / Web Fonts
  125. 125. EPUB 3 Font embedding / Web Fonts
  126. 126. EPUB 3 Font embedding / Web Fonts スタイルシート@font-face { font-family: OldStandard; font-weight: normal; font-style: normal; src:url(OldStandard-Regular.woff) format(woff);}body { font-family: OldStandard, sans-serif;}
  127. 127. EPUB 3 Font embedding / Web Fonts スタイルシート@font-face { font-family: OldStandard; font-weight: normal; font-style: normal; src:url(OldStandard-Regular.woff) format(woff);}body { font-family: OldStandard, sans-serif;} fallback
  128. 128. EPUB 3 Font embedding / Web Fonts パッケージドキュメント(.opf)<manifest><item id="font.OldStandard.regular"href="OldStandard-Regular.woff"media-type="application/font-woff"/></manifest>
  129. 129. EPUB 3 Font embedding / Web Fonts パッケージドキュメント(.opf)<manifest><item id="font.OldStandard.regular" href="OldStandard-Regular.woff"media-type="application/font-woff"/><item id="font.OldStandard.italic" href="OldStandard-Italic.woff"media-type="application/font-woff"/><item id="font.OldStandard.bold" href="OldStandard-Bold.woff"media-type="application/font-woff"/></manifest>
  130. 130. EPUB 3 Font embedding / Web Fonts
  131. 131. EPUB 3 Font embedding / Web Fonts流用を防止するための「難読化」 EPUB Open Container Format (OCF) 3.0 5 Font Obfuscation(フォントの難読化) http://idpf.org/epub/30/spec/epub30-ocf.html#font-obfuscation
  132. 132. EPUB 3 Font embedding / Web Fonts EPUBオーサリングソフト 「Sigil」はフォントデータの 難読化をサポート
  133. 133. EPUB 3 Font embedding / Web Fonts フォント難読化
  134. 134. EPUB 3 Font embedding / Web Fonts encryption.xml
  135. 135. EPUB 3 Font embedding / Web Fontsウェブフォント Web Fonts
  136. 136. EPUB 3 Font embedding / Web Fonts海外では2010年頃から、画像を極力使用せず、CSSの指定だけでデザインされたウェブサイトが増えてきた
  137. 137. EPUB 3 Font embedding / Web Fontsウェブフォントはサーバに置かれており指定されたフォントを配信閲覧者のデバイスにフォントデータがインストールされていなくても、同一の表示が可能になる
  138. 138. EPUB 3 Font embedding / Web Fontsウェブフォント配信サービスではすでに権利処理が完了しているため制作者はCSSでフォントを指定するだけでよい
  139. 139. EPUB 3 Font embedding / Web Fonts問題点:ダウンロードからレンダリングまでのタイムラグがあるため指定したフォントに切り替わる様子が見えてしまう
  140. 140. EPUB 3 Font embedding / Web Fontsダイナミック・サブセッティング・テクノロジーDynamic Subsetting Technology
  141. 141. EPUB 3 Font embedding / Web Fonts文字のサブセットを効率よくダウンロードダイナミック・サブセッティング・テクノロジーDynamic Subsetting Technology
  142. 142. EPUB 3 Font embedding / Web Fonts TypeSquare http://typesquare.com/
  143. 143. EPUB 3 Font embedding / Web Fonts・モリサワのフォントから154書体を利用可能・閲覧環境に応じてTrueType もしくはWOFFフォーマットで配信
  144. 144. EPUB 3 Font embedding / Web Fonts利用したいサイトのURLを登録生成されるスクリプトをページのhead要素内にコピーフォント指定は、font-familyプロパティ例:font-family: "Ryumin Regular KL" ;
  145. 145. EPUB 3 Font embedding / Web Fonts
  146. 146. EPUB 3 Font embedding / Web Fonts
  147. 147. EPUB 3 Font embedding / Web Fonts
  148. 148. EPUB 3 Font embedding / Web Fonts
  149. 149. EPUB 3 Font embedding / Web Fonts
  150. 150. EPUB 3 Font embedding / Web Fonts現在、埋め込みフォントの扱いには制限があるブラウザベースの電子書籍コンテンツであれば利用者の閲覧環境に左右されないページデザインが可能になる...かもしれない
  151. 151. EPUB 3 Font embedding / Web FontsEPUB3 最新動向
  152. 152. EPUB3の最新情報はIDPFのサイトで確認してください http://idpf.org/
  153. 153. Thank you for your attention. ご清聴ありがとうございました
  154. 154. EPUB3技術解説セミナー3フォント埋め込み/ウェブフォント/最新動向 2012年7月26日(木)15:00 境祐司 @commonstyle ¦ 電子書籍メディア論
  155. 155. community 電子書籍メデ ア論 ィ http://www.facebook.com/eBookStrategy デザインの未来http://www.facebook.com/TheFutureDesign
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×