検索エンジンやブラウザで検索すると、数多くの検索結果が表示されます。一般的にはページを分割して表示していますが、これが「ページネーション」の役割です。
この記事では、ページネーションの基礎知識から作成方法、注意すべきポイントなどをご紹介します。必要性をしっかりと理解し、効果的な活用を試みましょう。

ページネーションとは

ページネーションとは、Webサイトにおける「ページ数」あるいは「ページを分割する機能」のことを指します。まずページネーションの基礎的な知識と必要性について解説しますので、概要を理解しましょう。

ページネーションの基礎知識

ページネーション（pagination）とは、「丁付け」「ページ割り」といった意味の英単語です。ページ番号やページ送りともいい、長い文章を掲載する際に複数ページに分ける機能のことをいいます。ページ数の多い「検索結果の一覧」や「webサイト」を思い浮かべると分かりやすいでしょう。
HTMLやCSS、JavaScriptなど、さまざまな言語で設定可能です。

ページネーションの設置の必要性

ページネーションは「ユーザーがWebサイトを閲覧しやすくする」という点において、とても重要な役割を持っています。
特に、Webサイトに掲載する文章が長くなってしまう場合は、一度に全ての文を表示するのは時間がかかりますし、どこまで読んでいたのか分からなくなってしまうでしょう。
その点において、ページネーションはとても優秀です。内容を複数ページに分割しているため、1ページあたりの読み込み速度が速くなります。また、ページ数さえ覚えていれば読み返すことも簡単です。

ページネーションによって得られるSEO効果

ページネーションは、ユーザーにとって効果的なだけでなくSEO効果を得ることも可能です。ここでは「UX評価」や「PV数」「読破率」などの視点から、ページネーションのSEO効果について解説します。

UX評価が向上する

「UX（User Experience）」とは、ユーザーが「サービスを通して得られる体験」を指す言葉です。ページの見やすさや読みやすさなどがUXに影響します。
UXにおいて、ページネーションは「Webサイトの表示スピードが速くなる」といった効果をもたらすのです。
表示スピードが速ければ、ユーザーが求めている情報に到達しやすくなるため、該当するページだけでなくWebサイト全体の評価を高められます。

PV数が増加しやすい

ページネーションで別ページへの導線を確保するのは、ユーザーが興味のあるページや異なるページに移動しやすくなる効果があります。導線を確保すれば、Webサイト全体の閲覧数を増加させることが可能です。

記事の読破率が上昇する

1ページに表示する文章が多すぎる場合、ユーザーは読み切らずに別のWebサイトへ移ってしまう恐れがあります。
適切な文章量に調節して次のページへ促すページネーションを設定することで、ユーザーの読破率を高められるのです。

現在Googleではページネーションのサポートはしていない

メタタグとは、Webサイトで扱っている内容などを検索エンジンやブラウザに伝える方法です。Webサイト上では見えませんが、内部SEO・表示されやすさに影響します。
今回主題としているページネーションも、メタタグの一つです。
Google独自の調査データによると、「ユーザーはページネーションされたコンテンツよりも、1ページに情報のすべてが表示されたコンテンツの方を好む」としており、ページネーションタグは2019年3月21日でサポート終了となっています。
また、以前は効果的だった「rel＝next」と「rel＝prev」タグも、2011年にサポートが終了しているため、現在は使えません。

効果的なページネーションを作成するポイント

Webサイトでは、ユーザーにとってストレスなくスムーズに読み切れる環境を整えることが重要です。
効果的なページネーションを作成するには、「文字数」「ページ数」「配置場所」「前後・最後へのジャンプ」などの要素に注目しましょう。

適度な文字数でページを分ける

ユーザーにとって読みやすい文字数でページを分けることは重要です。1ページに表示する内容が多いと表示スピードが遅くなりますが、表示速度重視でページ分けするとページ数が多くなりすぎてしまいます。
ページの分け方は、テーマや内容、Webサイトのターゲットがよく利用するデバイスなどに合わせて調節するのがおすすめです。

ページネーションはサイトの下部に置く

