Daxter Music

Kindle

：HTMLとCSS

本文へ

目次を見る

contact

Kindleで使用可能なhtmlとcss

さて実際に電子書籍の制作を開始します。ここまでくればhtml経験者は楽だと思いますが、電子書籍作成の根幹となる大切なポイントを押さえておきましょう。

電子書籍(Kindle)制作で特に注意したい点
本文 ユーザーが端末上で変更できるようにするため、本文にはなるべくfont size、familyなどの値を与えないようにします。
要素の中央寄せ インラインで<center>タグは使わずに、text-align:centerや左右に当分のマージンを設定することで実現してください。
改ページ Kindleでは改ページに<br>タグは使用しません。Wordでエンターキー連続で改ページをするのがタブーなのと同じです。強制的に改ページをしたい箇所では
page-break-before:always
および
page-break-after:always
というcssを使用します。beforeは指定のタグの前で、afterは後で改ページされます。
太字・斜体 基本的に強調のために限られた箇所に対してのみ使用します。本文のデフォルトとしては使用してはなりません。
マージン(余白) px(ピクセル)やウェブページなどで推奨されているem指定も避け、解像度が多種多様な各タブレット端末への最適化手段として%（パーセンテージ）指定で行いましょう。

例えば太字(←これです)が大好きな人いますね。初心者の方は「こうやったほうが目立つかな」と考えてしまうかもしれませんが、そんな必要はありません。引用文などを斜体にする程度で良いと思います。マージンに関してはウェブページとは違いパーセンテージ指定が好ましいです。なぜならタブレットによっては4倍近い解像度の差があるためイメージと違う余白になってしまうおそれがある為です。改ページは"章ごと"くらいの頻度で行いましょう。

ページの始めに戻る

METAタグ

実際のhtmlソース部分を見ていきましょう。metaタグはそれぞれに意味がありますので、変換ツールもデリケートです。エラーを回避するには以下のソースをコピーペーストして使うのも良いでしょう。

METAタグ
METAタグの例1
 <?xml version="1.0" encoding="utf-8"?>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>
タイトル
</title>
<meta name="author" content="著者名" />
<meta name="description" content="書籍の内容" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

とりあえずタイトル、著者名、書籍の内容までを含ませましたが、これらに加え各種詳細情報はKDPにログインすれば編集が可能です。

ページの始めに戻る

実際に使用するhtml

実際のhtmlソース部分を見ていきましょう。SEO（検索エンジン対策）は必要ありませんが、見出しタグなどを上手く活用してレイアウトしていくと良いでしょう。電子書籍も基本的にはテキストベースですので使うタグは多くありません。

Kindle向けにおさえておきたいhtml
h1 h1は書籍のタイトルと同じか同等のものに使用します。大見出しのことです。
h2 ウェブでは1度のみ使用というケースも多いですが、電子書籍には"章ごと"くらいに用いても良いでしょう。とにかく大きな区切りを意味します。中見出しのことです。
h3、h4、h5、h6 h3、h4は小見出しのことです。適宜挿入しましょう。h3ないしh4あたりまではよく使います。
p htmlでは文章の一まとまりをpタグに入れて表現します。
br 改行時には<br>タグを用います。ただしこれは2つ連続では使用しません。余白を入れたい場合は別のpタグやdivタグを用いるか、cssでmarginの設定を行います。初心者の方がよくやってしまう<br>タグの連続によるレイアウトは絶対に避けましょう。
  その他のタグは随時追加掲載していきます。

※h1～h6は見出しのことです。ウェブと違い電子書籍では必ずしも使用する必要はありませんが目印の意味にもなりますので挿入するほうが良いでしょう。brの連続入力は控えるというのはウェブと電子書籍の共通次頁と認識してください。brが二つ続いたらほっぺをつねりましょう。

ページの始めに戻る

cssの小技集

Kindle向けにおさえておきたいcss
見出しに改ページを設定する h3 {page-break-before:always;}
改ページが必要な場合は、次の要素にあらかじめcssを指定すると良いでしょう。
  その他のCSSは随時追加掲載していきます。

改ページに関してはしっかりと指定しましょう。結局のところはMETAタグや書籍自体のフォーマット作業などに気を使う部分が大きく、コンテンツ部分はさほど難しくありません。またhtmlを知らなくてもwordやその他のソフトウェアでも電子書籍向けファイルの作成をサポートしてくれますので使いやすいものを選択すると良いでしょう。(無料のものから老舗のソフトまでかなりの種類があります。)

今回は複数回にわたってKDP向けファイルの作成をまとめてみました。情報はちょくちょく更新して、機会や必要性があれば電子書籍としても販売してみようかなと思います。

人気コンテンツ　daxter-music.jp

人気コンテンツ　daxter-music.jp