ヘルプ | サインイン

このページの使いやすさを評価してください


非常に満足

満足

不満

ご協力ありがとうございます。ご意見は今後のサービス改善の参考にさせていただきます。

問題や不明点がありましたら、こちらからお問い合わせください。

ヘルプトピック

お問い合わせ

フィードバックがありますか? ヘルプページで回答が見つかりませんでしたか?

お問い合わせ

画像のガイドライン - リフロー型

ここで説明するガイドラインは、画像が中心の固定レイアウトの絵本・児童書やグラフィック ノベル、漫画、コミックを除く、リフロー型のフィクションまたはノンフィクションの本に適用されます。表紙画像のガイドラインを参照してください。

目次


サポートされている画像入力形式

Kindle 端末および Kindle アプリでは、TIFF や複数フレームの GIF、または透過部分のある画像はサポートされていません。

  • KF8 では、GIF、BMP、JPEG、PNG、SVG 画像がサポートされています。
  • 改善されたタイプセットでは、GIF、JPEG、および PNG がサポートされています。改善されたタイプセットでは SVG 画像はサポートされていませんが、SVG のラスタライズは部分的にサポートされています。

画像を図解、チャート、表、地図、またはテキストを含むものに使用する場合、Kindle に表示された状態で、図表や文字が十分に読みやすくなるようにしてください。

ソースに画像を追加するときは、標準 HTML の タグを使用します。コンテンツを理解するうえで不可欠な画像の場合、支援テクノロジーを使用する利用者向けに、alt 属性を使用してその意味を伝えるテキストを提供します。alt テキストは 140 文字未満で、画像とその意味を説明する必要があります。コンテンツの理解に必須ではない、装飾目的の画像の場合、またはページ上の周囲のテキストに画像の十分なコンテキストが提供されている場合、支援テクノロジーが無視できるよう、alt 属性は alt ="" のように null にしてください。

重要: 画像ファイルのカラー プロファイルには RGB を指定してください。Kindle は sRGB と CMYK をサポートしていません。




画像のサイズおよび品質の基準

画像は、目的の表示サイズの 300 ppi の最小品質基準を満たす必要があります。余白、欄外見出し、ページ番号、キャプションの余地を考慮したフル ページ画像の最小基準は、画像サイズ 4 × 6 インチです。この画像は、300 ppi で 1,200 x 1,800 ピクセル以上にする必要があります。以下の用語は、特定のユース ケースを定義し、この基準を満たす方法の例を提供します。

  • 重要な画像/重要ではない画像。 コンテンツを理解するうえで不可欠な画像は、重要なものとされます。重要な画像の例としては、キャプション付きの画像、地図、表、数式、ライン アート、イラスト、写真などがあります。すべての重要な画像は、300 ppi の最低基準を満たす必要があります。装飾目的のみ、またはコンテンツに付加価値を与えない画像は、重要ではないとされます。重要ではない画像の例としては、裏表紙、装飾文字、ソーシャル メディアのアイコンなどがあります。
  • 表紙画像。 表紙画像は常にフル ページ レイアウトとし、幅は 1,200 ピクセル、または高さは 1,800 ピクセル以上にする必要があります。
  • ブロック画像。 Amazon では、高解像度の画像と、利用可能な最大のレイアウトを使用することをお勧めします。Amazon では、4 x 6 インチの正規端末では 300 ppi としています (1,200 x 1,800 ピクセルに変換)。画像の最大レイアウトを計算するには、画像のピクセル幅または高さを 4 x 6 インチ (1,200 (幅) x 1,800 (高さ)) の画面で割ります。image タグ内で画像の % 幅または % 高さを指定することは、画像が占める画面の割合を計算するために必要です。 Amazon の 300 ppi 要件を満たすための最小ピクセル要件については、以下の表を参照してください。

画像レイアウトの幅または高さ

必要な最小ピクセルの幅

必要なピクセルの高さ

100%

1,200

1,800

80%

960

1,440

60%

720

1,080

40%

580

720

注: Amazon では、重要な画像を 40% 未満でレイアウトすることはお勧めしません。

