DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 中文網頁排版的段落前空兩格設計探討
中文網頁排版的段落前空兩格設計探討
編輯:關於網頁技巧     

首先要搞清楚“空兩格”的意義是什麼?段首空格表示段落重新開始,基本小學寫作文都這麼教的。但“空兩格”真的就能清楚標示段落麼?這個問題被放大到互聯網上,尤其在對比英文段落效果後,中文段落“空兩格”的傳統開始受到質疑。先來看新浪博客網志頁的兩格例子:

1. 無空格無換行排版(下圖)

無空格無換行排版

2. 有空格無換行排版(下圖)

有空格無換行排版

對比可知,其實段首空不空格效果差不多,都是密密麻麻一整塊。空格之前,用戶如果想看清段落需要掃視到段尾,然後再返回段首閱讀;空格之後,雖然用戶看段首能明白段落,但我認為效果提升不明顯且不整齊。

有網友認為段換行是“西化”的風格,因為英文單詞沒法空兩格,所以采用換行來區分段落。也有網友認為空兩格是中文的傳統,中國文化丟不得。為什麼要段首空兩格一文中做了很多考證工作,有助於幫助我們理解中文傳統的來龍去脈,但文章結論“大多數中文網絡內容段首空兩格(縮進)是很好的分隔段落的方式。”我不是很認同。從信息組織角度來看,段落內行之間的關系要比段落之間的關系低一個級別,所以在呈現上段落之間的“段距”應該大於段落之內的“行距”,如此才能一目了然。在語義角度分析,每個段落也都需要成對的<p>標簽做容器。

記得最早為了追求段首空格效果,大家往往使用空格,或者&nbsp字符來填充,甚至使用全角空格來應付不同浏覽器的解析差異。後來,又使用CSS語法的text-indent來定義p的段首留白。折騰來折騰去,最後我發現比較好的閱讀體驗還是換行分段,比如現在我blog采用的排版樣式。

3. 換行排版(下圖)

換行排版

當然,也有大量網站采用了空格+段落的排版樣式,中西合璧。看起來效果也還行,但左側不齊我總覺得怪怪的,對可讀性也不見有多少提升。段首空格尤其在每段內容很少的情況下,如大量一行兩行,效果相對更“參差不齊”,和浪費空間。

4. 有空格有換行排版(下圖)

有空格有換行排版

常見的中文排印上,其實大多是上文提到“有空格無段落排版”風格,前日有幸與《程序員》雜志的孟主編和劉總編一起坐下來也探討到此內容,深有感觸。包括段首字放大,其實也是段落標識曾經流行的一種方法,可見中國設計師還是做過不少探索。中文本身是有特殊的地方,但對於信息傳達的本質,世界上所有語言殊途同歸。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved