似ている小説目次デザインの比較と、それぞれのメリット/デメリットを紹介

シンプル目次とは？

まずはデモページ↓を見に行ってください

1. 庇護：CSSベースのみシンプル目次
   
2. ルッチ過去編：ラテ式CSS拡張版たて並び中央左端揃え

この２つの何が違うのか、どう使い分ければいいか、ポイントを説明します。

CSSベースのシンプル目次

CSSベース目次の特徴

• 「小説の表紙」または「章のページ一覧」で表示可能なデザイン
  
• 目次ページ内における解説が全話空欄の場合、自動的に目次の境界線が非表示になる。
  
• 各話タイトル自体は左端揃えだが、文字数が全体的に少ないと、自動で中央に表示される。（１話でもタイトルが長いと左へ寄る）

CSSベース目次のメリット

• マイテーマ不要。無料会員はマイテーマ上限20個なので、気軽にデザイン着せ替えができる
  
• 小説内の章ごとにデザインを切り替えできる（例：第一章は解説ゼロでシンプル目次、第二章は各話に解説を付ける、など）
  
• 何も考えなくても自動的にいい感じにタイトルが中央寄せになる

CSSベース目次のデメリット

• タイトルとタイトルの間に「見出し」や「キャプション」を挿入できない
  
• 一ヶ所以上の解説欄を埋めるとシンプル目次は実現できない（境界線が発生する）
  
• 各話タイトルのフォントは「見出し/サイト名」と同じ（これはメリットでもある）
  
• 右端揃えにはできない（好きな位置に目次を表示できない）
  
• 完全な中央揃えにはできない

CSS拡張版のたて並びレイアウト

拡張版たて並びの特徴

• タイトル間に「見出し」「キャプション」を挿入できる
  
• 全４パターンの配置レイアウト（左端/中央/右端揃え・左端揃え中央寄せ）

拡張版たて並びのメリット

• マイテーマ必須なので、自分で好きな追加CSSを書ける
  
• 配置レイアウトを4パターン選べるので、よりこだわったデザインを実現可能
  
• 「見出し」や「キャプション」で目次に情報を詰め込める

拡張版たて並びのデメリット

• マイテーマ必須なので、無料会員はマイテーマ上限20個を気にしなくてはいけない（有料会員はマイテーマ無制限）
  
• 自分で追加CSSをマイテーマにコピペしないといけない（たて並びレイアウトは自動では実現できない）
  
• 各話タイトルのフォントはコンテンツ本文と同じ（これはメリットでもある）

以上です。まずは実際に試してみてください。