本篇出處 http://b-oo-k.net/blog/blog.php/2006/8
一、段落短一點，分段多一點
網上閱讀不比紙本書，根據美國的調查顯示，「短的段落最適合閱讀，閱讀率是長段的兩倍」。我自己的經驗是，盡量保持每段中文字在一百字以內，比較容易閱讀。
這件事對許多習慣長篇大論、一個段落動輒四、五百字的人，是嚴重的考驗。強烈建議每個部落格作者，文章發表以後，自己好好看一遍，如果你自己讀來都覺得辛苦，那就不要指望讀者會看得很樂了。
分段問題還有一個小細節，就是有人喜歡用新詩式的分行方式行文，這也不好，詩體的閱讀節奏就是緩慢，散文而走詩體，對易讀性是一大考驗。
二、用空行分段
我們知道紙張書是用段首空格來分段的，但是在網頁上，我發覺最恰當的分段模式是「空行」。你現在正在讀的這篇文章，就是用空行來分段的。而大部分經驗豐富的網路寫手，不約而同也都採用這個方式來分段。這是小事，可是整體影響卻很嚴重，千萬不能輕忽。
更詳細的討論可以看這篇文章：段落的祕密。
三、選模版要注意字級、行距與行長
現在的部落格，不論是申請免費服務的（例如中華電信的Xuite或剛剛跟番薯藤合併的樂多日誌），或者自己找程式安裝架設的（例如我在用的LifeType、Zonble用的WordPress或早期部落客最常用的MovableType），多半都會提供各式各樣的「風格模版」，你應該選一個底色乾淨、字級大小適當、行距與行長協調的模版。
我注意到許多模版的行距都有問題，太窄了，網路閱讀因為眼睛的距離比讀紙張書更遠，理論上行距應該更寬才對，合理的行距需要配合行的長度調節，但至少不應該少於字級大小的50％（如果你可以設定模版的話，請把正文行距設定為 line-height: 1.5 以上。以老貓學出版為例，我的內文行距是 line-height: 1.7 ）。
行距的重要性甚至超過字體大小，而適合英文的模版，行距通常不適合中文閱讀，所以這個應該列為一定要修改的項目才好。
另外有些人喜歡把內文字設為灰色，感覺整體看起來很優雅，要小心，你可能是以犧牲易讀性為代價的。文字和底色之間必須要有足夠的彩度或明度對比，灰色字會降低對比，讓閱讀產生困難。
四、別在內文區襯底色或底圖
白底黑字永遠是易讀性最高的版面，別為了耍花樣而在內文區加上底色（非常淺的底色尚可接受）或底圖，那剛好讓你顯得很不專業，又干擾讀者的閱讀。反白字（黑底白字）也不是好設計，如果你不以為然，不妨想想電腦畫面為什麼會從DOS時代的藍底，變成微軟或蘋果視窗的白底。原因不為別的，易讀性正是其中很重要的理由（如果你一定要證據，這裡有一份美國的研究報告可以參考：Interface Design and Optimization of Reading of Continuous Text）。
除非你的目的就是秀版面，而不是秀文字，不然你應該克制在內文區增加花樣的欲望。刊頭是很適合玩花樣，其他地方則不宜。
當然底色通常是模版決定的，所以這一點應該列入模版選擇的參考因素。
五、使用樸素的超連結格式
網頁文件用超連結來延伸閱讀空間，這個特色很有用，但是對易讀性則有傷害，因為正文遇到連結就變色，眼睛讀到那裡就要頓一下，頗有干擾。尤其程式設計還可以讓已訪問和未訪問的連結使用不同顏色，版面更花更不利閱讀。
不得已的妥協，我們不希望放棄超連結，又不希望超連結的變色讓視覺衝擊太大，可以考慮讓超連結的兩種狀態（link和visited），使用相同的CSS設定。
例如我的做法是只在前者多加一道淺底線作區隔。這點是有點技術難度，我知道，不過如果你真的希望讀者閱讀沒有太多阻隔，遲早你會研究到這裡。
在部落格的時代，只注意文章寫作是不夠的，在你的文章和你的讀者之間，再也沒有編輯為你解決表達形式的問題了，你得自己來，安頓你的版面，免得讓形式妨礙了閱讀。
我也藉此呼籲一下有能力設計模版的人，注意一下這五點，你的設計直接影響使用者的閱讀效率，在設計之前，每個人都應該問一下，這個模版是讓人發表文章用的，還是讓人秀（你的）花樣用的。
一、段落短一點，分段多一點
網上閱讀不比紙本書，根據美國的調查顯示，「短的段落最適合閱讀，閱讀率是長段的兩倍」。我自己的經驗是，盡量保持每段中文字在一百字以內，比較容易閱讀。
這件事對許多習慣長篇大論、一個段落動輒四、五百字的人，是嚴重的考驗。強烈建議每個部落格作者，文章發表以後，自己好好看一遍，如果你自己讀來都覺得辛苦，那就不要指望讀者會看得很樂了。
分段問題還有一個小細節，就是有人喜歡用新詩式的分行方式行文，這也不好，詩體的閱讀節奏就是緩慢，散文而走詩體，對易讀性是一大考驗。
二、用空行分段
我們知道紙張書是用段首空格來分段的，但是在網頁上，我發覺最恰當的分段模式是「空行」。你現在正在讀的這篇文章，就是用空行來分段的。而大部分經驗豐富的網路寫手，不約而同也都採用這個方式來分段。這是小事，可是整體影響卻很嚴重，千萬不能輕忽。
更詳細的討論可以看這篇文章：段落的祕密。
三、選模版要注意字級、行距與行長
現在的部落格，不論是申請免費服務的（例如中華電信的Xuite或剛剛跟番薯藤合併的樂多日誌），或者自己找程式安裝架設的（例如我在用的LifeType、Zonble用的WordPress或早期部落客最常用的MovableType），多半都會提供各式各樣的「風格模版」，你應該選一個底色乾淨、字級大小適當、行距與行長協調的模版。
我注意到許多模版的行距都有問題，太窄了，網路閱讀因為眼睛的距離比讀紙張書更遠，理論上行距應該更寬才對，合理的行距需要配合行的長度調節，但至少不應該少於字級大小的50％（如果你可以設定模版的話，請把正文行距設定為 line-height: 1.5 以上。以老貓學出版為例，我的內文行距是 line-height: 1.7 ）。
行距的重要性甚至超過字體大小，而適合英文的模版，行距通常不適合中文閱讀，所以這個應該列為一定要修改的項目才好。
另外有些人喜歡把內文字設為灰色，感覺整體看起來很優雅，要小心，你可能是以犧牲易讀性為代價的。文字和底色之間必須要有足夠的彩度或明度對比，灰色字會降低對比，讓閱讀產生困難。
四、別在內文區襯底色或底圖
白底黑字永遠是易讀性最高的版面，別為了耍花樣而在內文區加上底色（非常淺的底色尚可接受）或底圖，那剛好讓你顯得很不專業，又干擾讀者的閱讀。反白字（黑底白字）也不是好設計，如果你不以為然，不妨想想電腦畫面為什麼會從DOS時代的藍底，變成微軟或蘋果視窗的白底。原因不為別的，易讀性正是其中很重要的理由（如果你一定要證據，這裡有一份美國的研究報告可以參考：Interface Design and Optimization of Reading of Continuous Text）。
除非你的目的就是秀版面，而不是秀文字，不然你應該克制在內文區增加花樣的欲望。刊頭是很適合玩花樣，其他地方則不宜。
當然底色通常是模版決定的，所以這一點應該列入模版選擇的參考因素。
五、使用樸素的超連結格式
網頁文件用超連結來延伸閱讀空間，這個特色很有用，但是對易讀性則有傷害，因為正文遇到連結就變色，眼睛讀到那裡就要頓一下，頗有干擾。尤其程式設計還可以讓已訪問和未訪問的連結使用不同顏色，版面更花更不利閱讀。
不得已的妥協，我們不希望放棄超連結，又不希望超連結的變色讓視覺衝擊太大，可以考慮讓超連結的兩種狀態（link和visited），使用相同的CSS設定。
例如我的做法是只在前者多加一道淺底線作區隔。這點是有點技術難度，我知道，不過如果你真的希望讀者閱讀沒有太多阻隔，遲早你會研究到這裡。
在部落格的時代，只注意文章寫作是不夠的，在你的文章和你的讀者之間，再也沒有編輯為你解決表達形式的問題了，你得自己來，安頓你的版面，免得讓形式妨礙了閱讀。
我也藉此呼籲一下有能力設計模版的人，注意一下這五點，你的設計直接影響使用者的閱讀效率，在設計之前，每個人都應該問一下，這個模版是讓人發表文章用的，還是讓人秀（你的）花樣用的。
文章標籤
全站熱搜
我系列 (5)
註明出處啦 小心被告