画像のコード幅や高さの例を以下に示します。

  • 幅または高さは image タグで直接指定できます (太字テキストを参照)。

    例:

    <img src="happy.gif" alt="Happy face" style="width:70%">

  • 幅または高さは親 div タグで指定できます (太字テキストを参照)。

    例:

    <div style="width:50%">

    <img src="image4.png" />

    </div>

EPUB の最大ファイル サイズは 650 MB です。KindleGen では、Kindle 用コンテンツを最適化するために画像の自動変換が行われます。



レスポンシブ レイアウトの画像サイズ

width スタイル属性でパーセンテージの値を使用して、ブロック画像とフロート画像をスタイル化することをお勧めします。これにより、端末の解像度に関係なく、画像が画面の大きさに対して同じパーセンテージで表示されます。インライン画像は、ユーザーが端末のフォント サイズを調整したときに画像の周囲のテキストに対して縮尺を変えられるように、em でサイズ設定する必要があります。



カラー画像を使用する

どの Kindle 端末や Kindle アプリでも快適な読書体験を提供するために、カラー画像がふさわしい箇所では可能な限りカラー画像を使用してください。画像が写真の場合は、 JPEG 形式にします。

現時点では E-reader 端末しか利用できないマーケットプレイス用の本でも、将来的な互換性のために、可能な限りカラー画像を使用することをお勧めします。




写真は高解像度の端末用に最適化する

写真には JPEG 形式を使用し、高画質で保存するようにします写真はファイルのサイズ制限内で利用できる最大解像度のものにします。

300 x 400 ピクセル未満の写真は端末の解像度に基づいてサイズが調整されるため、不鮮明になることがあります。小さいサイズの画像を表示する場合は、大きいサイズの画像を CSS で目的のサイズに縮小します。

Amazon では、どの端末でも 2 倍に拡大表示してきれいに見える画像を用意することを推奨しています。たとえば、端末の画面いっぱいに表示する画像ならば、画像の幅を 3200 ピクセル (最高解像度の端末である Kindle Fire HDX 8.9 インチの画面幅の 2 倍) にします。画像が小さい場合は、これを踏まえてサイズ変更してください。

写真が GIF 形式である場合、あるいは小さすぎる場合は、JPEG に変換または意図的にサイズを拡大しても品質は向上しません。元のファイルから、十分な解像度で JPEG 画像を作成してください。

写真によっては、画質 300 ppi 以上の画像を入手できない場合があります (歴史的な写真のため入手困難など)。このような場合は、可能な限り最高品質の画像を使用します。300 ppi 以上の画像を使用することを強くお勧めします。72 ppi 未満の画像を使用すると、本の変換に失敗します。




ラインアートとテキストには GIF または PNG を使用する

ラインアート画像は、限定された数の単色で描かれたグラフィックです (Adobe Illustrator、Microsoft ペイント、Microsoft PowerPoint で描かれた画像など。白黒画像を含む)。テキスト、グラフィックス、チャートおよび表は、ラインアートの画像の例です。

ラインアートには GIF または PNG 形式を使用してください。JPEG アルゴリズムは画像の一部を混合しようとするため、ラインアートのシャープな縁がぼやけてしまい、画像 (および画像に含まれるテキスト) が不鮮明になります。

ラインアート画像で表示されるテキストは鮮明で読み取り可能であるものとします。

KindleGen で処理を行う前に、ラインアート GIF を最適化してください。リサイズまたは JPEG 圧縮を行うと、不鮮明になったり不自然な画像になります。このような問題を防ぐために、ラインアートには GIF または PNG ファイル形式を使用することをお勧めしています。

GIF および PNG を最適化して画像サイズの制限内に収めるには、次のヒントを参考にしてください。

  • 使用する色の数を減らしてください。これは多くの場合に画像の品質を変えることなく実行できます。特定のアンチエイリアス処理アルゴリズムによって、白黒に見えるラインアート画像が実際にはカラーの場合があります。次がその例です (左側の写真の「A」の周りの赤と青のシェードに注意してください)。



  • 画像周辺の白色の縁を取り除いてください。切り取りに際しては、白、セピア、ミント、または黒の背景に設定されている端末上で、どのように見えるかを確認してください。
  • 必要に応じて画像のサイズを変更してください。この場合、テキストの視認性に注意してください。詳しくは、「ラインアートおよびテキスト用の画像およびフォント サイズの要件」セクションをご覧ください。


