ページネーション（Pagination）とは？
ページネーションとは、大量のデータやコンテンツを「複数ページに分けて表示する仕組み」のことを指します。
「pagination」の語源は「ページ（page）」から来ており、日本語では「ページ送り」や「ページ分割」とも言います。
ページネーションの目的は？
たとえば、100件の商品や記事があったとき、1ページに全部をズラーっと表示すると見づらくなるし、ページの表示も遅くなる可能性がありますよね。
そこで、ページネーションを使って、
- 1ページに10件ずつ
- 次へ、前へ、1、2、3…といったリンク付き
などに小分けして表示します。
これにより、ユーザーが快適に情報を探せるようになるんです。
よく見るページネーションの例
| 表示例 | 説明 |
| « 前へ 1 2 3 4 5 次へ » | 数字と「前へ」「次へ」が並んだタイプ |
| [もっと見る]ボタン | ボタンを押すと次のコンテンツが読み込まれる |
| スクロールで自動読み込み | 下にスクロールすると次のページが出てくる |
ページネーションのメリット
- ページが軽くなる（読み込みが速い）
- 見やすく整理される（情報が整っている）
- SEO（検索エンジン最適化）にも有利な設計ができる
- ユーザーが探している情報に素早くアクセスできる
ページネーションが使われる場所
- ブログやニュース一覧ページ
- 商品を並べるネットショップ（ECサイト）
- 検索結果画面
- 管理画面のデータ一覧（ユーザー一覧、注文履歴など）
ページネーション vs 無限スクロール
| 項目 | ページネーション | 無限スクロール（Infinite Scroll） |
| 特徴 | 手動でページ移動 | 自動で読み込み |
| 向いているもの | 情報を探すとき（例：検索、商品探し） | 気ままに閲覧したいとき（例：SNS、画像系） |
| 操作感 | わかりやすい、目的のページに飛べる | スムーズに見れるが、戻るのが難しい |
まとめ
ページネーションとは、たくさんある情報を複数ページに分け、ユーザーが見やすく操作しやすいようにする仕組みです。
特に、検索結果や商品一覧など、「探す・選ぶ」行動が多い場面においてとても役立ちます。