今天是2026年11月13日，星期五，晴。早上八点半到嘉定办公室，先泡了杯茶，把昨天列的手机网站开发任务清单翻出来过一遍。这周手上同时压着两个上海本地的单子，一个是嘉定做办公设备租赁的客户要做移动端官网，另一个是松江一家做自动化设备的企业要补手机网站的产品展示页。上午主要是跟嘉定的客户对需求，对方之前只做过PC站，这次想在手机上把设备目录和租赁流程放出去，方便客户直接在线问价。我把栏目结构先拉了个草图，首页、设备列表、详情页、租赁流程、联系我们这几块，跟对方负责人逐条过了四十分钟，确认下来首页要放三屏轮播加设备分类入口，详情页要带参数表和在线咨询按钮。需求聊完我就把原型和设计稿的落地细节标出来，交给前端开始排页面，自己转到后端把设备数据的接口字段先理一遍。
下午的时间基本都花在手机网站开发的适配和联调上。设备列表页原来PC端用的是三列布局，到手机上要改成单列卡片，图片比例从4比3改成1比1，保证金和日租金两个字段要并排显示，不能换行挤在一起。写样式的时候我用了rem加媒体查询，把基础字号按375宽度的屏定好，再往上放大覆盖，避免不同机型上文字忽大忽小。接口这边也顺手做了字段映射，后台返回的租金是分单位的整数，前端要转成元再拼上“元/天”，设备状态字段后端给的是数字编码，页面要显示成“在租”“可租”“维护中”几种文案。联调时把本地测试环境跑了一遍，列表加载、翻页、筛选都通了，又拿两台安卓机和一台苹果手机实际点了一遍。收工前把测试地址发给客户，约好下周一上午上门演示。
遇到的问题与处理
今天比较头疼的是移动端底部导航在窄屏上错位。设计稿给的是五个图标均分，实际在宽度偏小的安卓机上，第三个图标下面的文字“租赁流程”四个字换行了，把整条导航撑高，页面底部跟着跳了一下。我一开始以为是flex的间距没算对，后来发现是文字没有做溢出处理，字号在部分机型上被系统放大了一档。处理办法是把导航文字统一改成固定字号，加了一行不换行的样式，图标和文字之间留出固定间距，然后在三台不同宽度的设备上截图比对，确认不再跳动才放心。顺手还发现轮播图的首屏图片偏大，一张两兆多，手机加载明显慢，我用工具压到两百多K，视觉上看不出差别，加载速度就顺了。
客户反馈与现场服务
工作要点总结
- 栏目和内容提前梳理清楚。设备分类、参数项、租金规则这些在动手之前就定下来，页面结构跟着内容走，返工就少。有的客户上来就说“先做个框架看看”，结果框架做完内容一填，栏目对不上，改起来比重新排还费劲。
- 图片按规范压缩再上传。手机端流量和加载速度都敏感，单张图控制在两百K左右比较稳妥，尺寸也不用超过实际显示的两倍，后台能自动裁切就开自动裁切，别让原图直接怼上去。
- 上线前一定先做移动端自测。拿两三种不同宽度的手机实际点一遍，重点看导航、表单、按钮和弹窗，模拟器上看着正常，真机上未必。底部导航、悬浮按钮这类固定定位的元素尤其要多看两眼。
- 需求变更走文字确认。客户临时加功能很正常，加之前把位置、交互、影响范围写清楚发群里，对方回复确认了再动手，后面验收和结算都有依据。