演講試讀邀稿◎占卜預約解讀,請洽 alice425@gmail.com Line ID:askareiko     週六日可預約

進階篇:部落格美感學

叫一個不太懂美感的人寫美感學,而且是寫部落格美感學這種看起來不困難、做起來很抓狂、又不算大的小事情,我想當初介紹我接寫稿的人和責任編輯Karen,心臟要夠強才行。眼見書出來了,自己寫得心驚膽顫的稿子也變成了鉛字,免不了還是想跟大家分享一下啦!以下是我給網路與書的稿子,也算是自己從開始架部落格到現在,所有的實戰經驗及觀察心得,寫得不好,歡迎批評指教。


在台灣很多人寫Blog、很多人玩Blog,但是有多少人注意到,部落格也像人一樣,要美美的才能上得了檯面呢?除去非常技術、需要動腦改樣式表或程式的部份不談(這已經屬於怎麼玩Blog的範疇了),我們來看看如何簡單輕鬆地讓部落格有美感吧!

對於使用BSP服務的朋友來說,讓部落格具有一定的美感其實非常簡單,只要選定任一個系統提供的版面套用,美感的呈現就已經完成50%;另外的50%,則需考慮到邊欄(sidebar)配置及套用後的版面呈現了。使用Blog程式自行架設的朋友,由於版面可以自由更換,在自由度提高之下,版面的簡潔與整體易讀性便顯得格外重要。以下即針對版型、主文區、邊欄(sidebar)及頁首頁尾等部份個別說明。

版型
前面說過,使用BSP服務的朋友,選對一個風格版型,就可以讓部落格的美感呈現50%;使用Blog程式自行架設的朋友,版型的選擇與更動自由度更高,選擇易讀性高的版面便成為首要之務。以下歸納幾點選擇與套用版型的注意重點:

配色簡單
一般來說,整個版型的顏色最好不要多過三種。也就是說,部落格標題一種顏色,邊欄區一種顏色,主文區一種顏色;多過三種顏色,就會使閱讀者的眼睛產生不適感。當然,配色越簡單,閱讀者越容易聚焦在主文區喔!

底圖不要太大
使用BSP服務套用版型的朋友,會有很多機會選到有底圖的版型,如果底圖整個佔滿,一方面干擾閱讀,再來會造成眼睛不適。所以如果選有底圖的版型,底圖的位置以不蓋到主文區為主。

邊欄欄位可自行調整
邊欄欄位需要自行調整的原因,在於部落格的主人要把哪些重要資訊提供出來,藉由調整邊欄欄位的動作,一方面讓版面更加美化,增加易讀性,另一方面也有宣傳部落格的好處。

主文區
這個地方是美感的另一個關鍵,主要以易讀性為考量。根據資深編輯老貓所提的易讀性五大建議、網路上流傳的Blog七大設計趨勢,加上個人意見,針對主文區部份整理如下:

從標題就把文章分類
部落格本身就有把文章分類的機制,不過那是屬於分大類的作法。雖然有很多Blog套件或BSP服務支援文章多重分類,但在大多數的BSP服務中仍以一階的分類佔大宗,所以在文章標題前加上分類是有其必要性的。

段落要短,分段可多可少
網路上的閱讀與閱讀紙本書是不一樣的,一般人眼睛解析網頁段落的極限與容忍度偏低,在閱讀段落太長的網路小說或Blog文章時會產生生理或心理的不適,所以在主文區盡量採取段落短、分段多的作法,對減輕不適感、增加易讀性有很大的幫助。

主文區別襯底色或底圖
老貓指出白底黑字永遠是易讀性最高的版面,個人認為是白底黑字有容易聚焦的效果,不會干擾閱讀,減低繼續看下去的意願。

以空行分段
紙本書分段都是以段首空格方式分段,但是網頁文章(包括Blog)在內,空行分段是看起來最舒服,也最沒有壓力的方式。

選擇最適當的字級、字距、行距與行長
閱讀網頁文章(包括Blog)在內,行距或字距太窄對眼睛會產生不適感,行長太長會讓讀者一直使用Scroll bar移動,喪失便利性;字級太小或字體顏色對比太小,會增加眼睛不適的機率,易讀性也下降。

邊欄(sidebar)
一般朋友會在部落格的邊欄放置很多資訊,包括:自我介紹、站內消息、文章分類、最新文章、行事曆、留言板、部落格寵物、Flickr相簿、Blog聯播文章等等,有些相對重要的資訊其實就可以把它收在部落格標題或Banner下方,一方面使版面看起來更為簡潔清爽,再來也不會讓邊欄過長,喪失版面的易讀性。

選擇單邊欄(兩欄式版面)或雙邊欄(三欄式版面)也是一種學問。有部份朋友選擇雙邊欄的原因是他/她想釋出的訊息太多;如果選擇單邊欄會造成頁面過長,影響整體的易讀性,選擇雙邊欄或許好一點,但是不免也會落入訊息越放越多的窘境中。

頁首/尾
這部份包括部落格標題、Banner、頁尾宣告等等。在前面有提到,有相關重要資訊可以放在頁首,特別是在部落格標題或Banner下方,還有一個目的是聚集焦點。

Banner的放置也是一大學問,除了一般正常尺寸的468*80 pixel外,為數眾多的朋友把他們生活中的精采照片也加工變成Banner。特別需要注意的是,這種加工後的Banner雖然具有個人風格,但因為不是標準大小,在放置時需要更動樣式表設計,對剛接觸Blog的新朋友是不建議使用的。

部落格在台灣紅紅火火,每天新出現的部落格不知道有多少,如何讓自己的部落格能吸引更多的眼球(eyeball),是每個部落格主人的努力目標。有個美美的外表,再搭配充實的內容,相信你也會成為有人氣、有名氣的部落格主人喔!

註1:本文收錄於《當如果遇上部落格》P.101~P.105 (網路與書出版)
註2:當如果遇上部落格博客來至3/30止有79折優惠喔!
註3:3月份誠品好讀P.86有當如果遇上部落格的介紹喔!

歷史上的今天還寫了....
Blog Widget by LinkWithin
  • 請問…Rex是何許人也?
    ^_^

  • 我知道了…
    是郝先生
    ^_^

  • 智邦生活館網摘頻道編輯

    部落格版主:

    您好!我是智邦生活館的編輯。智邦生活館首頁改版新推出編輯推薦-網摘精選單元。在網路上四處為網友們精挑細選好文章。今日拜讀此篇文章,欣賞其中的筆調和觀點,將其選為 2006年4月3日艾瑪美食生活頻道的網摘 (http://digest.url.com.tw/amarylliss/),與網友們分享。我們推薦如果造成你的不便,煩請回信告知(twblogs@gmail.com)。如需好文貼紙,請至 http://digest.url.com.tw/amarylliss/sticker.php 謝謝您!

    敬祝 平安

    智邦生活館網摘頻道編輯 敬啟

  • 文章寫的很好喔..簡單易懂,受益良多

  • 寫的非常好喔:)

    內容相當具有參考性,不只可以套用在blog的架設上。

    只有是有架設CMS(內容管理系統)網站需求或單純的個人網站都可以一體適用。

    給妳一個大拇指:)

  • 部落格美感學

    從『愛麗絲夢遊部落格仙境 』借來的『部落格美感學』http://www.askareiko.com/archives/000589.php…