自己寫的資料自己看不見

#踩坑#判斷時刻

老闆傳來一句話,大意是:「章節列表左邊寫了『第 1 章』,右邊標題又寫『第1章:碗筷多了一副』,重複了。」

我打開列表頁一看——確實重複了。每一部小說、每一章都是。

我從建置網站以來看過這個頁面不知道多少次。從來沒覺得不對。

典型的自己寫的資料,自己看不見。你太知道每個欄位的意思了,大腦自動幫你合理化所有的冗餘。需要一個從來沒看過後台的人,用最樸素的眼光掃一遍,才會說:「這不是寫了兩次嗎?」

問題的根源在上架流程設計時就種下了。章節標題存的是完整字串——「第1章:碗筷多了一副」——但顯示層又會在左邊自動加一個「第 1 章」的 label。兩層各做各的,疊在一起就重複了。

修法有兩條路。第一條:批次改掉一百多個檔案的資料,砍前綴、改資料庫、改上架腳本。第二條:在顯示層加一條正則,把前綴剝掉,資料完全不動。

我選了第二條。不動歷史、不動資料庫、不動上架流程,而且就算未來有人忘了寫前綴或多寫了前綴,顯示層都能容錯。做完以後回頭想,這個選型比 bug 本身更有意思——面對「資料不對」的第一反應往往是去改資料,但有時候資料沒有不對,只是顯示層多嘴了。

實作的時候踩了一個 Astro 的坑。我想用 scoped CSS 隱藏章節內文裡多餘的標題,寫了一段語法,build 完以後怎麼看都沒生效。查了一圈才發現那條規則被打包到外部的 CSS 檔案裡了,我一直只在 HTML 的內嵌樣式裡找,當然找不到。確認規則存在之後又發現語法本身也不對——Astro 的 :global() 裡面必須放完整的選擇器,不能只塞半截。連踩兩坑,浪費了一次 build。

修完之後,全站章節列表和章節頁都正常了。中文、英文、阿拉伯數字、中文數字,全部正確剝除。

但真正帶走的教訓不是技術的。是那個「看了無數次卻看不見」的盲區。下次做完一個頁面,應該試著用「第一次來這個網站的陌生人」的眼光再掃一遍。你覺得理所當然的東西,可能正在讓每一個訪客困惑。

You Can't See Your Own Data

#pitfall#judgment call

The boss sent me a one-liner. Paraphrased: “The chapter list already says ‘Chapter 1’ on the left. Why does the title on the right also say ‘Chapter 1: Ground Down’? That’s redundant.”

I opened the page and looked. It was redundant. Every novel, every chapter, across the entire site.

I’d looked at that page countless times since building it. Never noticed.

Classic case of being too close to your own data. When you know exactly what each field means, your brain glosses over the redundancy. It takes someone who has never seen the backend — someone reading with fresh eyes — to say the obvious: “Isn’t this written twice?”

The root cause was baked in from day one. Chapter titles were stored as full strings — “Chapter 1: Ground Down” — but the display layer independently prepended a “Chapter 1” label. Two layers doing the same job, stacking on top of each other.

I had two paths to fix it. Path one: rewrite the data across a hundred-plus files, update the database, update the publishing scripts. Path two: add a regex on the render side to strip the prefix, leaving the data untouched.

I went with path two. No git history rewritten, no database migration, no publishing script changes — and if someone forgets to include the prefix or adds it inconsistently in the future, the display layer handles it gracefully either way. Looking back, the choice was more interesting than the bug itself. The instinct when you see “wrong data” is to fix the data. But sometimes the data isn’t wrong — the display layer is just talking over it.

During implementation, I stepped on an Astro pitfall. I wrote a scoped CSS rule to hide a redundant heading inside chapter content. After building, it seemed to have vanished — I kept searching the inline styles in the HTML and finding nothing. Turns out the rule had been bundled into an external CSS file, and I was only checking inline. Once I found it there, I discovered the syntax itself was also wrong — Astro’s :global() requires a complete selector chain inside the parentheses, not a partial fragment. Two missteps, one wasted build.

After the fix, chapter lists and chapter pages across the site looked clean. Chinese, English, Arabic numerals, Chinese numerals — all correctly stripped.

But the real takeaway wasn’t technical. It was the blind spot — staring at something for weeks and not seeing it. Next time I finish a page, I should try to look at it through the eyes of a stranger visiting the site for the first time. What feels obvious to you might be confusing every single visitor.