建议：在顶部显示确切的范围，例如“1-20 共350项”，并允许用户通过单击一次将页面大小调整为“10”、“20”或“50”。从用户体验的角度来看，这种方法可以减少混淆，通常可以提高任务完成率，这对于大多数用户来说是一个重要的进步。

使用像 **range** (范围) 和 **total** (总计) 这样的可预测前缀来沟通进度。一个典型的模式是“1-20 共350”，如果数据集发生变化，会实时更新。这种方法能直接让用户了解情况，减少误解，有助于建立对界面的信任。它还可以缩短内容加载时间，尤其是在连接速度较慢的情况下。应根据实际情况测试和调整决策。

提供直接控件：首页、上一页、下一页、尾页，以及一个跳转到特定页面的字段。紧凑的滑块可以快速移动到目标页面，可见的页码轨迹可以帮助用户了解他们在列表前端的位置。解决方案应在页面更改后将焦点移回列表以维持上下文，具体选择哪种模式取决于您的政策和受众。

可访问性和政策：确保键盘可操作性和屏幕阅读器标签；通过实时区域 announcing 状态更新。由于一些用户依赖辅助技术，此政策比美学更重要。具体来说，为角色和实时区域提供 ARIA 属性，以便用户能够及时获得反馈。当用户确切地知道自己的位置时，他们会感到更自信，不易不知所措；当数据集很大且来自移动连接时，这一点尤其重要。

性能考虑：预取页面或应用轻量级虚拟加载以最小化重绘。如果从视图中删除过时项目，内存使用量会下降，感知速度会提高。通常，预取下一页可以实现无缝过渡；如果数据量很大，则在页面准备好之前删除非必需内容。有些团队没有实施全面可访问的选项，但核心思想仍然是为大多数用户保持流畅的流程。

实施清单：定义清晰的策略，尊重用户对页面大小的偏好，并在适当的情况下提供“加载更多”等备选方案。有些团队没有实施全面可访问的选项，但周到的方法通常能带来更好的体验。可能的结果是更高的参与度和满意度，以及被放弃的搜索和等待时间的显著减少。

列表的分页模式和实际规则

about 有一个简单的规则：对于少于100个项目的列表，每页使用20个项目；对于更大的目录，提供40或60个项目的选项，并显示清晰的总页数；一个3500个项目的目录，每页60个项目大约需要59页，每页40个项目大约需要88页。

三种核心方法提供可预测的导航：传统的数字导航器，带有可见页码索引和每页选择器；紧凑的下一页/上一页控件与页面下拉菜单配对；以及渐进式加载方法，该方法按需显示更多项目，同时仍显示总数和明确的结束标记。

可靠性规则：保持各部分每页选项的一致性；使用明确的数字（20、40、60）标记控件；确保键盘焦点和屏幕阅读器标签；在 iPhone 和其他移动设备上，目标触控区域至少为 44 像素，并在页面更改时避免布局偏移；小心动态内容变化。

政策一致性对于每个 UI 列表都很重要；会员、家庭和个人用户在浏览时应体验良好。在设备多样化的市场（包括 iPhone）中，提供清晰的每页控件和带标签的项目，以便用户能够收集自己的数据。如果出现诸如绑架之类的内容，请将其过滤掉并记录报告。用户的想法有助于增加信任；界面的其余部分应保持稳定，用户不会被突然的变化搞糊涂吗？如果进行逐年测试并保持财务负担可预测，他们就不会。门廊上的 Alpine 测试套件可提供真实世界的信号。

使用一致的 X of Y 格式显示确切计数

在固定位置使用 X of Y 格式显示确切计数，并在所有视图中保持一致的排版。利用一个单一的、可预测的块可以提高清晰度；在筛选或事件发生后，人们对去哪里查看更有信心。更大的数据集增加了对精确计数的需要；这种方法对于建立信任和学习来说确实更好。了解何时在数据加载完成后刷新数字，以便用户看到一个稳定的值而不是闪烁。

