David Dias

检查并完善浏览器标签页和搜索结果使用的网站图标设置，核对HTML声明、图片格式与尺寸、HTTPS访问和抓取限制，帮助排查图标不显示的问题。

• 检查现有网站的图标设置
• 为新项目配置网站图标
• 排查搜索结果不显示图标的原因

为生产应用配置或检查错误监控，核对未处理异常、网络请求失败的收集情况，以及用户、版本和环境信息，并完善重大故障的告警阈值与通知对象。

• 为新应用准备生产错误监控
• 排查监控未检测到的错误
• 审查重大故障的告警对象与阈值

检查主要图片、重要字体和CSS的加载优先级，通过fetchpriority属性调整资源获取顺序，让显示所需的资源更早加载。

• 改善主要图片的显示速度
• 检查屏幕外图片造成的加载竞争
• 确认字体和CSS预加载的优先级

检查键盘操作时标示当前选中位置的焦点样式，找出轮廓线消失、被裁切或位置偏移的问题，并指出相关CSS，协助修改为清晰可见的样式。

• 确认键盘操作时的选中位置
• 检查移除轮廓线的CSS
• 修正焦点框裁切或位置偏移

Audit how quickly a page shows its first text or image. Use performance measurements to identify blocking resources, slow server responses, and rendering delays, then recommend changes tied to the confirmed bottlenecks.

中文简介正在准备中。当前显示英语简介。

• Investigating slow initial page display
• Finding CSS and JavaScript that delay rendering
• Reviewing loading performance with measurements

检查阿拉伯语等从右向左书写的页面及文字方向混合的帖子，协助修正HTML方向设置，并检查显示顺序、屏幕阅读器朗读顺序和界面布局。

• 检查阿拉伯语和希伯来语页面
• 处理文字方向混合的姓名与帖子
• 检查导航和图标的左右镜像

检查浏览器标签页、书签和手机主屏幕使用的网站图标，协助生成适合不同设备的格式与尺寸，并核对HTML声明及PWA配置。

• 准备标签页和书签图标
• 配置手机主屏幕图标
• 核对PWA图标配置

Review file upload interfaces for clear labels, accepted formats, size limits, and accessible progress and error messages. Check that keyboard and screen reader users can complete uploads, including alternatives to drag and drop.

中文简介正在准备中。当前显示英语简介。

• Review labels and instructions on file upload forms
• Check keyboard alternatives to drag and drop
• Improve upload progress and error announcements

查找CSS中分散或重复的颜色、间距和字号，将其整理为共用的CSS自定义属性，并结合主题切换和不同屏幕宽度下的显示效果提出修改建议。

• 整理重复的颜色和间距
• 为品牌调整整理CSS
• 审查深色模式使用的值

逐一列出JavaScript中的var声明及行号，根据是否需要重新赋值改用const或let，并检查变量作用域及相关浏览器运行行为。

• 按行号查找var声明
• 将var替换为const或let
• 检查变量的作用域

比较HTML中的canonical标签与HTTP的Link响应头声明的规范网址，定位向搜索引擎提供矛盾信息的路由或模板，并给出修改方案及输出验证方法。

• 比较HTML与HTTP声明的规范网址
• 排查规范网址声明冲突的原因
• 检查不同路由或模板的输出

检查网站的CSP配置及HTML插入操作，协助限制可加载或执行的资源、采用安全的显示处理，并在接近生产的环境中验证实际HTTP响应和浏览器行为。

• 检查现有CSP配置
• 限制脚本与外部资源
• 检查不可信HTML的显示处理

在真实浏览器中测量页面加载和渲染表现，定位网络请求、脚本执行及布局计算造成的延迟，比较不同设备与网络条件，并依据测量结果提出改进方向。

• 调查页面加载缓慢的原因
• 比较不同设备与网络条件下的性能
• 在开发和CI/CD中加入性能审查

用Pact将前端对API响应的预期写成契约测试，并验证后端是否满足这些预期，帮助团队在分别修改和部署服务时检查接口是否一致。

• 引入前端与API之间的契约测试
• 检查服务能否独立部署
• 考虑替换部分缓慢的端到端测试

检查并修复标签未闭合、嵌套错误等HTML结构问题。结合实际生成的HTML和HTTP响应，查找可能影响页面显示及搜索引擎解析的问题。

• 检查标签未闭合和嵌套错误
• 排查HTML导致的显示错乱
• 检查面向搜索引擎的HTML结构

Find broken or fragile image references in markup, styles, and components. Correct paths, restore missing assets, and add fallback images, then verify how the page behaves when image requests fail.

中文简介正在准备中。当前显示英语简介。

• Find why product images are missing
• Check image paths after a build
• Add fallback images for external URLs

Audit slow page loads by measuring how static files, such as images and scripts, are delivered. Check CDN usage, a network of distributed servers, and identify caching or delivery settings that need improvement.

中文简介正在准备中。当前显示英语简介。

• Investigating slow page loads
• Checking CDN delivery of images and scripts
• Reviewing caching settings for global audiences

检查需要同时对齐行与列的页面布局，协助评估改用CSS Grid的方案，并设计随屏幕宽度或内容调整的网格，也可让嵌套元素对齐父网格。

• 检查Flexbox或float二维布局
• 按屏幕宽度排列卡片列表
• 让嵌套元素对齐父网格

检查CSS文件大小及加载方式，通过性能测量找出拖慢页面显示的样式表，并通过压缩、删除未使用的样式或按页面拆分文件来减少不必要的CSS。

• 排查页面首次显示缓慢的原因
• 查找体积过大的CSS文件
• 删除未使用的样式并压缩CSS

检查CSS样式覆盖冲突，用`@layer`明确样式优先顺序，协助整理分层结构，并审查对复杂选择器和`!important`的依赖。

• 排查CSS样式覆盖冲突
• 设计样式系统的优先顺序
• 逐步迁移以工具类为主的CSS

检查网站在主要浏览器中的显示和功能，修复浏览器特有的问题，并审查桌面端、移动端测试范围与持续集成检查，找出自动验证的遗漏。

• 检查主要浏览器的显示与功能
• 审查桌面端和移动端测试范围
• 排查浏览器自动验证遗漏

检查文章和博客的发布日期与更新日期，完善面向读者的日期显示及供搜索引擎读取的结构化数据，并协助让更新日期反映正文的实质性变化。

• 检查博客文章的日期显示
• 为Article JSON-LD添加日期
• 检查CMS模板的日期输出

通过测量排查拖慢页面首次显示的资源请求依赖，找出必须依次等待的加载环节，并考虑内嵌关键CSS或预加载必要文件，缩短网络等待链。

• 排查页面首次显示缓慢的原因
• 检查资源请求之间的依赖
• 评估内嵌关键CSS与预加载

检查各页面的canonical标签，核对因参数或域名写法不同而产生的重复网址，协助补充或修正向搜索引擎声明的规范网址，并验证生成页面中的设置。

• 检查各页面的规范网址标签
• 排查参数或域名差异造成的重复网址
• 补充或修正规范网址