本文へ移動
cccskills
無料GitHub で公開

pagination

Use when auditing paginated content (blog archives, product category pages, search results). Applies to any site with lists or grids of content split across multiple pages.

インストール方法を見る

含まれるファイル(2)

  • SKILL.md2.7 KB
  • references/rule.md5.0 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Use canonicals on paginated pages

Incorrect pagination canonicalization can prevent pages 2, 3, etc. from being indexed, removing valuable content from search results and breaking user journeys from search queries that match content on later pages.

Quick Reference

  • Each paginated page (/page/2, /page/3) should self-canonicalize to its own URL
  • Do NOT canonicalize all paginated pages to page 1 — this is a common mistake
  • Google dropped support for rel=prev/next in 2019 — don't rely on it
  • Use consistent URL patterns for pagination (?page=2 or /page/2, never both)
  • Infinite scroll and load-more UIs still need crawlable paginated URLs or links

Check

Find paginated page sequences (URLs with ?page=, /page/, /p/, or numbered suffixes). For each page, check the canonical tag. Verify that each page self-canonicalizes (page 2 canonical-url = page 2 URL). Flag any paginated page that incorrectly points canonical-url to page 1. If the UI uses infinite scroll or "load more", verify equivalent crawlable pagination links exist.

Fix

Update canonical tags so each paginated page self-references. For /category?page=2, set <link rel='canonical' href='https://example.com/category?page=2' />. Remove any canonical pointing paginated pages to the first page unless those pages genuinely have duplicate content. Add crawlable paginated URLs or fallback links for infinite-scroll interfaces.

Explain

Pagination canonical tags tell Google which URL is the preferred version of each page. Setting all paginated pages to canonical-url to page 1 tells Google that pages 2, 3, etc. are duplicates of page 1 — so Google stops indexing them. Content that only appears on page 3 (for example) then becomes unreachable from search.

Code Review

Identify paginated URL patterns (URLs with page=, /page/, /p/ parameters). For each paginated page beyond page 1, check the canonical tag. Flag any page 2+ that has a canonical pointing to page 1 (the base URL). Verify that page 1 has a self-referencing canonical. Check that pagination URL format is consistent (no mixing of ?page= and /page/). For JS-driven infinite scroll, verify there is still a crawlable path to page 2+ via real links or paginated URLs.


For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/rules/seo/pagination

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

404-page

無料

Use when reviewing templates, rendered HTML, or shared components related to Create a custom 404 error page. Validate the final browser-facing markup, not just the source framework abstraction.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

Use when auditing metadata, crawlability, structured data, or indexability related to Create a dedicated About page. Verify the rendered HTML and HTTP response rather than relying only on source files.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

Use when reviewing component libraries, page flows, or CI pipelines that need repeatable accessibility checks. Automated testing is strongest at catching structural and attribute-level issues; it does not replace keyboard, screen reader, and manual UX testing.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

Use when reviewing sign-in, sign-up, MFA, CAPTCHA, recovery, and re-auth flows. Evaluate the full authentication path, including error handling and backup methods, not just the primary login form.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

Use when reviewing templates, rendered HTML, or shared components related to Make notifications accessible. Validate the final browser-facing markup, not just the source framework abstraction.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Use semantic table markup for screen readers. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

日本語の概要は準備中です。原文の説明を表示しています。

thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

thedaviddias のスキルをすべて見る

このスキルの問題を報告する