網頁字體易讀性沒顧好?讀者正默默關掉你的頁面

大環境裡,內容的競爭一年比一年激烈。為了一篇文章,多數網站願意花錢找文案、約攝影師拍照、下廣告買流量,甚至反覆調整 SEO 關鍵字,就怕內容不夠好、排不上去。然而在這一切用力的背後,有一件幾乎不花錢的事被跳過了,那就是把字調到讀者看得清楚。結果就是一種很反差的畫面。內容端拚得用盡全力,閱讀端卻隨便到讓人得放大螢幕、瞇著眼、讀到一半劃掉。

這件事的名字叫網頁字體易讀性,說的就是讀者能不能不費力地把你的字讀進去。它不是美感問題,也不是設計師的個人品味,而是一個更基本的門檻。這篇文章到底有沒有人讀得完。字級太小、行距太擠,內容再精彩也會在讀者離開的那一秒一起報銷。

先從一個容易被顛倒的順序講起。不是先有好內容才需要好排版,而是字得先讓人看得清楚,內容才輪得到被評價。

字看得清楚,才輪得到內容被評價

字級和行距,不是排版做完後才加上去的最後一道裝飾工序,而是內容能不能被讀完的第一道關卡。這個順序常被弄反。多數人以為排版是「內容做好之後再來美化」的事,但實際上它更像門檻。讀者是先決定「這頁我讀不讀得下去」,才會決定「這篇寫得好不好」。一篇讀不下去的文章,寫得再用心,對讀者來說跟不存在沒有兩樣。

問題是,網站管理者的心力幾乎都投在別的地方。文案要改到順、圖片要選到美、關鍵字要塞到對,這些都看得到成果、也都有人盯。唯獨字級和行距,做完網站上線那天設成什麼樣,往後幾年大概就一直是那樣,很少有人回頭再看一眼。於是常常出現一種落差。內容很拚,閱讀體驗卻很隨便。

會這樣,一部分是因為字級和行距被當成了「風格選擇」,而不是「可讀性門檻」。設計時挑一個看起來清爽的小字級,覺得那是一種調性;把行距壓得緊一點,覺得那樣版面比較俐落。這些判斷都停在「好不好看」,卻沒問一句「這樣還讀得順嗎」。其實好看和好讀不是同一件事,一個網站可以很有設計感、同時很難讀。

行距是這裡面最容易被忽略的一項。很多網站的內文行距,其實根本沒有特別設定,就直接吃了瀏覽器的預設值。而中文內文用的預設行高通常偏低,大約落在一倍到一點二倍字高之間,這對密度本來就高的中文字來說太擠了。字和字上下疊得太近,眼睛換行時容易看錯行、看漏行。這也是為什麼你會看到有些網站,字級明明不算太小,讀起來卻莫名地累,多半就是行距沒調開。要讓中文內文讀起來鬆一口氣,行高通常得往上拉到一點五倍以上,而這一步得自己動手設定,瀏覽器不會替你做。

老花眼與螢幕,是兩個疊加的閱讀障礙

同一組字級和行距,年輕人覺得還好、中高齡讀者卻覺得吃力,這不是誰比較有耐性的問題,而是眼睛和大腦處理小字,真的需要更多時間和力氣。字越小、行越擠,大腦要花的力氣就越多;力氣一超過某個界線,人就會下意識放棄。不是不想讀,是讀起來太累。

對中高齡讀者來說,第一層障礙來自眼睛本身。老花(presbyopia)是一種隨年齡自然發生的變化,也就是眼睛的水晶體逐漸失去彈性,近距離對焦的能力跟著下降。這幾乎是每個人過了一定年紀都會遇到的普遍現象,不是少數人的特例,也不是保養得好就能完全避開。它帶來的結果很直接。近距離看小字會變得吃力,看螢幕當然也算近距離。

第二層障礙來自螢幕。相較於紙本,螢幕本來就比較不利於長時間閱讀:發光的介面、反光、以及在網頁上被壓小的字,都讓眼睛更快疲勞。單看任何一層都還能勉強應付,但這兩層是疊加的。一個近距離對焦已經吃力的人,再遇上一塊字被縮小的發光螢幕,難度不是相加,而是相乘。

老花與螢幕兩層閱讀障礙相乘而非相加,難度倍增讓人更快放棄閱讀
老花讓近距離對焦變吃力,螢幕又讓字更快疲勞,兩層障礙是相乘、不是相加。

