設(shè)計理念：網(wǎng)頁UI設(shè)計95%是排版

本文譯自一個研究并提供信息架構(gòu)的網(wǎng)站：Information Architects Japan，原文：Web design is 95% typography.

看到這個題目，大家的第一感覺可能是“聳人聽聞”。不管是95%或是更多或是更少，排版確實是一個不可忽略的問題。在我所遇到的web設(shè)計師中，還沒有發(fā)現(xiàn)誰真正在意web排版的?？吹竭@篇文章，感觸頗深（因為我剛使用linux的時候需要配置字體，順便學(xué)習(xí)了不少的字體知識，也順便成了一個愛好），周日在家挺閑，為了提高英語水平，順手翻譯了出來。希望對大家有所啟發(fā)。

又及，文章多次出現(xiàn)typography這個單詞。正規(guī)的中文翻譯應(yīng)該是“排印”，但考慮web這個非印刷媒體，使用排印并不見得好。于是我根據(jù)語境，有時用“排版”，有時用“排印”，請讀者明鑒。以下是翻譯正文。

web中的信息有95%是成文的語言。為何web設(shè)計師應(yīng)該好好學(xué)習(xí)一下設(shè)計成文信息的主要準(zhǔn)則，換句話說，排版？這就是最佳的理由。

信息設(shè)計就是排版

回到1969年，Emil Ruder, 一個瑞士著名的排印大師，其筆下關(guān)于當(dāng)時的印刷氛圍，簡直就是我們今天網(wǎng)站的寫照：

今天印刷術(shù)的泛濫成災(zāi)讓我們的個人價值被輕視，因為郁悶的我們現(xiàn)在并不能掌控印刷中的一切。分割、組織和實現(xiàn)印刷術(shù)的一切是排印師應(yīng)有的任務(wù)，只有這樣，讀者才有更好的機(jī)會找出吸引她／他的東西。

信息設(shè)計師是21世紀(jì)的排版師

稍微聯(lián)想一下（請用在線取代印刷），這就像是信息設(shè)計師的職務(wù)描述。分割、組織和實現(xiàn)印刷術(shù)的一切是“信息設(shè)計師”應(yīng)有的任務(wù)，只有這樣，讀者才有更好的機(jī)會找出吸引她／他的東西。宏觀排版（所有的文本結(jié)構(gòu)）跟微觀排版（樣式和空間的細(xì)節(jié)方面）包括我們今天稱為“信息設(shè)計”的很多方面。也就是說，信息設(shè)計師今天正在做排印師30年前的工作：

排版面臨一個很直白的職責(zé)，這就是傳達(dá)信息。沒有理由能免除排版的這一職責(zé)。一個并不能閱讀的印刷品只能變成一個無用的產(chǎn)品。

優(yōu)化排版就是優(yōu)化閱讀，親和力，可用性，綜合文本平衡等。組織文本塊并結(jié)合圖片，難道不是圖形設(shè)計師、可用性專家、信息架構(gòu)師應(yīng)該做的嗎？但為什么這是一個被忽視的主題呢？

為什么這是一個被忽視的主題？ 字體太少？分辨率低？

反對在線排版準(zhǔn)則的一個觀點是：能用的字太少了。第二個觀點是屏幕分辨率太低，首先就讓像素或者反鋸齒字體很難閱讀。

文藝復(fù)興時期：只有一種字體

認(rèn)為我們沒有足夠的字體可用的觀點是不切題的：在意大利文藝復(fù)興時期，排印師只有一個字體可用，但這個時期還是產(chǎn)生一些頂級漂亮的排版品：

該排印師應(yīng)該沒有太在意他手中手能掌握的字體種類，實際上也不應(yīng)該太在意字體的選擇。他應(yīng)該更關(guān)心時代賦予自己手中所有的，并盡力發(fā)揮。

選擇字樣并不是排版

第二個觀點也并不見得好到哪兒去。在印刷初期，印出來的字母質(zhì)量比我們今天在顯示器上看到的更差。更重要的是，如果處理得專業(yè)，屏幕字體更易于閱讀。信息設(shè)計不是關(guān)于使用好的字樣，而是關(guān)于使用好的排版。兩真的區(qū)別很大。誰都可以使用字樣，有人可以選擇好的字樣，但只有少數(shù)人能夠精通排版。

