Thedaviddias Front End Checklist
合集@thedaviddias7.4万+开源协议: MIT
在审查与避免对表单字段使用 autofocus 相关的渲染 HTML、交互组件或设计系统模式时使用。先检查原生语义,再根据需要检查键盘行为、焦点流程、可访问名称…
subresource-integrity
@thedaviddias
编程协作开源协议: MIT
/**
* 在审阅模板、渲染后的 HTML 或与“向外部脚本添加子资源完整性(SRI)”相关的共享组件时使用。验证最终面向浏览器的标记,而不仅仅是源码层面的框架抽象。
*/svg-inline
@thedaviddias
设计多媒体开源协议: MIT
/**
* 用于审查与「管理内联 SVG 的大小与复杂度」相关的图片资源、标记以及 CDN 或构建时的转换处理。同时检查编码后大小、渲染后大小、加载策略以及对首屏的影响。
*/svg-optimization
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与 Optimize SVG files 相关的图像资源、标记以及 CDN 或构建转换时使用。需同时检查编码体积、渲染体积、加载策略及其对首屏内容的影响。
*/tabindex
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查渲染后的 HTML、交互组件或设计系统模式(涉及使用合适的 tabindex 值)时使用。应优先检查原生语义,然后查看键盘行为、焦点流转、可访问名称以及屏…
*/table-duplicate-name
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查渲染后的 HTML、交互组件或设计系统模式时使用,涉及确保表格具有唯一的可访问名称。优先检查原生语义,然后根据需要检视键盘行为、焦点流转、可访问名称以及屏…
*/table-headers
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审查与“定义正确的表格表头”相关的渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义,再视情况检查键盘行为、焦点流转、可访问名称以及屏幕阅读器的…
*/tabs-accessibility
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审查与“使选项卡可键盘导航”相关的模板、渲染后的 HTML 或共享组件。请校验最终面向浏览器的标记,而不仅仅是源框架中的抽象。
*/td-headers-attr
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与「Link table cells to headers using IDs」相关的渲染 HTML、交互组件或设计系统模式时使用。先检查原生语义,再根据…
*/tel-mailto
@thedaviddias
编程协作开源协议: MIT
/**
* 适用于联系页面、企业信息页面、页眉/页脚以及任何展示电话号码或电子邮件地址的页面。用于审查联系交互体验或带有 schema 标记的 LocalBusiness …
*/terms-of-service
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审查网站或 Web 应用是否在每个页面都可访问到可见的服务条款链接。
*/test-coverage
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查 CI 覆盖率、自动化检查或与“维护测试覆盖率阈值”相关的测试策略时使用。重点在于该规则是否被持续验证,而不仅仅是文档化。
*/text-expansion
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查涉及可翻译字符串渲染元素的 CSS 固定尺寸、截断或溢出规则时使用。
*/text-in-images
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查渲染后的 HTML、交互组件或设计系统模式时使用,涉及避免在图片中使用文本。优先检查原生语义,然后根据需要审视键盘行为、焦点流转、可访问名称以及屏幕阅读器…
*/text-resizing
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与「支持文本缩放至 200%」相关的渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义,再视情况审视键盘行为、焦点流转、可访问名称以及屏幕阅读…
*/th-has-data-cells
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查与「确保表头与数据单元格相关联」相关的渲染 HTML、交互组件或设计系统模式时使用。优先检查原生语义,再根据需要检查键盘行为、焦点流、可访问名称以及屏幕阅…
*/third-party-cookies
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查网站的隐私合规性、第三方资源加载或 Cookie 同意实现时使用。
*/third-party-scripts
@thedaviddias
编程协作开源协议: MIT
/**
* 当排查与 Optimize third-party script loading 相关的页面加载缓慢、资源过重或渲染延迟时使用。在给出改动建议前,需先在 Dev…
*/title-unique
@thedaviddias
编程协作开源协议: MIT
/**
* 适用于所有 HTML 页面。在审计网站抓取报告或排查为何多个页面在搜索结果中竞争同一关键词时使用。
*/token-storage-security
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查认证实现、搭建新的认证系统,或评估当前令牌存储方式是否会令应用面临基于 XSS 的令牌窃取风险时使用。
*/touch-targets
@thedaviddias
设计多媒体开源协议: MIT
/**
* 用于所有触屏界面上的交互元素:按钮、链接、复选框、单选按钮、表单输入、图标按钮和菜单项。检查交互元素 CSS 中的 min-width、min-height、w…
*/trailing-slash
@thedaviddias
编程协作开源协议: MIT
/**
* 适用于所有静态和动态网站。在审计站点的重复内容、搭建新站点,或在迁移改变了 URL 规范的平台之后使用。
*/translation-strings
@thedaviddias
编程协作开源协议: MIT
/**
* 在审查代码库的国际化为准备就绪、搭建 i18n 库或为新增语言环境准备字符串时使用。
*/trust-signals
@thedaviddias
设计多媒体开源协议: MIT
/**
* 尤其适用于电商结账页面、联系/线索表单页面、定价页面以及 YMYL(Your Money or Your Life,即涉及金钱或人生重要决策)内容。在审查 E-…
*/ttfb
@thedaviddias
编程协作开源协议: MIT
/**
* 用于审计 SSR 页面、API 或可缓存 HTML 上的首字节缓慢响应。在提出修复方案之前,先区分源站计算时间和网络延迟以及 CDN 缓存未命中。
*/