今天是2026年11月10日，星期二，多云。早上七点五十到公司，先把昨天没跑完的移动端自测环境重新拉起来，顺手把测试机从抽屉里翻出来充上电。桌面上摊着三份待跟的活：嘉定一家做机电设备的客户要改首页首屏，松江一家做包装材料的客户在等我们出H5页面的原型确认，还有一个奉贤的老客户打电话来问手机站上的产品图为什么在平板上显示不全。我把这三件事按轻重缓急排了个序，先处理那个已经约好上午十点视频对接的机电客户。
今日工作记录
上午十点准时和客户开了视频。这家客户在嘉定工业区，做自动化设备配件，原来的网站是五六年前找人做的，页面是固定宽度，手机打开要左右拖，老板自己都说"看着难受"。这次他们要做的是上海H5网站建设，核心诉求很直接：手机上看要舒服，产品参数要能查，客户看完能直接打电话或者留言。我一边听一边在白板上画栏目结构，最后定下来六个一级栏目：首页、产品中心、应用行业、工程案例、关于我们、联系我们，产品中心下面再分三个系列。栏目定完我当场把结构截屏发到项目群里，让客户在群里回一句"确认"，这样后面改动有据可查。
上海H5网站建设实录
十一点多开始调原型。设计稿是上周出的，首屏用了大图加一句主张，第二屏是产品分类卡片。我发现设计稿上的产品卡片一排放四个，放到375宽的手机上会挤，文字容易折行折得很难看。我跟设计沟通后改成两列排布，卡片高度统一，图片统一按16比9裁切。原型调整完已经快十二点，我把改好的版本传到了演示环境，顺手把静态页面的骨架先搭出来，用的是响应式布局，断点设在768和1200，这样从手机到平板到桌面都能顺着撑开。
下午一点半开始写页面。首页和产品列表页的静态部分先落地，图片全部走懒加载，列表页做了下拉加载更多。产品详情页要接后台接口，我跟后端对了字段，确定返回的是产品名称、型号、简介、参数表、详情图文和一组图集。接口联调的时候发现参数表返回的是数组嵌套，前端直接渲染会错位，我改成在前端做一次扁平化处理再渲染表格，行和列就对上了。四点多把移动端在四台不同尺寸的手机上过了一遍，从360宽的安卓到430宽的机型，还有一台平板，主要看导航栏展开、表格横向滚动和底部联系条会不会遮住内容。
工作要点总结
- 栏目结构先定死再动手。今天上午要是不把六个一级栏目和产品分类在群里确认清楚，下午写页面的时候来回改，时间全耗在返工上。做上海H5网站建设这类项目，前期把栏目录入梳理清楚，比后面加班改页面有用得多。
- 图片按规范压缩再上传。长边控制在1200像素以内，统一格式，容器设固定比例，页面不跳动，手机打开也快。这一条看着小，实际影响体验很大。
- 上线前先做移动端自测。至少准备三台不同尺寸的机器，重点看导航展开、表格滚动、底部联系条遮挡这几处，问题早发现早改。
- 需求变更走文字确认。客户口头说"加个模块""换个颜色"很常见，我都会在群里复述一遍让对方回个确认，避免交付时各说各话。
- 接口字段类型提前对齐。多值字段统一用数组，日期统一格式，前端后端都省事。