上个月帮朋友公司搞官网设计，从零开始折腾了二十多天，踩坑踩到脚软。今天把完整流程掰开揉碎说说，看完你也能上手整一个。

第一步 先拿纸笔瞎划拉

大清早冲进朋友办公室，逮着老板和市场总监就开问：“你们官网最想让用户看见”结果俩人当场吵起来了。老板要放二十个成功案例，总监非要加直播入口，我拍桌子定调：先解决卖货问题。抓过马克笔在白板上画了三个框：产品展示区、联系通道、公司背景介绍，其他花里胡哨的全砍了。

第二步 满世界找参考

蹲在星巴克刷了四小时同行网站，手机相册存了八十多张截图。发现个玄学：卖设备的企业站都用深蓝色背景，卖农产品的全是绿色小清新。索性把竞品排版套路分三类：

• 产品多的搞左右滑动橱窗
• 服务贵的放客户证言墙
• 刚创业的使劲吹团队履历

把截图拼成张鬼画符，微信扔给朋友：“选个顺眼的！”

第三步 设计图改了十八遍

让实习生抽空做了个初稿，结果首页banner图居然用的宋体字！气得我亲自上阵调字体：标题用思源黑体，正文用苹方，行距拉到1.8倍才不扎眼。最头疼的是产品展示区，朋友突然说要加3D旋转效果，电脑差点被我砸了。妥协方案：鼠标移上去微微放大，加个0.3秒过渡动画，既省钱又唬人。

第四步 砍功能砍到手软

后台刚搭市场部小姑娘兴冲冲提需求：“能不能加个AI客服？用户留言自动生成诗歌回复！”直接被我怼回去。定的核心功能就四个：

• 产品上传带多图切换
• 留言表单防垃圾验证
• 手机端导航自动折叠
• 后台改文字不用碰代码

多做个功能加两千块，预算瞬间守住。

第五步 内容填到眼冒金星

最崩溃的阶段来了！产品图拍得跟山寨货似的，公司介绍里还有错别字。带着文案小妹改到凌晨三点：

• 产品描述砍掉形容词堆数据
• 把“多年经验”改成“服务273家客户”
• 联系方式放大三倍加浮动按钮

关键发现：团队照片用生活照比西装照点击率高40%，果断让全员举着奶茶杯重拍。

第六步 上线前惊险48小时

测试时发现老板用XP系统，打开页面排版全乱！连夜给IE加兼容代码，边写边骂微软。手机端更离谱：某米手机自带浏览器把按钮吞掉半个，只能单独写样式覆盖。解决所有bug的土方法：

• 电脑端用Chrome审查元素
• 手机开USB调试抓错
• 每改三行代码刷新二十次

现在这网站挂着安稳跑一个月，自然询盘涨了五倍。朋友非要送我锦旗，我说别整虚的，下次改版费打八折就行。记住核心要义：小公司官网就是电子版销售员，别让他干经理的活！