ラインアートおよびテキスト用の画像およびフォント サイズの要件

テキストを含む画像は、Kindle の画面サイズより大きくしないようにします。Kindle E-reader 端末では、画面のスペースをより良く活用できるように画像を回転できます。Fire タブレットおよび Kindle for iPhone アプリでは、ズームおよびパンの機能を使用することができます。

  • 最小テキスト サイズを 6 ピクセルにします。英小文字の「a」の高さが最小でも 6 ピクセルになるようにします。 「a」の上下に余白がある場合は、画像のサイズを 6 ピクセルより大きくする必要があります。 下の例のように、画像に含まれているテキストが 1 行のみの場合は、周囲のテキスト コンテンツに比例して表示されるよう、画像の高さを 45 ピクセル以上にする必要があります。

アクセシビリティのヒント: 画像内のテキストをスクリーン リーダーや再生可能な点字表示を使用して読むことはできません。画像にテキストのみ含まれている場合、テキストの表示には画像ではなく HTML を使用することをお勧めします。これは、テキストが主体のシンプルな画像に適用されます。



HTML と画像

テキストの大きな塊を画像として表示しないでください。テキストを周囲のアートと切り離すことができる場合は、画像として設定しないでください。その代わりに、HTML にします。テキストが主体の画像は画面に収まるように収縮してしまい、読むことができなくなってしまいます。HTML は次のページにまたがります。




画像のキャプション配置

読者がキャプションを読む前に画像を閲覧できるように、関連画像の下にキャプションを配置することをお勧めします。キャプションが画像の下に表示されるように、個別の <div> タグ内にキャプションを配置します。

例:

<img src="test.jpg" style="display:block" />

<div>これがキャプションです</div>



画像の縦横比率を制御する

画像の縦横比を維持するために、幅と高さの両方を固定パーセンテージで設定することはできません。幅か高さのどちらか 1 つは固定パーセンテージ (100% など) に設定できますが、もう一方は縦横比を保つために「auto」に設定する必要があります。



サポートされている SVG タグと要素を使用する

今のところ、タイプセッティングの改善におけるスケーラブル ベクター グラフィックス (SVG) のサポートは限定的されています。

必須:

  • viewBox は必須で、4 つの値 (最小 x、最小 y、幅、高さ) が必要です。4 つの値はすべて整数とし、最初の 2 つは必ず 0 を指定します。
  • 幅と高さは、割合 (推奨) または整数で指定します。
  • 必要に応じて、有意義な代替テキストに SVG 画像の <alt=> 属性を指定します。

サポート対象:

  • ブロックおよびインライン SVG はサポートされています。
  • 必ず SVG ネームスペースなしの <svg:> のみを使用してください。
  • 子として <image> タグを 1 つだけ持つ <svg> はサポートされています。
  • href 属性の .svg を持つ <img> はサポートされています。
  • .svg の背景画像はサポートされています。この場合、SVG ファイル内の特定要素のみサポートされています: <svg>、<path>、<g>、<polyline>、<polygon>、<rect>、<line>、<circle>、<ellipse>、<radialGradient>、<linearGradient>、<stop>、feGaussianBlur、フィルター、<defs>、<clipPath>、<use>、タイトル。

サポート対象外:

  • <text> を持つ <svg> はサポートされていません。
  • preserveAspectRatio="slice" を持つ <svg> はサポートされていません。特に指定のない限り、デフォルトが自動的に適用されます。
  • transform 属性が使用されている場合、"translate(0 0)" が含まれなければなりません。その他の複雑な transform 属性値はサポートされていません。
  • visibility 属性が使用されている場合、値は "visible" でなければなりません。それ以外の場合、本は変換できません。
  • <a> タグは、<rect> 内でのみ fill-opacity="0.0" と一緒に使用します。<a> は削除されます。

トラブルシューティング:
  • ブラウザーで、SVG 画像を含む HTML ページを開いてください。ブラウザーに表示されない SVG 画像は、タイプセッティングの改善でサポートされていません。
  • タイプセッティングの改善は、25 枚を超える SVG 画像を含む電子書籍をサポートしていません。

予期しないエラーが発生しました。後でもう一度試してください。
セッションがタイムアウトしました

続行するにはサインインしてください

サインイン
edit