检查网页,把界面问题修到位
把页面现象、浏览器观察和代码修改放在一起,检查桌面与窄屏中的真实表现。
开始前,准备这些
准备可以访问的页面、项目源码和目标视口。使用客户端的浏览器工作区或已配置的浏览器工具,明确允许的页面操作。
可以这样开始
请检查页面:……。重点看……在桌面和手机宽度下的布局、交互与可读性。先记录现象和截图,再定位对应组件。只修改相关样式与行为,保留品牌背景。完成后用相同视口复查,列出实际验证的操作。不要提交表单或改动线上数据。
一步步推进
用具体操作描述问题
说明页面地址、视口和触发动作。例如“375 像素宽度打开菜单后,关闭按钮覆盖标题”。截图帮助确认视觉问题,操作步骤帮助定位触发条件,两者一起交给 Lime。
把观察连接到组件
让 Lime 查找相关布局、样式和状态逻辑,先确认是容器宽度、文本换行还是交互层级造成的问题。对照相邻页面使用的组件,优先复用现有模式。
复查同一条操作路径
回到最初视口重复操作,再检查桌面与窄屏。确认图片加载、键盘焦点、菜单关闭和页面返回都正常。对于工具无法访问的状态记录限制,不将页面能打开等同于交互通过。
完成时,检查这些
- 问题现象、视口和修改前后截图。
- 相关组件与样式差异。
- 已验证的交互,以及仍需人工检查的状态。
