從 TeX 到 CSS:我們怎麼把字變好看

摘要

探討了數位排版技術從 TeX、LaTeX 到 MathML、HTML+CSS 的演變歷程,並強調這些技術不只是程式語言,更是人對於知識呈現、美感與可讀性的選擇。每種排版技術都回應了不同時代的需求與使用者的行為,從學術嚴謹到網頁靈活,各有擅場。排版的本質,是為了讓知識被更好地閱讀與理解,而這一切的變化,最終仍是人的故事。



排版:從 TeX 到 CSS,從公式到人性的一條路

1977 年的某一天,唐納德·高德納(Donald Knuth)坐在桌前,看著印出來的數學書樣本,眉頭越皺越深。這不是他想像中的那本書。那本書該有完美的數學公式該有的光澤與對齊,不該是這一頁頁彷彿用電腦「湊合」出來的東西。對這位以《計算機程式設計藝術》聞名的計算機科學家來說,這簡直是一次印刷上的羞辱。他有種衝動——如果沒有人能做出他要的品質,那他自己來做。

這股不服氣的火,點燃了 TeX 的誕生。

當我們今天討論數位排版的演變,從 TeX 到 LaTeX,從 MathML 到 HTML+CSS,技術上看起來是一場又一場的格式戰爭,標準競逐,效率演算法的角力。但若換個角度看,這其實是一群「人」試圖解決某些迫切、具體、而帶情感的問題:為什麼這張公式排得那麼醜?為什麼我寫的文稿,放到出版社格式就亂了?為什麼我不能在網頁上輸入像樣的數學公式?——這些問題背後,是設計者的執念、使用者的挫折,以及社群的選擇。

數位排版的演進,不只是機器的更新,更是人對閱讀體驗、結構理解、表達自由的持續追求。

TeX:為了美的執著

TeX 是一套精細排版系統,不是文字處理器,而是文字排版的程式語言。它使用命令式的語法,讓使用者可以對每一個排版細節進行精準控制,從字距、行距、段落到公式的呈現方式。

它的核心優勢是它的細緻性穩定性。由於輸入與輸出是程式碼控制的,不同機器上輸出的排版結果一致,也不會有樣式走樣的問題。這對學術論文、數學、物理等領域來說,是難以取代的優勢。

但 TeX 並不容易上手。它像是排版界的匠人工具,功能完整但操作不友善。這也促成了下一階段的演化。

LaTeX:讓排版成為「寫作」而非「設計」

Leslie Lamport 觀察到,許多學者只是想專心寫內容,不是去鑽研排版參數。於是,他在 TeX 之上設計了一層巨集語言,稱為 LaTeX,也就是「Lamport 的 TeX」。

LaTeX 的想法是:讓寫作的人不要思考排版,而是交給樣板、巨集與格式來處理。它讓使用者只要輸入結構(例如「這是一個標題」、「這是一段文字」),系統就會負責決定怎麼排出一份符合學術標準的文件。

這就像是從「手工雕琢」到「模板生產」的轉變,犧牲一點自由,換取一致性與效率。

但也因為如此,LaTeX 偏好長文件、結構清楚的資料,像論文、報告、教科書,這些一用就用個幾十頁的文件。對簡短又不固定格式的內容來說,LaTeX 就像是用戰斧切水果,有些太重了。

MathML:看起來完美,手寫起來悲劇

在網路逐漸取代紙本後,人們開始思考「在 HTML 裡排數學」的可能。這時,W3C 推出了 MathML(Mathematical Markup Language),它是一種用 XML 表示數學結構的語言,能夠描述公式的語意與外觀,並與 HTML/CSS 相容。

技術上來說,MathML 幾乎是完美的。它語意清楚,支援語音朗讀、可解析的樹狀結構、向量化顯示、轉檔彈性……但問題來了:誰想手打十行 XML 來寫一個分數?

這就是 MathML 的痛。它是一種「設計給瀏覽器與系統看的語言」,而不是「給人類寫作」的語言。它需要工具輔助,不適合手寫,也缺乏主流支援:瀏覽器支援程度不一,轉檔工具不穩,最終只能局部採用。

它像是那種被理想主義者設計出來的語言,美麗、正確、兼容、開放,但不夠人性。

HTML+CSS:回到開發者與使用者的日常

當內容開始從「出版物」變成「網頁」,大家對排版的期待也變了:不再需要像書本那樣嚴謹,而是要求快速載入、跨平台一致、能互動、可修改。

這時,HTML+CSS 成了主流。儘管它們不是為數學排版而生,但靠著 JavaScript 套件(如 MathJax、KaTeX)和 CSS 的排版能力,仍然能模擬出夠看的效果,而且容易整合、輕量、能上 GitHub,還能響應式設計,手機也能讀。

它的核心哲學是:不要追求完美,而要達成「夠好又能用」的普世標準。

沒有最好的語言,只有最合適的時代與使用者

TeX 是給印刷時代用來寫書的,LaTeX 是給學者長文結構用的,MathML 是設計給系統解析數學結構用的,而 HTML+CSS 是給網頁與開發者的。

這些語言與技術,反映了它們所處的時代需求,也透露了人們對「知識傳遞形式」的選擇

  • 你是研究者、寫幾百頁的論文?用 LaTeX。
  • 你是系統開發者、想要語意標記?用 MathML。
  • 你是架網站的、想快速顯示公式?用 KaTeX + HTML。
  • 你是美感強迫症患者?回去用 TeX 吧,然後慢慢 debug。

沒有誰取代誰,只有誰合用誰。


小知識

  1. TeX 的開發動機:Donald Knuth 是因為對印刷品質的不滿才親自開發 TeX,而不是因為想要開創什麼標準。他的目的是讓自己的書排版漂亮。
  2. LaTeX 的命名由來:LaTeX 是由 Leslie Lamport 在 TeX 基礎上開發,名字是「Lamport 的 TeX」的縮寫。
  3. MathML 的設計初衷:MathML 並非設計來手寫,而是給瀏覽器與系統解析用,目的是讓公式更語意化、可讀化、無障礙化。

學習單

  1. 請簡述 TeX 與 LaTeX 的差異與各自適合的使用情境。
  2. 你認為 MathML 雖然技術完整卻沒有被廣泛使用的原因是什麼?試舉兩點說明。
  3. 如果你要建立一個數學學習網站,會選擇哪一套排版工具或語言?為什麼?

單字卡

  1. 排版(Typesetting) 將文字與符號以合適格式安排於頁面上,使其可供閱讀與印刷的過程。
  2. 語意(Semantics) 指資料或語言中所承載的「意義」或「內涵」,強調資料背後的解釋方式。
  3. markup(/ˈmɑːrkʌp/) n. 用來標示文字結構或格式的符號(如 HTML 或 XML),通常不影響內容本身但決定其呈現方式。
  4. template(/ˈtɛm.plət/) n. 模板;預先設計好的格式,用來快速產出格式一致的文件或網頁。
  5. render(/ˈren.dɚ/) v. 呈現;指瀏覽器或系統將代碼轉換為可視化畫面的過程。
  6. responsive(/rɪˈspɑːn.sɪv/) adj. 響應式的;指網站或排版能根據裝置大小自動調整顯示效果。

討論來源

陳小泉

喜愛用文字說明自己眼中所見的一切

較新的 較舊

نموذج الاتصال