カテゴリー別アーカイブ: EPUB

Adobe Digital Editions 画像表示サイズの奇妙な現象

昨日、「iBooksとAdobe Digital Editionsの画像表示動作の違いにご注意」(http://d.hatena.ne.jp/cassupport/20110512/1305162472)という日記をかいたのですが、制作された大石さんから次のようなコメントをもらいました。
『CSSに「img {width:100%;}」と追加してみました。一見大丈夫なようですが、画面サイズを左右に広げた場合、Adobe Digital Editionsでは2段組となり、firefoxのアドオンEPUBreaderではどこまでも画面に追随するため偏平な画像になってしまいます。』
まず、前段の画面サイズを左右に広げたときの話ですが、Adobe Digital Editionsでは文字を小さくするとか、あるいは、表示幅を広くすると2段組で表示するのが通常動作のようです(Windows版で確認)。Sony Readerなどでは画面のサイズが決まっていますので問題ないのではないでしょうか。
firefoxのEPUBreaderで画面幅に追随して扁平になるのを避けるには、max-width:100% とすれば良いようです。max-widthに対する動作もEPUBReaderで少し違うようなのでこのあたりはまた調べてみようと思います。
それと関係して、Adobe Digital Editionsの画像サイズに関する奇妙な動作に嵌ってしまいました。
※バージョンは1.7.2.1131(Windows7)の環境です。
先日、次のように書きました。
——
div {
width:30%;
}
img {
width:100%;
}
imgの親要素のdivに幅を指定し、img自体にはその親要素の表示幅に合わせて画像を表示するように指定するとiPadでも、Adobe Digital Editionsでも画像の表示サイズが同じになります。
——
http://d.hatena.ne.jp/cassupport/20110426/1303775762
ところが今日同じ様なファイルを作ってみたところAdobe Digital Editionsでそうならないのです。
○divにwidth:50%;を指定したつもりなのに次のようになってしまいます。
http://f.hatena.ne.jp/cassupport/20110513200405
※スタイルシートの内容(一部)
/* test */
.fig {
width: 50%;
}
img.case-2 {
width:100%;
}
img.case-3 {
max-width: 100%;
}
テストファイル:ファイルをダウンロード
これはおかしいと思い、さんざん調べました。でたまたま指定の順序を入れ替えたのです。
※スタイルシートの内容(一部:変更後)
/* test */
img.case-2 {
width:100%;
}
img.case-3 {
max-width: 100%;
}
.fig {
width: 50%;
}
○今度はなんと次のようになってしまいます。2枚目は期待通りになりますが1枚目が画像本来のサイズのままになってしまっています。
1枚目http://f.hatena.ne.jp/cassupport/20110513200406
2枚目http://f.hatena.ne.jp/cassupport/20110513200407
Adobe Digital Editions はスタイルシートの指定順序で画像の大きさが変わってしまいます。
テストファイル:ファイルをダウンロード
ブラウザ(ForefoxやそのEPUB Readerプラグイン)では2つの画像の両方とも画面サイズの50%の幅で表示されます。
この現象はどういうことなんでしょうかね。まだ原因は分かっていません。


Book on Demandの現状と可能性を考えてみました

アンテナハウスのCAS-UB(http://www.cas-ub.com/)は書籍のコンテンツを編集・制作するサービスです。
CAS-UBで編集した結果はEPUBとPDFに同時に出力できますので、BOD(ブックオンデマンド)にも最適です。
 
BODというのは聞きなれないかもしれません。まだ一般的に定着した言葉ではないようで、まったく別の意味に用いているケースも見受けられます。
世間一般にはPOD(プリントオンデマンド)と言う言葉の方が普及しているようです。しかし、PODというとダイナミックに変動する需要に応じて印刷するという幅広い概念で、ちらしやDMのようなものの印刷まで含むと思います。
いわゆるページもの(論文、冊子、書籍)の場合は、印刷だけではなく、製本や断裁の工程が追加になります。ページものを対象にするときは、製本・断裁などを含む言葉として、BOD(ブックオンデマンド)と言うほうがPODよりも意味が明確になると思います。
1.Espresso Book Machine(EBM)
BODの装置で有名なのがこのEBMです。三省堂の神田本店にEBMがあります。ここでは絶版本などの印刷・製本サービスを行なっています。三省堂のメニューを見ますと一般読者向けの書籍が多いようです。詳しく比較したわけではありませんが、通常の店頭書籍とあまり変わらない価格という印象を受けます。
現在は、自分で作ったPDFを本にして欲しいと言ってもだめなようです。このマシン用のデータはオンデマンドブックス社のサーバ上にあるようで、それが理由かもしれませんね。システム上はオンサイトのデータ入力も可能らしいので、持ち込みPDFの印刷・製本もやればできるのでしょうけど。ぜひ持ち込みPDFベースのBODにも対応して欲しいです。そうなったら試してみたいと思っています。
2. BODのできるPOD機械
 
EBMの特徴はコピーから製本まで一連の加工を短時間で行うことにあります。同じような機能を実現する装置としては、キヤノン、富士ゼロックス、コニカミノルタなどのプロダクションプリンティングのメーカから、プリント装置(コピー機)と連動する大型のインライン自動製本機も販売されています。しかし、これらは機械全体としては高額であり、比較的低価格のものはEBMのみのようです。
2. BOD書籍の販売
「だれが「本」を殺すのか」(佐野 眞一著、プレジデント社)には、地方出版社の経営者の言葉として、印刷会社への支払いがきついということがでてきます。印刷した本は在庫になりますので、印刷会社への支払いだけではなく税金負担もあります。コンテンツを販売する立場からは在庫負担のないBODは理想的な手段に見えます。
2.1 書籍の流通でBODを利用する
三省堂のEBMは、BODを書店が利用する例ですが、オンライン流通業者がBODを行なっているケースがあります。
(1) Bookparkのオンデマンド出版
富士ゼロックスの関連会社で、コンテンツワークスという会社はBOD流通サイトを運営しています。
http://www.booknest.jp/
コンテンツワークスはもともと富士ゼロックスの事業から由来しているようです。BODで本を作るだけではなく販売もしてもらえます。
利用している人のTweetによりますと、コピー費用は4円/ページですが、諸経費含めて1頁10円位とのことです。
 
http://twitter.com/#!/mao3mao3/status/64517440792567810
(2) アマゾンがBODでの販売を始めた
アマゾンが米国でBODで本を作っている話は前から紹介されています。先月、日本でも始めるというニュースが出ました。
http://japan.internet.com/wmnews/20110419/2.html
http://internet.watch.impress.co.jp/docs/news/20110419_440705.html
アマゾンのWebページにはまだ英語の書籍が多いようです。
http://www.amazon.co.jp/b?ie=UTF8&node=2229003051
現在、日本語の書籍のBOD販売の準備を進めているようです。検討してみた方の声がブログに紹介されていました。これで出版ビジネスに新規参入するのは難しいようです。
 
「AmazonのPODは新規参入出版社にとってきつい」
 
2.2 出版社がBODを利用する例
Webを探したところ出版社でBODで本を販売しているケースを見つけました。
(1) 森北出版
BOD書籍のご案内
http://www.morikita.co.jp/pod.html
BOD書籍のリスト
http://www.morikita.co.jp/bunya/20-1.html
ざっとみると平均:約215頁、3,582円。1頁あたり16.6円になります。一番安いもので13円弱。高いものが22円強です。専門書なので比較的高価です。
(2) 角川学芸出版
BOD書籍
http://www.kadokawagakugei.com/ondemand/list-c.php
角川地名大辞典、角川選書、源氏物語評釈のBOD本が出ています。比較的ポピュラーと見られる角川選書でも最低価格は3,000円です。かなり高価という印象を受けます。
3. BODの可能性は?
3.1 市販本の出版
一般に市販する書籍を数を出そうとするとある程度安くする必要があると思いますが、森北出版や角川学芸出版のケースでみますと、一般の書籍と比べてかなり高価になっています。これだとどうしても必要な人を除いてなかなか売れないでしょう。
流通業者を利用することを考えてみると、ブックネストにしてもアマゾンにしても、BOD印刷・製本コストに加えて販売手数料がかかります。
書籍はひとつづつ内容が違いますので、一見差別化しやすいようですが、しかし類似書籍が大量にありますので差別化は難しいと思います。そうしますと、一般読者に売るときはどうしても他の書籍と価格競争になります。
市販の書籍の印刷・製本コストは、現在のBODコストの1/3以下ではないでしょうか?結局、BODベースでは印刷・製本した書籍に価格的に太刀打ちできないだろうと思います。
但し、三省堂書店のEBMは価格的な魅力を感じます。書店の店頭にEBMが普及したとき初めてBODベースの出版ビジネスが成立する可能性があります。
3.2 私家書籍あるいは企業内書籍
上述のようにBOD本を一般に販売するときは、印刷製本済みの書籍との価格競争に巻き込まれます。ので、この領域でのBODの将来性はなかなか厳しいと思います。
BODはむしろ自費出版(著者が負担する出版)、私家書籍(私蔵用)、企業・団体で本をつくるのに向いているような気がします。
「なぜ日本は大東亜戦争を戦ったのか」(田原総一郎著、PHP研究所)には北 一輝が「国体論及び純正社会主義」を書き上げて自費出版して、世の中と勝負する経緯が出てきます(pp.324~329)。北は自費出版で書を出して一部で高い評価を得るも、わずか6日間で権力と御用新聞によって発禁処分となり闇に葬られたようです。出版とはむしろそういうものかもしれません。
 
3.3 電子書籍との関係
 
BODは手作りと言う点では今流行の自炊と似通っています。BODは電子から紙という方向なので紙をスキャンして電子化する自炊とは反対方向です。そうするとBODと言わずに「お袋の味」とでもというと流行るかもしれません。
 
EPUBなどの電子書籍が普及する過程は、とりあえずは形を欲しがる著者と読者にはBODで提供し、形にこだわらない著者と読者にはEPUBで提供したらどうでしょうか?


CSSではイメージの表示サイズをどのように決めているか?

イメージの大きさの決定について、CSS 2.1仕様との関係を整理しておきます。
この記事は、昨日の「EPUBで画像の大きさを指定する方法について、続きです」の続きです。初めての方は、前の記事をお読みいただくとわかりやすいと思います。
1.非置換インラインとは
CSS 2.1の3.1 定義に置換要素の定義があります。
http://www.w3.org/TR/CSS2/conform.html#replaced-element
置換要素とはイメージ、埋め込みオブジェクト、アプレットなど、内容が普通の要素とは別のものに置換されて可視化されるものとなっています。置換要素には固有な大きさ(width、height)があることが多いという説明があります。
ここから「非置換のインライン要素」というのは、画像などではないインライン要素(spanなど)のことであることがわかります。span要素のような通常の文書内のンライン要素にwidthを指定したとしても、CSSではwidthの指定は適用されず無視されることになります。
2.画像の表示サイズの決定
前回のケース4でdivに幅を指定したとき、その子供のimgの表示サイズは次のようになっていました。
(1)ブラウザやAdobe Digital Editionsではimgにwidth:100%を指定しないとイメージ固有の大きさで表示されwidth:100%を指定したときに初めて、親のdiv要素に指定した幅で表示される。
(2)iBooksはimgにwidth:100%を指定しなくても親のdiv要素に指定した幅で表示される。
2種類の挙動のうちどちらが正しいのでしょうか?
CSS 2.1の仕様では「10.3幅とマージンの計算」の「10.3.2 置換インライン要素」の項
http://www.w3.org/TR/CSS2/visudet.html#inline-replaced-width
に次のような記述があります。
「もし、heightとwidthが共に’auto’になり、かつ、要素が固有の幅をもつならば、固有の幅をwidthの値として使用する。」
widthもheightの初期値は’auto’です。「imgになにもwidthを指定しない」とwidthの値は初期値の’auto’になりますのでこの記述が適用されます。
つまり、imgにwidthもheightも明示的に指定しない場合はイメージの固有サイズで表示するのが正しいことになります。
このことからiBooksの挙動はCSS2.1の仕様とは違うということになります。


EPUBで画像の大きさを指定する方法について、続きです

1昨日のEPUBで画像の大きさを指定する方法について、もう少し継続して調べてみました。
XHTMLファイルの構造は次のようになっています。
<div …>
<img src="画像ファイルへのパス" … />
</div>
ケース1、ケース3は直接imgに対してwidth属性またはCSSのwidthプロパティで幅を指定しました。この両方ともブラウザやAdobe Digital Editionsでは幅指定が有効になります。これは正常な動作と思います。
ケース2は、img要素の親要素であるdivにwidth属性を指定しました。
ケース4は、img要素の親要素であるdivにCSSのwidthプロパティで幅を指定しました。
ケース2は、ブラウザやAdobe Digital Editionsでは幅指定が無視されます。XHTML1.0の文書型を調べると、width属性を指定できるのは、img、table関連の要素オブジェクト要素などとなっておりdivにはwidth属性は指定できません。従って、divに指定したwidth属性を無視するのは正常と思います。
問題はケース4です。CSSのwidth属性は、CSS2.1仕様をみると「非置換のインライン要素と表の行を除く全て要素に適用できる」とあります。非置換ってわからないのですが、divはインラインではないのでwidthを適用できるはず。で、なぜ、画像の幅が期待通りにならないのか?
調べてみますと、どうやらimgに指定した画像ファイルのもともとの大きさが幅1024ピクセル、高さ768ピクセルと大きいのですが、imgに幅を指定していないので、画像ファイルのサイズのままで表示しているようです。
それで今度はimg幅を明示的に指定してみました。CSSを簡単に書くとこのようになります。
div {
width:30%;
}
img {
width:100%;
}
つまり、imgの親要素のdivに幅を指定し、img自体にはその親要素の表示幅に合わせて画像を表示するように指定します。
そうすると今度はブラウザでもAdobe Digital Editions でも画像が期待した大きさで表示されます。どうもこれが正しいようです。
iBooksはimgに100%指定がなくてもあるものとして解釈しているようですね。やはりiBooksは特殊というべきでしょうか。
○結論としては、現時点で、ブラウザ、Adobe Digital Editions、iBooks(1.2)で共通になるようなイメージの大きさ指定は、このケース4の方法しかない、ということになりそうです。
○テストデータ
Case4aファイルをダウンロード


EPUBで画像の大きさを指定する方法を調べた。

EPUB2.0で画面に表示される画像の大きさを指定する方法を調べてみた。
ちなみにEPUB2.0の仕様をみると
(1)XHTMLのimg要素を使うことができるが、属性としてwidthを使えるかどうかは明記されていない。XHTML1.1と同じであればimgにwidth属性を使えるはずである。
(2)使えるCSSのプロパティリストにはwidthがある。
1.次の4つのケースでデータを作成
ケース1 imgのwidth属性の値としてイメージの大きさを指定する
ケース2 imgの親のdivにwidth属性の値としてイメージの大きさを指定する
ケース3 imgにCSSでイメージの大きさを指定する
ケース4 imgの親のdivにCSSでイメージの大きさを指定する
2.表示結果
ケース1 Adobe Digital Editionsで期待通りの大きさになる。iBooksでは大きさ指定が無視される。
ケース2 Adobe Digital Editionsも、iBooksも共に大きさ指定が無視される。
ケース3 Adobe Digital Editionsで期待通りの大きさになる。iBooksでは大きさ指定が無視される。
ケース4 Adobe Digital Editionsでは大きさ指定が無視される。iBooksでは期待通りの大きさになる。
iBooksについては、次のブログでも類似の実験結果が紹介されている。
http://www.pigsgourdsandwikis.com/2010/05/controlling-image-size-in-ibooks-on.html
iBooksで画像の大きさを指定するには、imgに対してwidthを指定してもだめで、imgの親のdiv要素にCSSを使ってwidthを指定する必要があるということになる。Adobe Digital Editionsやブラウザ(下記の参考を参照)では、img自体のwidth属性やimgにCSSで指定したwidthが有効になるので、iBooksとAdobe Digital Editionsやブラウザの挙動はまったく異なっている。
このようにiBooksが他のReaderやブラウザと互換がないのはとても困る。かなり大きな問題ではないだろうか?将来のバージョンで変更になることを期待したい。
※使用したバージョン
Adobe Digital Editions:1.7.2
iBooks:1.2.1
CSSでのwidthの値は次の4種類を試した。
.a {width:200px;}
.b {width:100pt;}
.c {width:30%;}
.d {width:10em;}
○参考としてInternet Explorer(8.0)とFireFox(3.6.16)でも試してみた。
ケース1 IE、FF共にwidthの値にemで指定したときを除き、画像が期待通りの大きさになる。
ケース2 IE、FF共に大きさ指定が無視される。
ケース3 IE、FF共に画像が期待通りの大きさになる。
ケース4 IE、FF共に大きさ指定が無視される。
つまりブラウザでは、imgに指定したwidth属性もimgにCSSでwidthを指定した場合も両方とも意図通りに表示されるが、divそのものやdivにCSSでwidthを指定しても無視される。
○テストデータ
Case1ファイルをダウンロード
Case2ファイルをダウンロード
Case3ファイルをダウンロード
Case4ファイルをダウンロード


EPUBのフォント埋め込みについてのメモ

EPUBにおけるフォント埋め込みについて少し調べてみましたのでメモとして整理しておきます。
1.@font-face規則とフォント埋め込み
CSSではフォントリソースを指定する@font-faceルールが規定されている。@font-faceルールを使って閲読環境にないフォントリソースを指定しておき、そのフォントリソースをスタイルシートで利用することができる。EPUBではフォントリソースをEPUBファイルに同梱して、そのリソースを@font-faceで指定することでフォント埋め込みを実現している。
2.@font-face仕様の変遷
2.1 CSS2.0
@font-faceはCSS2.0で規定されている。
15.3.1 Font Descriptions and @font-face
2.2 CSS2.1
しかし、@font-face規則はCSS2.1で削除された。CSS2.1は@font-faceをサポートしない。
2.3 CSS3
@font-faceはCSS3で復活する。
CSS3仕様書: 
CSS Fonts Module Level 3
http://www.w3.org/TR/css3-fonts/#font-face-rule
2.3.1 @font-face
@font-face { }
の形式は descriptor: value; のリスト。
font-family:ファミリー名;
src: url(上記ファミリー名フォントのリソースURI);
とするとダウンロード可能なフォントを記述できる。
ダウンロード可能なフォントはそれを参照している文書のみで利用可能とするべき。
ローカルフォントを使いたいとき
src: local(フォントフェース名);
3. EPUBの場合
3.1 EPUB2.0
EPUB2.0 Open Publication Structure (OPS)仕様では@font-faceルールを利用可能としている。次の記述子をサポートする。
・font-family
・font-style
・font-variant
・font-weight
・font-size
・src
3.2 EPUB3.0
http://idpf.org/epub/30/spec/epub30-contentdocs.html#sec-css-fonts
(4月19日現在)
EPUB3.0では、@font-faceルールをCSS3 Fonts に従って使うこととされている。
閲読システムは、最低限、次の記述子をサポートする。
・font-family
・font-style
・font-weight
・src
・unicode-range
4. フォントファイルの難読化
フォントファイルなにも細工しないでEPUBに同梱すると、EPUBはZIP形式なのでZIPを解凍してフォントファイルを取り出すことができてしまう。この防止のため、EPUBのファイル形式を定めるOpen Container Format(OCF)でフォントをそのままでは利用できないようにする難読化の方法が提案されている。
4.1 OCF2.0
Font Embedding for Open Container Format Files
http://idpf.org/epub/20/spec/FontManglingSpec.html
(日本語訳)Open Container Format ファイルへのフォントの埋め込み
http://lost_and_found.lv9.org/FontManglingSpec_ja.html
4.2 OCF3.0
EPUB Open Container Format (OCF) 3.0
「5 Font Obfuscation」の項
http://idpf.org/epub/30/spec/epub30-ocf.html#font-obfuscation
※このメモの内容は、cassupportの日記の(4/19)に書いた内容とおおよそ同じです。
http://d.hatena.ne.jp/cassupport/


EPUB作りにおけるコンテンツとレイアウトを分離することの重要性

EPUBを作る上では、コンテンツとレイアウトを分離することが重要な理由を少し説明します。
1980年代の中ごろにWYSIWYGという技術が登場して、ワープロからDTP(デスクトップ・パブリッシング)までWYSIWYGを実現するソフトが大人気です。
 
最近の若い社員にはWYSIWYGという言葉を知らない人も見受けられますが、WYSIWYGとは、What You See Is What You Getの頭文字を集めた言葉で、その意味するところは「画面で見たとおりにプリントが得られる」ということです。
 
一見、画面が主体のようですが、これは、紙に印刷することを想定して画面上でレイアウトするという方法にもつながります。すなわち、紙をコンピュータの画面上で仮想する、すなわち、画面上で紙のまねをすることです。
 
問題点は紙は用紙の規格がいくつかに決まっており、その用紙に印刷することを予め予想してレイアウトすることになります。つまり、A4に印刷することを想定して、画面上をA4用紙に見立ててレイアウトし、そのレイアウトした状態を保存、印刷することになります。
 
この四半世紀に発展してきた印刷物制作のこのような方法は、読書端末上をつかって読むEPUBのような電子書籍制作ではかなり難しくなります。電子書籍端末の画面の大きさ(縦・横のドット数、その比率)は端末毎にばらばらなのに加えて、EPUBでは、リーダでEPUBを表示した状態で文字の大きさの設定を変更できます。そうなりますと、1行の文字数、画面の行数が変わります。特定の画面サイズを想定したレイアウト結果はめちゃくちゃになってしまいます。
つまり、大きさが固定の紙に対するレイアウトという、従来のやり方が通用しないのです。このようなときには、コンテンツとレイアウトを分離しておいて、レイアウトは出力装置にあわせて自在に切り替える仕組みが有効になります。ということで、コンテンツとレイアウトの分離方法の詳細についてはまた後日。
 
○コンテンツとレイアウトを分離する制作を徹底追及するCAS-UB
http://www.cas-ub.com/


CAS-UB出版プロジェクトを募集しています。

アンテナハウスでは、電子書籍(PDF, EPUB)を編集・制作するWebサービス「クラウド型汎用書籍編集・制作サービス(略称:CAS-UB)」を開発しています。
 
CAS-UBは現在商用化に向けて、機能の充実を図っていますが、このためにCAS-UBを実際に使って書籍を制作していただけるグループを募集しています。実証実験として電子書籍を実際に作っていただきながら、ご意見を伺い、サービス機能の拡充を行なっていきたいと考えています。
 
募集期間は4月から6月までとなっています。この間にご応募いただきましたグループの方には1年間、無償で出版プロジェクトを設定してお使いいただくことができます。
 
関心をお持ちの方は、下記のWebページをご参照の上、弊社までご連絡ください。
なにとぞ、よろしくお願いします。
 
○CAS-UB出版プロジェクト募集の詳細
http://www.cas-ub.com/user/index.html#user2
 


EPUBセミナーのUSTREAM録画

アンテナハウスでは、「クラウド型汎用書籍編集・制作サービス」(CAS-UB)を6月から開始する予定で、鋭意開発を進めております。CAS-UBにつきましては、2月と3月にセミナーを開催してご案内しました。次のセミナーの予定についての問い合わせもいただいていますが、現在、次のセミナーの予定はいまのところ未定となっています。
 
そこで、関心をお持ちの方向けに、UTRSEAMの録画を紹介させていただきます。
 
○3月29日に開催しましたEPUBセミナーのUSTREAM録画はこちらでごご覧いただくことができます。
http://ustre.am/:VecR
 
録画をご覧いただき、なにか、ご質問がございましたらサポートのフォーラムにてお問い合わせいただけると幸いです。
○サポートフォーラムは次になります。
http://groups.google.com/group/cas-support
どうぞ、よろしくお願いします。 


明日、CAS-UBと「EPUB3.0標準化の行方」セミナー開催。USTREAM放映も致します。

明日、3月29日 18時30分より、「EPUB3.0標準化の行方」セミナーは、予定通り開催します。また、前回に続き、UStreamで放映も致します。
ご参加ご希望の方は、次でお申し込み下さい。
☞ 予約申し込み専用ページ
http://www.exism.co.jp/contact/form/seminarinq.html
また、UStreamの放映も行ないますので、遠隔地の方々、ご来場が難しい方々は、UStreamでご覧いただければと思います。
番組登録は次のページでご覧いただくことができます。
☞ 番組アクセスはこちら
http://www.ustream.tv/channel/cas-ub-epub-seminar


Pages: Prev 1 2 3 4 5 6 7 8 9 10 11 Next