Q. 画像が粗く、文字が潰れる

ブックのテキストが細かい場合、どうしても文字が潰れたり、見難くなる場合があります。
拡大時に粗くなる、もしくは拡大時は正常だが標準画像の際に粗くなる/ぼやけて見える場合の対処方法をご紹介いたします。

【基本情報】

ebook5はPDFをブック形式に変換する際に以下の3種類の画像データを自動作成しています。

・標準で表示される画像(通常画像/medium)
・拡大時の画像(拡大画像/large)
・左側メニューのページ一覧に表示されるサムネイル画像(サムネイル/small)

 
上記をふまえた上で、以下対処方法をご参照ください。

【対処方法1】ブックを作成し直す
【対処方法2】元PDFとブック化時の画質の差を減らす
【対処方法3】高画質を最初に表示する

【対処方法1】ブックを作成し直す

ebook5はより良いサービスの提供を目指し、常にアップデートを行っております。
管理画面でのブック作成システムやビューアが更新されている可能性がありますので、
同じデータでもブックを作成し直すと改善する場合がございます。

空きスロットがある場合は、同じデータでの「ブックの新規作成」をお試しください。

主なアップデート情報は「お知らせ」ページに記載されています。
(※細かな修正はお知らせに記載しない場合もございます)

【対処方法2】元PDFとブック化時の画質の差を減らす

ページ拡大時に倍率を上げると拡大画像の大きさ以上に拡大するため、小さなテキストは文字が滲んで見えたり、写真が粗く表示されることがあります。
また、画質選択画面で元PDF画像のサイズよりも大きなサイズ(高画質)でアップロードすると画像が粗く表示されることがあります。

【高画質ブック】 【中画質ブック】 【低画質ブック】
拡大画像
(長辺最大)
3,000px 2,000px 1,600px
通常画像
(長辺最大)
960px 640px 640px
サムネイル
(長辺最大)
100px 100px 100px

拡大アイコンを押す前の状態は、上記の中の「通常画像」にあたります。
モバイル端末での閲覧者が多い昨今、「閲覧者は気になる部分や細かな文字は拡大をする」ということを前提としているため、通常画像は詳細に綺麗に表示させるよりもロード時間を少なくスムーズに全体像を表示させることを優先としております。
よって、通常画像は拡大ボタンを押した後の画像よりもぼやけて見えることがございます。

ブック化する際に高画質を選んだ場合ページの最大長辺(見開きではなく単ページを基準)は3,000ピクセルになります。
高画質を選択してPDFをアップロードすると3,000ピクセルに変換されるため、元PDF内にある写真や画像等のラスターデータの画質によっては引き伸ばされて画質が低下します。
元のデータにより近いピクセル数を選択していただくと変換時に画質が低下しにくいため、高画質で画質の低下を感じる場合は中画質でアップロードすることもお試しください。

また、他の改善例として、
・フォントを変更する
・アウトライン化する(3,000ピクセル以上の画像データは画質の低下が少ないため。画像のためテキスト検索はできなくなります。)
という方法もあります。

【対処方法3】高画質を最初に表示する

《外部サーバー公開機能を使用されていて、「リソースファイルをダウンロード」にチェックを入れている方限定》

上記をふまえた上で行う、少し高度な作業です。
外部サーバー公開機能を利用して「リソースファイルをダウンロード(開発者向)」にチェックを入れると、画像ファイルも含めてダウンロードをすることが可能です。

ダウンロードしたデータの「contents」>「image」>「book」内に画像用フォルダがあります。「large」拡大画像、「medium」通常画像、「small」サムネイル画像のフォルダになります。

ブック閲覧時に初期表示されるのは「medium」通常画像になりますが、指定先(Path)を「medium」→「large」に変更することで初期表示される画像を「large」拡大画像にすることができます。ebook5Data.jsを編集する方法です。

ebook5Data.js 編集方法

・「js」>「ebook5Data.js」を開く
・「medium」指定を「large」に変更する(赤枠部分)

※画質が改善できる可能性はありますが、高画質になった分、表示速度が遅くなる可能性もあります。

リソースファイルの編集は誤った操作を行うと不具合が生じる可能性があります。リソースファイルの改変により生じた不具合についてはサポート対象外となっておりますので、予めご了承の上、慎重に作業をお願いいたします。

参考リンク:外部サーバー公開機能設定リファレンス


【検索用キーワード】
ぼやける/画質が悪い/粗い/粗くなる/低くなる/低い/見づらい

Tagged: