梯队榜制作器

梯队榜是什么，又不是什么

梯队榜把可比较的项目分入 S、A、B、C 等有序梯队。更高的行通常代表偏好更强、表现更好，或更符合你选定的标准。本工具不会计算分数，也不会替你决定项目的位置。

它与另外两种常见看板不同：

梯队榜适合表达观点和比较判断，例如喜爱的专辑、产品选项、游戏角色、值得再做的菜谱或需要优先考虑的想法。核对完成情况请用清单；项目在工作阶段间流转时请用看板。

排名之前先设计有意义的梯队

默认 S–F 是惯例，并非强制。可改成 优秀 / 良好 / 待定 / 跳过、首选 / 备选 / 不合适，或任何含义清楚的尺度。最多可使用 12 个梯队。

移动项目前先确定比较标准。“性价比最高”和“质量最好”可能产生完全不同的榜单。若别人只能看到导出的图片而看不到你的说明，准确的标题和描述清楚的梯队名称会更易理解。

同一梯队内仍可调整顺序。需要表达梯队内从左到右的偏好时可利用该顺序；否则可把同一行的项目视为同等。

文字项目和本地图片

榜单共可容纳 100 个项目，其中图片最多 60 张。文字适合名称、选项和想法。图片会在浏览器中标准化，使不同原始尺寸适配固定图块，并避免把不必要的图片元数据写入项目。

支持 PNG、JPEG、WebP。每个源文件最大 8 MiB，任一边不得超过 8192 像素，解码后最多 16 兆像素。合格图片会在本地按需缩至最大 512 × 512 像素。每个项目的标准化图片数据上限为 32 MiB。

本工具有意不接受远程图片 URL 和 SVG 上传。只处理已解码的本地光栅图片，可以避免远程资源失效、跨源画布错误及活跃 SVG/XML 内容。OWASP 的文件上传速查表建议仅允许必要格式、设置大小限制、检查声明的 MIME 类型以外的信息，并重写图片，形成多层上传防护。

拖动并非必需

拖放很方便，但不是唯一排序方式。聚焦项目后使用移动控件，或按 Enter 或空格进入键盘移动模式。方向键改变拟定的梯队和位置；Enter 或空格确认，Escape 取消。

这也方便手机操作，因为精准拖动在手机上可能较难。W3C 对 WCAG 2.2 拖动动作的说明解释了为何依赖拖动的功能需要更简单的指针替代方式。在这里，同一移动操作可通过拖动、键盘、单击或轻触完成。

浏览器会保存什么

标题、梯队、项目文字、图片数据和排名保存在本设备的浏览器存储中。它们不会写入页面 URL，也不会作为编辑器数据发送至服务器。本地恢复副本使用 IndexedDB，因此普通刷新后可以恢复工作。

本地恢复并非云存储。其他浏览器或设备看不到项目；清除网站数据会删除项目；使用同一浏览器个人资料的人可能重新打开它。共用设备上请使用 清除项目；需要正式备份时请导出项目 JSON。

JSON、PNG 和 SVG 各有用途

JSON 导入会在替换当前项目之前经过验证。格式错误、不受支持或过大的文件不会改变已打开的项目。项目 JSON 最大 48 MiB。

PNG 使用标准化本地图片直接在浏览器绘制。浏览器标准方法 canvas.toBlob()生成下载文件；由于不使用远程图片，画布不会受跨源污染，仍可导出。

SVG 由少量非交互式形状、文字和图片元素生成。PNG、JPEG、WebP 项目的像素会嵌入 SVG，并不会描摹或转换成矢量。MDN 说明 SVG 的 <image> 元素可以显示光栅图片。导出文件不会复制任意上传的 SVG、脚本、链接或 HTML。

确保可靠导出的限制

导出宽度可选 800、1200、1600、2400 像素。只要位图不超过每边 8192 像素及 16 × 1024 × 1024 像素（约 1680 万像素），PNG 可按 1× 或 2× 生成。若 2× 超出浏览器安全限制，工具会说明问题，而不会悄悄缩小。SVG 也遵循 48 MiB 的项目与文件安全上限。

成品图默认不含未排名项目。如需将其显示为最后一行中性梯队，请启用 包含未排名项目。请始终检查预览：过长标题、过多梯队或项目，即使技术上有效，在小尺寸分享时也可能难以阅读。

常见梯队榜错误

• 中途更换标准。 排名之前在标题中写明比较依据。
• 梯队名称不清楚。 “待定”“避开”等文字比没有说明的颜色更明确。
• 把梯队当成精确分数。 同一梯队表示共享类别；梯队间距并非测量值。
• 忘记未排名区。 未排名项目不会自动出现在成品导出中。
• 只分享项目文件。 JSON 用于重新打开编辑器；对方只需查看时请使用 PNG 或 SVG。