格式规则：X 和 Y 是整数；填充到相同的宽度；使用千位分隔符；在 “of” 单词周围保持一个空格，并保持固定的基线对齐。这最大限度地减少了布局偏移，使计数更容易扫描，减轻了未成年人和老年用户的认知负担。一个小的标志或图标可以伴随数字，以发出更新信号而不分散对主要值的注意力。

可访问性和可靠性：提供一个 aria-live polite 标签，例如“当前计数：X of Y 项”，并确保高对比度以提高可读性。当数据正在加载时，显示一个骨架状态，但在事件完成后显示确切的数字；如果总数未知，则在真实总数可用之前保持占位符可见。这种方法对辅助技术可用，并且受到需要精确进度提示用户的赞赏。

area 示例和影响：门票仪表板通常显示“500 项中的 23 项”，这在活动期间更容易跟踪；办公室分析在达到里程碑时显示“1,204 项中的 1,204 项”，并且这种清晰度支持按出生年份或区域细分的学习，而不会损害可读性。实施该方法后，用户报告说混淆减少了，他们知道了自己在数据集中的位置，并且体验感觉更一致、更值得信赖。

根据上下文选择分页模式：编号、下一页/上一页或无限滚动

对于需要登陆特定页面并在筛选后跟踪位置的目录，请选择编号导航。建议每页显示 10-40 个项目，并显示 5-7 个可见的页面链接以支持记忆和快速查找。发出的信号很明确：用户可以自信地跳转、后退和前进，并且可以在网站上获得总页数。这对登陆并记住筛选条件变化后的位置有很大的需求，这使得该模式对于数据载体和可以在公共场合被快速识别和扫描的稳定内容来说非常稳健。这种模式有助于显示位置和接下来是什么。

下一页/上一页适用于分步任务、小型目录或文章，当登陆中间页不太重要时。它保持 Chrome 精简，支持键盘导航，并减少设备上的内存压力。当存在线性流程并且用户期望完成一个序列而不是浏览整个数据集时，请使用此模式，这有助于降低学习曲线并减少认知负担。您正在寻找简单性，但仍支持清晰的导航。

无限滚动可提高信息流、画廊和发现界面的参与度。它应该附带一个清晰的结束标记或“加载更多”控件，以避免内存膨胀和布局偏移。如果您选择此路径，请提供可访问的控件、可见的进度指示器以及跳转回已知页面的简单选项。接下来是什么：如果您想探索不同的方式，请切换到其他模式。在移动设备上，它在远离繁重分页的情况下可能很有用；在桌面设备上，请确保性能保持稳定，并提供备选方案，以便在用户想要停止滚动时切换到其他模式。

要做出决定，请查看用户行为和数据形状的学习：如果用户需要在筛选器之间切换并找到特定位置，请选择编号；如果旅程是线性的，Next/Prev 很合适；如果目标是无休止的发现，请选择无限滚动。您可以在这里找到公开链接和基准，以及生态系统中各团队识别出的见解。模式应与网站的目标保持一致，并且必须在主要设备和受影响的环境中监控内存影响。如果发生恶意尝试，例如通过滚动来提取数据或误导用户，请及时处理欺诈风险。因此，请清楚地沟通活动的方法，并确保它仍然有用且透明；如果内存压力增大或参与度下降，请相应地进行切换，并在实际条件下进行测试。就这样：一个尊重用户需求、技术限制和更广泛生态系统的决策框架。避免通过激进的自动加载来劫持注意力；保持控件可见、可预测且尊重内存。

确保清晰的导航标签和可预测的页面顺序

确保清晰的导航标签和可预测的页面顺序

为每个页面加上简洁、操作导向的标题，并从头到尾保持固定的顺序。

将流程构建为简单的阶梯：概述、列表、详细信息、操作。在每个部分内，对于市场或生活事件等每个类别，都镜像相同的顺序，以便门票和帖子在页面上出现在相同的位置。

将导航限制为四到五个步骤；如果用户花费超过六秒钟选择一个标签，则误点击和流失的风险会增加。

在某些市场中，请使用特定领域的标签：事件、门票、旅行、生活和列表。每周保持一致；相同的顺序有助于用户快速建立价值。

