Category Archives: 今週の一枚

今週の一枚─002

今週は、新作『太陽の子孫』の表紙を初公開。
実はまだ仮タイトルなんだけど、どうもこのまま行きそうな予感。
時間の問題もあり、今回の手描きになりました。
でも、手描きは本当に修練の不足がそのまま出てしまうよね(不足というか、全くしていないw)。

どうやっても一昔二昔前の少女漫画の出来損ないのようになってしまう──
どうやっても一昔二昔前の少女漫画の出来損ないのようになってしまう──

月狂四郎さんのブログにもあったし、BWインディーズで周囲を見ても、女の子がいる表紙ばっかりだ。まあ、だからというわけでもないんだけど、今回は女の子にチャレンジ。

でもまあ、この絵じゃあ、ジャケ買いは望めないなあ。
妻に言われちゃったんだよ、
「小説を読み終わった小学生が描いたみたい」って。
そりゃあひどいだろ、とも思うけど、現実は厳しい。まあ、余裕があればまた描き直したいとも思いつつ、描き直しても同じじゃないの? とも思ったりする。

手描きの良さもあるよね。
パース感とか、実は、狂ってるくらいの方が僕は好き。なんていうのかな、がちがちに全てが整っていると、広がりを感じないよね。一見ヘタクソそうに見える絵本の絵とか、小さい子供用の本の挿し絵とかね、整っていないことがとてもいい味になる。
完璧なパースを出そうと思えば下絵を3DCGにしちゃえば簡単だし、でもそうはしたくなかったんだ。
あ、もちろん、この絵はダメよ。味がないし、ぎすぎすしている。線がきれいじゃないしね、バランスも悪い。
じゃあ、何でそんなのを販売用の本の表紙にするの? って、それは訊かない百年の約束。

うーん、本当はもう少し骨太っぽいSF調の表紙にしても良かったんだけど、お話にはもちろん美少女が出てくるし、柔らかめの話だし、この場所の絵を描きたかったんだよね。
(あ、全然美少女に見えないって? いいの。心の目で見て!)

そして、この表紙絵にはちょっとした秘密があります。
お話を読み進めると、あれ? っと思って見返して、おお〜っと思うような感じにした積り。

もちろん、発売時には無料キャンペーンをやりますので、お楽しみに!

今週の一枚─001

と、いうことで新シリーズ。
美しいもの、そうではないけどちょっと話のネタにしたいもの。
そういう画像を一枚選んで、週に一度載せることにしました。
初回の今夜は、これ。

もちろん、正しい比率ではない
もちろん、正しい比率ではない

キャプションにあるとおり、この画像は少し平べったく潰れている。DTP用語で言うと、《平体が掛かっている》というやつだ。
どうしてこんな画像を載せたのかというと、これはある電子書籍ストアに出した本の表紙として表示されている状態なのだ。
今日は、どうしてこんなことになってしまうのかという原因と、自戒。

皆さんご存知の通り、書籍には決まった比率というものがない。もちろん、文庫なら文庫の、新書なら新書の標準的な縦横比というものがあるけれど、少なくとも電子書籍には定型というものがない。
ストアによって、出版社によって、著者によって様々な表紙を用意しているわけだ。

もちろん、電子書籍リーダーにも色々な比率があるし、同じアプリでも端末によって変わったりすることもある。
だがしかし!
見ての通り、僕の表紙は平べったい。
epubの設定の中には、当然、画像のサイズや《縦横どちらを優先して画像を拡大・縮小するか》というオプションがあるけれど、epubを書き出す環境によって、そのオプションが自動的に書き込まれている場合と書き込まれていない場合がある。書き込まれている場合には、それを気にしておかなければいけないんだね! という話。

例えば、iPhone(5以降)の場合は、画面がかなり縦長になっている。だから、余白が最も少なくなるようにするには、横幅優先にする必要がある(と思いがち)。だけど、タブレットなどの場合には多くの書籍よりも幅広で、左右が余る形になる。そうすると、逆に縦の長さを優先にする必要があるわけだ。
つまり、縦横どちらかを優先に設定をすると、その電子書籍を表示する端末の縦横比に応じて余白の空き方が全く変わることになってしまう──。

だいたい言いたいことは分かってきてくれたかな?
上に書いた設定は、つまり、電子書籍の表紙に対しては《効果的でない》のだな。

上に画像を載せた『段ボール箱の中の人形』の場合には、img要素に対してcssの設定がこうなっている。

「横優先、それぞれの最大サイズは画面の100%まで」という設定
「横優先、それぞれの最大サイズは画面の100%まで」という設定

これ、どういうことかというと、

縦長の端末では機能するけれど、横長の端末では画像が潰れる設定なのだ。
《画面の横幅に合わせて画像を拡大し、最大でも縦の長さが画面から溢れないようにする。》
ということなので、もしも画像より画面が横に長かった場合、横を100%にすると高さ方向が溢れて画像が切れてしまう。それを防ぐために「max-height:100%」が入っているので、表示側としては画像を潰すしかない、ということになる。

──簡単な結論。

画像サイズはビューワに任せよう。

たまたま今までは不具合が出たことがなかったのだけれど、今回新たに出版したストアで、表示された画像はその縦横比を完全に無視して《画面一杯に引き伸ばされていた》。
おいおい、それはないだろう。と思って初めて色々と調べてみて、自分の側に、というか、変換の際、自動的に埋込まれたcssに問題があることが分かったのだった。

親切に色々と細かな設定が埋込まれるのは良いのだけれど、これはちょっとおせっかいなのかもね。

だから、もし、不具合が起こった場合は、epubをいったん開いてcssの中を覗き、img属性に対して上の画像のような設定が埋込まれていないか確認した方がいいかもしれない。
縦横比が大事なのではなく全ての要素を大きめに表示して欲しい画像がある場合はこの限りではないけれど、思うに、この画像サイズの設定(つまり上の画像なら五行分全て)は消してしまった方が良いのではないかと。
(あ、もちろん、素人意見なので、よくよくプレビューして検証してみてからにしてくださいな。もしやってみる場合は)

縦優先だと多くの場合はきれいに収まるけれど、そうでないこともある。と覚えておかなきゃ。

この記事が、いつか誰かの役に立ちますように!

じゃ、また明晩!