今天翻硬盤看到去年給蘇州客戶做網(wǎng)站的素材包，必須得吐槽下當(dāng)時踩的坑。剛接活那會兒還美滋滋覺得不就套個模板么，結(jié)果啪啪打臉。

開局就栽在導(dǎo)航上

客戶是賣蘇繡的老字號，60多歲的老板娘非要我加那種帶閃光特效的導(dǎo)航欄。我尋思年輕人看著挺酷就照做了，結(jié)果交付時老人家顫巍巍點手機：“小張，這菜單按鈕比芝麻還小，我老花眼要貼屏幕上了！”當(dāng)場掏出老花鏡演示，手指在屏幕上哆嗦半天愣是點不開二級菜單。

• 給中老年用戶做導(dǎo)航，按鈕直接上手寫毛筆字那么大
• 千萬別學(xué)我整那些花里胡哨的動態(tài)折疊
• 重要菜單全堆在首屏最顯眼位置

動效差點害我賠錢

首頁按客戶要求做了個3D蘇繡展臺，每件繡品鼠標(biāo)劃過去就自動旋轉(zhuǎn)。驗收當(dāng)天客戶兒子突然從上海打視頻：“你們網(wǎng)頁把我家老爺子手機整死機了！”老頭用紅米手機點開展示，加載五分鐘白屏。我趕緊掏出自己備用機測試，千元安卓機加載3D模型直接變磚機。

連夜重做方案： 砍掉所有自動播放動效 → 改用靜態(tài)圖加手劃操作 刪了3.8M的超大背景視頻 → 壓成300KB的gif動圖 默認關(guān)閉動畫開關(guān) → 想看炫酷效果的自己點按鈕

兼容測試救了我飯碗

改完以為萬事大吉，跑去平江路茶館給客戶演示。老板娘蘋果14pro絲滑得不行，她會計掏出三年前華為突然驚呼：“張工你看這個價目表！”價格欄在安卓機上擠成俄羅斯方塊，768px的屏幕里“刺繡定制398元/平方厘米”硬生生顯示成“刺398/平厘”。

• 立刻借了七臺不同手機開測
• 千元安卓機全顯示異常
• 蘇州本地的昆山論壇顯示錯位

把CSS樣式表里所有“px”換成“%”和“em”，表格全部拆成div布局才搞定?，F(xiàn)在接蘇州項目都帶著三臺測試機：最新款iPhone、二手安卓機、還有臺十年前的老聯(lián)想。

所以給本地企業(yè)做站真別貪漂亮，那些園區(qū)科技公司的酷炫效果放虎丘婚紗城客戶電腦上可能就是個紅叉叉。下次準(zhǔn)備開貼講怎么讓七十歲老板娘十分鐘上手更新產(chǎn)品，這可是我?guī)陀^前街老字號改后臺的血淚史。