字距和行距放大,對閱讀有沒有實質幫助,是有研究基礎的,並不是憑感覺。W3C 在整理無障礙規範時回顧過相關研究,其中 McLeish 在 2007 年做過一項研究,測試不同字距對閱讀速度的影響。把字元間距從 0.04em 一路加大到 0.25em,發現閱讀速度會隨著字距加大而提升,大約到 0.20em 附近開始趨於平緩。換句話說,把字之間、行之間的空間拉開,讓文字不要擠成一團,讀者是真的讀得比較快、比較不費力的。這對眼力吃緊的讀者,效果只會更明顯。

中高齡讀者,是被多數網站忽略的多數

「反正我的受眾是年輕人」,是很多網站主心裡的預設。不過這個假設本身就站不太住腳,因為中高齡族群早就不是那個「偶爾上網看看」的邊緣群體了。

看數字會更清楚。根據財團法人台灣網路資訊中心(TWNIC)委託國立陽明交通大學執行、於 2025 年 12 月發布的《2025 台灣網路報告》,台灣整體上網率已達 88.75%,行動上網率也有 87.12%。上網這件事在台灣幾乎已經是全民日常。更值得注意的是高齡端的變化,70 歲以上長者的上網率,從 2024 年的 50.20% 提升到 2025 年的 53.80%,一年之間增加了 3.6 個百分點。也就是說,連七十歲以上這一段,都已經超過一半的人在上網,而且還在往上走。

那他們上網的時間夠不夠形成一群「真的會讀你內容」的讀者?同一份報告顯示,60 歲以上族群平均每天上網 4.1 小時。這個數字確實比年輕族群低(18 到 29 歲平均每天 7.4 小時、45 到 59 歲則是 5.3 小時),但四小時絕不是「不上網」的量。他們不是不在網路上,只是在網路上遇到讀不動的頁面時,離開得比年輕人更快。

70 歲以上長者上網率一年增加 3.6 個百分點,60 歲以上仍平均每天上網 4.1 小時
70 歲以上上網率一年成長 3.6 個百分點,60 歲以上族群平均每天仍上網 4.1 小時(資料來源:TWNIC《2025 台灣網路報告》)。

把這兩件事放在一起看就會發現一個盲點。你的網站字級行距,是照誰的眼睛在設計的。如果設計時只用設計者自己的眼睛當標準(而設計者通常比較年輕、視力也比較好),那等於在上線的那一刻,就先把一群本來會來、而且人數還在成長的讀者篩掉了。他們沒有抗議,只是默默關掉頁面,你連他們來過都不會知道。

手機把「字太小」這件事,變得更嚴重而不是更方便

換到手機上,情況只會更棘手。多數人以為手機字會自動變得好讀,畫面小、離眼睛又近,感覺應該更清楚才對。但實際上常常相反,螢幕越小,設計者反而越容易為了在一屏裡塞下更多內容,把字級縮小、把行距壓緊,結果手機版讀起來比電腦版還吃力。

對中高齡讀者,這是雙重疊加。他們本來近距離對焦就已經吃力,現在又碰上一個被刻意壓縮的行動版排版,字更小、行更擠。前面說的那兩層障礙(老花加螢幕)在手機上被再壓了一次,難怪很多人在手機上讀網站文章,特別容易看到一半就順手關掉。而手機又正好是多數人現在讀網站的主要裝置,這一關沒過,等於大部分讀者都在受影響。

手機版最容易犯的兩個壓縮習慣

會讓手機版變難讀,通常不是刻意為之,而是兩個很自然、卻有問題的壓縮習慣。

第一個是把桌機版的字級直接等比例縮小。桌機螢幕大,同樣的字級看起來剛好;把整個版面縮到手機寬度時,字也跟著被縮小,在螢幕上看起來「好像還可以」,實際上已經低於行動裝置舒適閱讀的下限。設計者在自己視力正常的眼睛前確認過覺得沒問題,就這樣上線了,卻沒考慮到讀者的眼睛不見得跟自己一樣好。

第二個是為了讓更多內容擠進一屏,把行距壓回接近單行的高度。手機一屏能顯示的內容有限,壓緊行距確實能讓畫面看起來「資訊比較多」,但代價是字和字上下貼得更近,換行時更容易看錯行,在小螢幕上尤其明顯。

這兩個習慣的共同根源,是把「桌機版設計思維」原封不動搬到手機上,用大螢幕、好視力、坐在電腦前的情境去想像,卻忘了手機讀者是拿著小螢幕、可能在移動中、視力也各不相同。其實同一套可讀性的底線在手機上不但一樣適用,甚至更關鍵:行高需要維持足夠比例、正文字級不宜壓到太小,這些在小螢幕上一旦沒守住,讀者流失得比桌機更快。