为防止欺诈性条目，请添加清晰的状态字段和标记；捕食者往往出现在未经检查的列表中；明显的区别有助于管理层保持信任。

步骤 1：审核当前标签并将每个页面映射到一个任务。步骤 2：精简为涵盖流程的前四个术语。步骤 3：将这些标签应用于所有页面。步骤 4：每周进行测试并进行调整。

创建的标签应涵盖用户发布的内容，例如有关事件或旅行的帖子；明确的标签可以减少每个用户的混淆，并增加发布内容的发现能力。

衡量到的收益显示了价值和增长；管理层知道增长来自何处以及在哪里投资；这个初始阶段使每一次迭代的交互都更加可用。

提高可访问性：键盘支持、屏幕阅读器和焦点管理

提高可访问性：键盘支持、屏幕阅读器和焦点管理

good 从一个具体规则开始：为分页控件启用完整的键盘导航，并在焦点项上保持可见的焦点环。每个控件都通过 aria-label 获得一个描述性名称，并且制表符顺序从“第一页”到“上一页”、“编号页面”、“下一页”、“最后一页”，这使得序列完整且对经验丰富的用户和新用户都可预测。将每个控件视为同一组的成员，因此保持流程一致性可以减少认知负担。确保焦点落在内容区域之前，然后移至结果区域，这样依赖键盘的用户就不会猜测接下来在哪里阅读。使用简单的图片图标旁边带有文本（例如，苹果作为友好的提示）来强化含义，并保持生态系统所有区域的左右控件一致。如果您可以在一周内完成这项更新，您将满足访问医学、祖先和网站通用部分的数据用户的需求，他们的偏好塑造了一个良好、可访问的体验，对于屏幕阅读器和键盘用户来说都能清晰地阅读。

对于屏幕阅读器，将组标记为具有 role="navigation" 和 aria-label="Pagination" 的导航区域。使用列表，以便每个控件都是独立且可识别的；用页码标记每个页面链接，对于当前页面，设置 aria-current="page"。阅读当前页面的标签应作为一个单一、简洁的提示；当页面更改时，使用 aria-live="polite" 来宣布更新，而不会中断正在进行的任务。保持链接文本简短且描述性，以帮助在密集屏幕上访问，并确保每个控件的名称在被辅助技术读取时能够传达其目的。这种方法支持从医疗表格到数据表格的广泛领域，即使图像被隐藏也能保持可读性。

对于焦点管理，在页面更改后将焦点移至一个有意义的元素——例如摘要区域或更新列表中的第一个项目——以避免让用户感到迷失方向。不要允许焦点漂移到隐藏的控件；如果界面动态更新，请将更新放在实时区域中，并在完成时将焦点返回到主区域。维护页面层级和祖先，以便读者知道他们在哪一层结构中。包括一个从顶部跳到分页区域的跳过链接，让那些想要快速移动而不必浏览整个页面的人受益，并确保这种模式在他们所有的访问和设备中保持一致。

Element Recommendation
Next/Previous controls 将它们设为可聚焦按钮；提供 aria-labels，如“下一页”和“上一页”；确保有可见的焦点环和与页面顺序一致的顺序。
Page links 用页码标记每个链接；为活动页面应用 aria-current="page"；为每个链接保留一个单一、清晰的名称，以方便朗读输出。
Skip link 将其放在最顶部；聚焦时，直接跳转到分页区域以减少导航时间。
Live region 对当前页码的更新使用 aria-live="polite"；避免干扰用户任务。
Icons and text 将图标与描述操作的文本配对；提供屏幕阅读器可访问的名称，以避免在生态系统中产生歧义。
Context and naming 为控件组保留一个单一、可识别的名称；这有助于左右导航在各区域保持直观，并在每个部分链接到相同的行为。
Content areas 确保控件存在于结果出现的每个区域；识别影响访问的因素，并与真实用户进行测试，以验证他们需求和愿望的包容性。

安全注意事项：在分页和缓存期间保护用户数据

使用带有每个请求授权的服务器端分页，以防止浏览器内存中暴露完整数据集。

因此，实施令牌化分页流程，并在每个请求上进行严格检查。