December 07, 2002

傳送至 Kindle
互動式隨選列印/另存成 PDF

[黑客人生]我的版面哲學

我在改這個模版的時候,選擇用最陽春的 Clean 預設模版來改。為什麼呢?因為我預計自己會有繁複的功能和大量的文字堆積,在這種情況之下,如果板面的其他部分像是框線或區塊的樣式顏色太多的話,反而會炫賓奪主,讓使用者只會發出「哇,好繽紛喔」這樣的讚嘆,然後對於我的文字完全忽略。

然而預設的黑底灰字既不醒目又不好看,所以我大膽決定把整個配色反相處理。反相是一個相當有趣的作法;照理來說各種顏色之間的對比距離都可以把存下來,但是螢光幕本身偏亮的設計卻會使得反相後的黑底白字變得更加顯眼。

事實上官方預設的模版裡,也有兩個是深色系底色的,可是他們的文字/連結顏色太過刺眼(亮黃色跟青色?),因此直接被我摒除在外。我不喜歡反差太大的配色,所以我沿用了黑─灰這樣的對比程度。

日期或格與格之間的框線一度想要加進去,但是你知道當字的本身已經提供多量資訊的時候,再加進框線,並不會讓板面清爽整齊,反而會像是在捕魚網。於是我打消了框線的主意。

因為我的分區文字個性很強 ─ 也就是說妳並不需要額外的提示就可以看出來這一塊和那一塊並不相同,所以我決定不去把不同的部分套上不同的底色。理由同前,我不想讓訊息的載體凌駕於訊息本身之上。

後來我把原先的文字式分類說明改成了圖示,這有兩個用意。其一是因為大片的黑底白字仍然會讓人開始找不到段落的起點,所以我需要醒目的標的。另一方面是在這種黑色背景之中,小區塊的卡通畫風圖示,剛好可以有非常強力的加分作用。於是我從家裡的五十萬圖庫中,努力蒐集出調性合適的數百張,然後再按照我的分類選出合適的圖示。

這些小圖示不但讓原本恐怕會過於晦澀的配色染上了活潑的生命力,更對於「分類」這個部分有著畫龍點睛的韻味。當然這也剛好是因為我的標題與分類名稱總是取得含糊而冷情,加強了對比之後的韻味。

我幾乎把所有的訊息跟字串都做了中文化;這並不僅是要讓瀏覽我的部落格的使用者更容易上手,更重要的是要達成風格的一致性。翻譯本來就不只是把一國的詞彙至換成另一國的,而是要讓整個情境轉移,讓使用者身在其中,好像這本來就是一個以一貫之、融為一體的世界觀。這是我的翻譯哲學。或者說,「翻譯就是賦義」。

當然我還做了些貼心的小修改,例如說在原本的範例模版中,只有教妳怎麼顯示「最近有寫回應(迴響)的作者」。可是這有甚麼用呢?當有人開始貼迴響,妳甚至不知道有沒有更新、或者根本不知道是針對那個主題的迴響。於是我的修改就這麼生出來了:妳可以知道這是哪時候由誰對哪一的迴響。妳在瀏覽迴響的同時,也可以方便地跳回去看原來的脈絡。這都是別人的模版還沒有加進去的呦!

除此之外,妳可以發現我的文章累積得太多,而且我留在版面的文章也很多(三週,比預設的一週多太多),這會讓讀者很難去知道「到底我沒上來的這段期間裡,多了多少和多少迴響?」所以我又在最上面的頁眉處加上即時的統計數據。所以妳一按下 reload 發現數目沒變化,就可以不需要等畫面慢慢傳完了。這也是一種體貼頻寬的作法囉!

喔,對了,忘記提,我還有一項微小但是重要的更動,就是我把大部分的字型設定都放大了一級。這是因為中文字的筆畫比英文字母的筆畫密度要高得多,因此原先設計給英文顯示的字型大小其實一點都不適合中文顯示。

這可不是看不看得見、甚至是看不看得懂的問題,而是在於美觀。中國的書法,其實很講究「空白」的部分,筆畫間的空間,往往卻是字的魂魄所在。終日碰觸程式碼的人,也許早已習慣緊密的文字,夾帶大量的意識奔馳,但是天下的讀者並不是只有這一種。好的頁面就該跟印刷「正確」的書籍一樣,輕的讓你只看到字,看不到印刷/排版。

換而言之,要讓使用者看到畫面的同時,不需要任何額外的費力,就能夠看到字裡行間的私語。至少這是我一再想要努力的方向。

藝立協部落格可以說每個人的風格迥異,其實毫無所謂最好最壞,風格往往反映出部落格主人的個性思緒,也必須要跟那個部落格的內容契合,才會是好的樣式。妳看到這個部落格的同時,妳正看著我的成長、我的魂魄以及我的自己。如果妳欣賞這樣的我,我會感到高興;如果妳覺得我的作法妳用得上,我歡迎妳取用我的模版;如果妳也願意跟我一樣,分享自己的蛻變經歷,我也會與有榮焉,並且替其他人感激。

不過,這一切都只憑妳一心決定。

(+) 於 所發表 |
[創用 CC 授權條款]
我的版面哲學〉由 Jedi 製作,所有內容如無特別聲明,一律以創用 CC 姓名標示 3.0 台灣版授權條款釋出。
相關文章:
歷史上的今天:
迴響
[ 1 : 靜態鏈結 ]

其實我比較喜歡apia的設計風格。
為此,也順便抄了一下... :P

?交大畢聯會
http://www.cc.nctu.edu.tw/~graduate

YK_Lee 發表於 March 20, 2003 02:44 PM
[ 2 : 靜態鏈結 ]

連到你模版的連結,但是沒看到東西呢!或者,該怎麼選取這個目錄之下的資料呢?可否麻煩再教一下?謝謝!

我其實一直也對MT的字型相當頭痛,偏偏對html和css語言都很陌生,現在還在摸索如何把原本預設相對大小的設定改成絕對大小。這部份我似乎沒看到相關文章,或者我找漏了嗎?

謝謝你的幫忙!

KarlMarx 發表於 June 26, 2003 03:55 AM
[ 3 : 靜態鏈結 ]

to KarlMarx:
用相對字型比較正確吧...
請參考我跟 hlb 合譯的「深入親和力 ─ 第二十六天:使用相對字型尺寸

Jedi 發表於 June 26, 2003 07:18 AM
[ 4 : 靜態鏈結 ]

另,我放在 p4 的模版是 release (釋出)版,實際上很久沒有更新了。我目前使用的版本 (current) 其實相當不錯,祇是有一些地方還要花時間修得更精簡。妳可以參考:「備份模版」這一篇。

Jedi 發表於 June 26, 2003 07:21 AM
[ 5 : 靜態鏈結 ]

太好了!我會仔細研究一下。多謝!

KarlMarx 發表於 June 26, 2003 03:08 PM
給我迴響吧!
個人資訊








是否記住個人資訊?



請依上圖輸入檢核碼:
迴響





Jedi.org: 部落格 | Weblog | 三太子 | 討論 | MTBook | 網頁親和力 | 深入親和力 | 簡報原力:AV | 履歷 | + | @ | Flickr | Lytro | tumblr | NSFW