把文本當(dāng)作用戶界面

對，不同平臺和不同瀏覽器如何處理字體是惱人的，也對，分辨率問題讓超過五分鐘的注意力集中很困難。但是，好啦，確保文本在所有主要平臺和瀏覽器中賞心悅目是web設(shè)計師的職責(zé)。正確的行間距，單詞和字母間距，留白，一定量顏色的使用有助于可讀性。但還不徹底。一個優(yōu)秀的web設(shè)計師知道如何跟文本而不僅僅是內(nèi)容打交道，“把文本當(dāng)作用戶界面”。瞧瞧Kohi Vinh的網(wǎng)站，你大概會明白他的意思：

稍微著名把文本當(dāng)作用戶界面的網(wǎng)站例子有： google, ebay, craigslist, youtube, flickr, Digg, repit, delicious. 一個難以爭辯的必然，把文本當(dāng)作用戶界面是成功的的唯一參數(shù)。成功的網(wǎng)站設(shè)法同時創(chuàng)建簡單的界面和強(qiáng)烈的特征。但這是另外一個主題了。

為了“破除關(guān)于web排版的某些荒謬想法”，他已經(jīng)“按照Bringhurst的工作原則來構(gòu)建他的網(wǎng)站，并解答如何通過HTML和CSS中可用的技術(shù)來達(dá)成各項目標(biāo)”。

優(yōu)化排版的5個簡單步驟

他所談?wù)摰呐虐?ldquo;并不是你典型的‘該用哪種字體’的排版”。對于相信讓字號和行間距默認(rèn)大小使得文本能夠任意縮放會提高網(wǎng)站可用性的人，這是一個不錯的閱讀材料。

Khoi Vinh

behaviordesign的創(chuàng)始人之一?，F(xiàn)為NYTimes.com的設(shè)計主管。非常天才的一個人。

Rod Graves

通訊設(shè)計師。令人贊嘆的工作：“排版是我絕對的中心。排版網(wǎng)格和層次通常會成為我開發(fā)的視覺語言的基礎(chǔ)。”

A List Apart

通過字樣通訊。字體和布局。為讀者設(shè)計。易讀性。字樣，圖形設(shè)計。web排版的問題?？刂苭eb排版：字號、字體和顏色。CSS方法，瀏覽器問題，用戶問題和解決方案。

Association Typographique Internationale

ATypl(Association Typographique Internationale) 是一個專注于樣式和排版的主要國際組織。創(chuàng)建于1957年，ATypl為國際樣式社區(qū)之間提供通訊的結(jié)構(gòu)，信息和活動。

Thinking with Type

書籍Thinking with Type的在線伙伴：設(shè)計師，作家，編輯和學(xué)生的關(guān)鍵指南。

Typetester

比較屏幕字體樣式。

Typophile

Typophile是一個會員制和贊助商支持的社區(qū)。2000年以來Typophile引領(lǐng)開放合作，并且我們總是能學(xué)習(xí)到好主意。我們他們伺服超過每月3百萬的網(wǎng)頁。

Typohile Wiki

一個有關(guān)樣式和設(shè)計所有一切的用戶創(chuàng)建百科全書。用戶為建立協(xié)作，有用，平衡和相關(guān)的資源而創(chuàng)建和編輯條目。

The Next Big Thing in Online Type

比爾蓋茨要計算機(jī)用戶，哦，微軟用戶，能夠擁有一個更舒暢的屏幕閱讀體驗——太重要以至于提高屏幕閱讀成為他最重要的五件事之一。

Emil Ruder, Typographie (Amazon)

Emil Ruder’s Typography是一本永恒的書，幾代排印師和圖形設(shè)計師都從中學(xué)習(xí)基本原理。Ruder, 二十世紀(jì)最偉大的排印師之一，是一個拋棄并用新的規(guī)則取代Emil Ruder傳統(tǒng)規(guī)則的先鋒，來滿足新排印技術(shù)的需求。