本圖來自ANN
這篇是在老貓學出版社之部落格裡發現，裡頭對於正在規劃部落
裡的《順眼感》的我受益良多，跟有部落格的朋友們一起分享。
原文章如下↓
老貓按：為了讓網路閱讀更舒適，減少大家的眼睛疲勞，本文歡
迎任何人用任何形式轉載，商業或非商業都無妨。只需註明網址
出處即可。
這半年來台灣的部落格風潮，可說是越颳越興旺，許多優秀的傳
統媒體寫作者，大量轉移寫作平台，開始建立自己的部落格。但
這時我卻發現「會寫作」和「會寫部落格」之間，還有著相當的
落差。許多人有非常棒的學養和見解，可惜文章貼出來卻讓人難
以逐讀。
不是因為見解不深刻，也不是因為文筆欠優美，而是因為文章讓
人「看」不下去──文章密密麻麻，版面沒有考慮「易讀性」，
讀者眼睛疲勞，讀來自然備感痛苦。你等於加設了一道辨讀文字
的關卡擋在讀者理解文意之前，讀者還沒來得及思考你說了什麼
一上站先就被缺乏易讀性的版面打敗了。
部落格是個「一貼上就發表」（post and publish）的出版工具，
從寫作到發表，沒有任何距離，不像傳統媒體，中間還有一個叫
做編輯的傢伙，幫你調整段落、設定格式，讓你的文章印成鉛字
以後，你越看越滿意。
少了編輯，「文章的表現形式」變成作者要自行打理的事了，你
不再能只管內容，而不管表現。可惜從一個傳統編輯的角度看，
越善於在傳統媒體寫文章的人（包括寫論文報告的人），似乎越
難以掌握網頁閱讀的形式。
這真是很可惜，因為要注意的事情實在很少，而且做起來也非常
簡單。你只要注意幾件事就可以大幅改善版面易讀性，讓文章更
乾淨可讀，讓好不容易上站的讀者願意靜下來看看你說了什麼。
為什麼我敢這麼說呢？因為我是個十八年經驗的出版社編輯，「
把內容處理成適合閱讀的形式」，正是我的專長，十八年來別的
工夫沒學好，但這件事可是天天在做的。
以下就是一個傳統圖書編輯，對部落格寫作形式的五點建議。前
三點是給完全沒有網頁技術能力的人用的，你只要遵守這三點，
就可以大幅提升你的文章易讀性。後面兩點則需要一點技術功力
但也只是一點點而已。
五點全部做到，保證讓你的文章更容易閱讀（特別提醒一下：易
讀性談的是表現形式，跟內容好壞無關，易讀性改善只是讓讀者
容易讀，並不會讓你的文章因此變成傳世經典）。
一、段落短一點，分段多一點
網上閱讀不比紙本書，根據美國的調查顯示，「短的段落最適合
閱讀，閱讀率是長段的兩倍」。我自己的經驗是，盡量保持每段
中文字在一百字以內，比較容易閱讀。
這件事對許多習慣長篇大論、一個段落動輒四、五百字的人，是
嚴重的考驗。強烈建議每個部落格作者，文章發表以後，自己好
好看一遍，如果你自己讀來都覺得辛苦，那就不要指望讀者會看
得很樂了。
分段問題還有一個小細節，就是有人喜歡用新詩式的分行方式行
文，這也不好，詩體的閱讀節奏就是緩慢，散文而走詩體，對易
讀性是一大考驗。
二、用空行分段
我們知道紙張書是用段首空格來分段的，但是在網頁上，我發覺
最恰當的分段模式是「空行」。你現在正在讀的這篇文章，就是
用空行來分段的。而大部分經驗豐富的網路寫手，不約而同也都
採用這個方式來分段。這是小事，可是整體影響卻很嚴重，千萬
不能輕忽。
更詳細的討論可以看這篇文章：段落的祕密。
三、選模版要注意字級、行距與行長
現在的部落格，不論是申請免費服務的 (例如中華電信的Xuite或
剛剛跟番薯藤合併的樂多日誌 )，或者自己找程式安裝架設的(例
如我在用的pLog、Zonble用的WordPress或早期部落客最常用MovableType），多半都會提供各式各樣的「風格模版」，你應該選一個底色乾淨、字級大小適當、行距與行長協調的模版。
我注意到許多模版的行距都有問題，太窄了，網路閱讀因為眼睛
的距離比讀紙張書更遠，理論上行距應該更寬才對，合理的行距
需要配合行的長度調節，但至少不應該少於字級大小的50％。
（如果你可以設定模版的話，請把正文行距設定為 line-height: 1.5
以上。以老貓學出版為例，我的內文行距是 line-height: 1.6 ）。
行距的重要性甚至超過字體大小，而適合英文的模版，行距通常
不適合中文閱讀，所以這個應該列為一定要修改的項目才好。
另外有些人喜歡把內文字設為灰色，感覺整體看起來很優雅，要
小心，你可能是以犧牲易讀性為代價的。文字和底色之間必須要
有足夠的彩度或明度對比，灰色字會降低對比，讓閱讀產生困難。
四、別在內文區襯底色或底圖
白底黑字永遠是易讀性最高的版面，別為了耍花樣而在內文區加
上底色（非常淺的底色尚可接受）或底圖，那剛好讓你顯得很不
專業，又干擾讀者的閱讀。反白字（黑底白字）也不是好設計，
如果你不以為然，不妨想想電腦畫面為什麼會從DOS時代的藍底，
變成微軟或蘋果視窗的白底。原因不為別的，易讀性正是其中很
重要的理由（如果你一定要證據，這裡有一份美國的研究報告可
以參考：Interface Design and Optimization of Reading of Continuous Text）。
除非你的目的就是秀版面，而不是秀文字，不然你應該克制在內
文區增加花樣的欲望。刊頭是很適合玩花樣，其他地方則不宜。
當然底色通常是模版決定的，所以這一點應該列入模版選擇的參
考因素。
五、使用樸素的超連結格式
網頁文件用超連結來延伸閱讀空間，這個特色很有用，但是對易
讀性則有傷害，因為正文遇到連結就變色，眼睛讀到那裡就要頓
一下，頗有干擾。尤其程式設計還可以讓已訪問和未訪問的連結
使用不同顏色，版面更花更不利閱讀。
不得已的妥協，我們不希望放棄超連結，又不希望超連結的變色
讓視覺衝擊太大，可以考慮讓超連結的兩種狀態（link和visited），
使用相同的CSS設定。
例如我的做法是只在前者多加一道淺底線作區隔。這點是有點技
術難度，我知道，不過如果你真的希望讀者閱讀沒有太多阻隔，
遲早你會研究到這裡。
在部落格的時代，只注意文章寫作是不夠的，在你的文章和你的
讀者之間，再也沒有編輯為你解決表達形式的問題了，你得自己
來，安頓你的版面，免得讓形式妨礙了閱讀。
我也藉此呼籲一下有能力設計模版的人，注意一下這五點，你的
設計直接影響使用者的閱讀效率，在設計之前，每個人都應該問
一下，這個模版是讓人發表文章用的，還是讓人秀（你的）花樣
用的。
留言列表
設計工作 (11)
