今天想唠唠网页设计那点事儿，前段时间公司让我整个新产品的官网，说是要高端大气上档次，我一琢磨，这活儿不得自己动手试试？

1. 开整前的发愁

刚接活儿那会儿，脑子里一片空白。画草图！对，先画草图。随手摸了个破笔记本，抓起笔就开始乱涂。主页该放产品图得大？按钮放哪儿顺眼？瞎划拉了十几张，越看越像幼儿园涂鸦，自己都嫌弃。挑了个勉强能看的，准备上电脑捣鼓。

2. 找工具，真让人头大

听说别人用啥Figma、Sketch，高大上，我就想找个免费的，能省则省。折腾半天，下了个开源的玩意儿，叫啥名儿忘了。一打开，嚯，满屏幕按钮看得我眼晕，跟开飞机似的。鼓捣了俩钟头，连个框框都没拖明白。算了！换回PPT，虽然有点土，好歹我会用！新建个空白页，开始瞎拼。

• 第一步：定个框。把页面想像成几块大积木：顶上是导航条，中间分几栏放内容，底下塞联系方式。真像搭乐高。
• 第二步：塞东西。产品图？直接截图扔进去；功能介绍？打两行字；按钮？画个矩形填个色，写上“免费试用”。效果嘛跟草稿比强点，但看着还是山寨。
• 第三步：调颜色，要了老命。红配绿？太扎眼。蓝配灰？像卖保险的。翻遍了配色网站，眼都看花了。挑了个淡蓝配白，又加了个橙黄当按钮色，图个吉利。

3. 踩坑，各种坑！

布局看着还行，可一缩小窗口就现原形了！按钮叠文字，图片跑到隔壁家！才想起来手机上看也得能看！骂骂咧咧开始调“自适应”。这个要百分比，那个要自动换行，调完桌面版又乱套了，差点把鼠标摔了。还有字体！明明选了同一个，手机上居然不一样大，气得我直接@#¥%……暴力解决：桌面一套字号，手机直接缩小，去他的完美主义。

按钮也不省心，点上去没点反应，用户知道能点吗？赶紧加个鼠标悬停变色效果，做贼似的找了行代码贴进去，还真变了！心里那点小得意，压都压不住。

4. 上线？先丢个测试版！

熬了几个大夜，总算整出个能看的页面。憋不住了，把链接（就是本地文件路径）往工作群里一甩：“哥几个瞅瞅，别客气！”

• 老张： “登录按钮咋藏这么深？找个半分钟！”
• 李姐： “这蓝色看着发冷，能加暖点不？”
• 小王： “手机上看，左边空了一大块，怪浪费的。”

听着头大，但句句在理。真上线？还得改！老老实实记下来：按钮挪位置，蓝色加点暖灰调，手机布局再挤挤。

弄完这一大圈，最大的感受？网页设计看着简单，里头的名堂真不少。跟盖房子似的，一砖一瓦都得自己码，麻烦是真麻烦，可看着用户点得顺溜，那成就感，值了！下次？还干！