ページネーションをサイトの下に置くことで、ユーザーインターフェース（UI）が良くなります。ユーザーインターフェースとは、ユーザーから見たWebサイトの見栄えや効率などのことです。
基本的にユーザーは「Z」を描くように視点移動してサイトを見ます。そのため、ユーザーが1ページ分の文章を読み終わって続きを見ようとした時に、すぐ次のページへ誘導するには、サイトの下や文章のすぐ下といった場所に、ページネーションを配置するのが効果的です。

現在見ているページがどこなのか認識できるようにする

ページが複数あるWebサイトを見ていると、どこまで読んだのか分からなくなってしまうことがあるでしょう。
現在のページを表示する際は、数字の色を変えたり数字を大きく表示したりする他、太字にするといった工夫すると、一目で分かりやすいのでおすすめです。

表示ページ数は5ページまでにする

ページが多いと、どこまで読んだのかだけでなく、この先どのくらい読み続ければいいのかが分からなくなり、離脱に繋がります。ページ数を確認できること以外に、ページ自体も5ページ程度に納めると、より読みやすいWebサイトになるでしょう。
ページを適度な数に抑えると、モバイルでWebサイトを閲覧するユーザーも読みやすさを感じます。

前後と最後のページに飛べるようにする

Webサイトを閲覧するユーザーの中には、古い情報や全体の情報量を把握するために、最後のページを確認したい方もいます。
また、文章の流れなどを確認するために、前後あるいは最新のページを見るユーザーもいるため、多くのユーザーが読みやすくするためには、前後や最後のページに飛べる導線を用意した方が良いでしょう。

ページネーションを設置する時の注意点

快適にWebサイトを閲覧してもらうのにページネーションが効果的である一方、注意点も存在します。
実際にページネーションを設定する際は、「記述ミス」「ボタンの配置・大きさ」「正規化」「メタタグの扱い」などへの注意が必要です。以下の点に注意して進めると良いでしょう。

URLのミスに注意

ページネーションを設定する際は、URLの記述ミスに注意しましょう。スラッシュの数や文字を間違えてしまうと、正しく認識されません。ユーザーにとって利用しにくくなる他に、Webサイトとしての評価も下がる恐れがあるのです。
実際にWebサイトにページネーションを設置する際は、URLの記述ミスに気を付けましょう。また、URLの構造自体をシンプルにしておくと、記述ミスしにくくなるため安心です。

ページネーションはクリックしやすい大きさに設定する

次のページへ移動する際、クリックするボタンが小さいと、間違えて別のボタンを押してしまうことがあります。ボタンが小さすぎる場合や、ボタンの間隔が狭すぎる場合は、対策を行いましょう。ユーザーが快適にWebサイトを閲覧できるよう、閲覧者の目線でレイアウトを設定してください。

2ページ目以降の正規化を適切に行う

canonicalタグでページネーションを設定する場合は、正しく記述していないと2ページ目以降が検索結果に表示されなくなります。canoncalタグを適切に設定すれば、正規URLへリンクの評価を引き継ぐことも可能です。
全ての内容を一つにまとめたページを用意するなど、適切な方法で正規化してください。

noindex・nofollowを使用しない

noindexは「検索エンジンに表示させない」という役割を持ったメタタグで、nofollowは「指定されたリンクをSEOの評価範囲外にする」という役割を持ったメタタグです。
これらは自身のWebサイトを悪用されないために利用されるメタタグですが、SEO対策においては効果的ではありません。
逆効果になってしまう場合もあるため、使い方や使いどころに注意しましょう。

分割したページのクロール拒否に注意する

クロール拒否とは、情報収集する仕組みである「クローラー」を拒否することです。
「robots.txt」などを利用して分割したページをクロール拒否すると、検索エンジンにWebサイトが認識されなくなります。
多くの場合、Webサイトが検索エンジンに掲載されるようになるには、クローラーに検知されることが必要条件です。そのため、テスト中のページや会員限定ページなどを除いて、基本的にはクロール拒否しないことをおすすめします。

まとめ

ページネーションとは、Webサイトのページを分割する機能のことです。適切にページネーションを設定できれば、ユーザーが閲覧しやすくなり、Webサイトの評価も上がりやすくなります。SEO対策を意識しているなら、なおさら活用してほしい機能です。
Googleでのサポートは終了しましたが、まだまだ注目すべき要素といえるでしょう。