沒有「正確答案」,但有一條大家都同意的底線

網路上關於字級要設多大,說法多到讓人無所適從。有人說 14px、有人主張 16px、也有人認為內文該用到 18px 才夠。這裡先給個結論讓你安心,你不需要糾結哪個數字才「正確」,因為它本來就沒有單一正確答案。不同的字型、不同的螢幕、不同的讀者,適合的數字本來就會浮動。

真正值得參考的,不是某個人偏好的字級數字,而是一條大家都同意的底線。國際無障礙規範早就把這條底線講得很清楚,而且它有研究基礎、公開可查,比任何個別建議都更站得住腳。W3C 的網頁內容無障礙指引 WCAG 2.2,在成功準則 1.4.12「文字間距」(屬 AA 等級)裡,給出了幾個具體門檻:行高至少要是字體大小的 1.5 倍、段落之間的間距至少是字體大小的 2 倍、字元間距至少是字體大小的 0.12 倍。另外還有一項字間距至少 0.16 倍的規定,不過中文因為不以空格來分隔詞,這一項在中文排版裡並不適用。要留意的是,這個準則的重點不是強制你「一定要設成這些值」,而是要求頁面在讀者自行把間距放大到這些程度時,內容不會因此被截斷、重疊、跑版,也就是說,你的版面要留有讓讀者放大的餘地。

這條底線在台灣也有對應的官方依據可查。「網站無障礙規範」自 2017 年起參照 WCAG 2.0 制定,現由數位發展部主管,公部門網站與許多對外服務都以它為準則。換句話說,把字級行距調到讓人讀得舒服,不只是體貼讀者的加分項,在無障礙的脈絡下,它更接近一種被官方寫進規範的基本要求。你不必把這些門檻背下來,但知道有這麼一條公開、可查、有共識的底線存在,遠比在一堆「我覺得幾 px 比較好」的說法裡繞圈子來得踏實。

三個現在就能自己檢查的地方

講了這麼多門檻和數字,最實際的一步,是回頭看看自己的網站現在讀起來實際如何。以下三件事都不需要工具、也不需要技術背景,任何網站經營者今天就能動手做。

第一件,是把自己的網站放大來看。用瀏覽器的縮放功能,或直接在手機上把頁面放大到 150%、200%,看看內容會不會被截斷、文字會不會互相重疊、按鈕會不會被擠出畫面。這正好呼應了 WCAG 文字間距準則背後真正在意的事。不是逼你把字設多大,而是確認讀者主動放大之後,還讀得完、用得了。如果一放大就跑版,代表你的版面沒有替讀者留餘地。

第二件,是找一位家中長輩、或任何非設計背景的人,實際請他讀一段你網站的內文。你不用問他覺得好不好看,只要在旁邊觀察就好:他有沒有下意識瞇起眼睛、有沒有把手機拿遠一點再拿近、讀到一半有沒有停下來揉眼睛。這些小動作比任何主觀評價都誠實,它們直接告訴你,這段字對真實的眼睛來說是不是吃力。

第三件,是把手機版和桌機版擺在一起對照。同一篇文章,打開手機版,再打開桌機版,比較看看字級和行距是不是在手機上被等比例縮小到低於前面提過的門檻。很多網站的問題就藏在這個對照裡。桌機版讀起來明明還行,手機版卻被壓縮得又小又擠,而手機恰恰是多數讀者實際在用的那一個。

這三件事都很小,小到很容易被跳過,但它們檢查的正是前面所有數字和規範最終要落地的地方,也就是一個真實的人,能不能不費力地把你的字讀完。

字級和行距調得對不對,本質上是一件關於尊重的事。你花了那麼多心力把內容做好,就別讓它卡在「讀者根本看不清楚」這一關前功盡棄。反過來說,這也是所有優化裡成本最低、卻最常被略過的一項,不必重寫內容、不必重拍照片、不必加預算,只要把字調到讓人讀得舒服,就能把原本會流失的讀者留下來。而且這件事的重要性,未來只會更高。愈來愈多人已經開始用語音助理、AI 摘要工具去「聽」一個網站,不再只靠眼睛逐字讀,一個把內容整理得清楚、結構鬆得開的頁面,無論被人讀還是被機器讀,都會是先被善待的那一個。