當(dāng)前位置: 首頁 > 設(shè)計(jì)資訊 > 理論文摘 > 正文

10個(gè)排版秘訣搞定你的設(shè)計(jì)!

2018-12-12 1840 0

文字排版(Typography)不只是從下拉選單選擇字型和點(diǎn)數(shù)而已,文字排版是一項(xiàng)流傳數(shù)世紀(jì)的技藝,自木制和金屬的活版印刷便開始,而且它不只歷史悠久,還很實(shí)用,大部分的人只要掌握一些實(shí)用的訣竅,就可以將之活用在諸如履歷表、電子報(bào)或名片等日常設(shè)計(jì)項(xiàng)目上。

1. 將要表達(dá)的訊息配上適當(dāng)?shù)母杏X
用了兩種差不多的字型?或是你總是用最喜歡的那一種字型?以上都是沒有妥善選擇字型的情形。

每種字型都散發(fā)獨(dú)特的情感或個(gè)性,也許是友善、新潮、嚴(yán)肅或傻里傻氣,但大部分的字型并不是萬用的,所以你要判斷一個(gè)字型對你來說是怎么樣的感覺,還有它適不適合放在這個(gè)設(shè)計(jì)里面。方法之一就是列出你希望設(shè)計(jì)呈現(xiàn)哪些特質(zhì),如果能先確定內(nèi)容更好,這樣就能直接挑選字型來配合建立好的內(nèi)文調(diào)性。

字型設(shè)計(jì)師 Eben Sorkin 曾經(jīng)說過:每種字體都有自己的聲音,這種聲音將影響我們閱讀文字的感受,也影響我們吸收和處理信息的過程。

它的力量強(qiáng)大,能讓任何形式的文字溝通更加有效且更有說服力。當(dāng)文字符合字型的個(gè)性,大家閱讀起來會更快更容易;若兩者不合,文字就會變得混亂,拖慢讀者的速度。訪客讀起來越容易,就越容易找到他們要的內(nèi)容并點(diǎn)擊購買或返回(或達(dá)成其它設(shè)計(jì)的目的)。

2. 配合讀者的心情
現(xiàn)在你已經(jīng)替你的設(shè)計(jì)配了完美的字型,但有個(gè)小問題,并非所有人對同一種字型都有一樣的感覺,選擇了適合的字型后,你也要確定它適合你的觀眾。

可能有一群人覺得這字型很新潮,另一群就覺得它過時(shí),因?yàn)槲覀兛醋中偷姆绞绞艿轿幕B結(jié)的影響,而文化又和年齡及地區(qū)有相當(dāng)大的關(guān)系,所以要對你的目標(biāo)群眾有敏感度,如果你對選擇的字型有所遲疑,問問那個(gè)團(tuán)體的人,征詢他們的意見,能讓你的文字排版效果更好。

如果你的觀眾范圍很廣,并非特定族群呢?那你可能就得選擇較為中性的字體,不強(qiáng)調(diào)鮮明特色而能融入其他對象。這種字型經(jīng)常稱為「Workhorse」字體,通常是基本的襯線或無襯線字型,而且因?yàn)椴灰俗⒁舛猛緩V泛。

3. 讓字型的尺寸搭配設(shè)計(jì)內(nèi)容
選擇和安排設(shè)計(jì)的字型時(shí),閱讀難易度應(yīng)該是首要考慮之一。字太小難以閱讀,字太大又很煩人,因此一般而言,印刷用段落文字應(yīng)該落在 10 — 12 點(diǎn)之間,而網(wǎng)頁則是 15 — 20 之間,大部分的瀏覽器默認(rèn)值是 16 點(diǎn)。

4. 安排層次
如果一個(gè)設(shè)計(jì)層次分得好,看起來就整齊,容易定位,可以更容易找到你要的信息。文字排版的層次對于像是電子報(bào)、雜志、書和其他傳統(tǒng)印刷物,及某些網(wǎng)站等文字很多的設(shè)計(jì)特別重要。
基本的層次設(shè)計(jì),可以利用以下幾點(diǎn):

    用字的大小來依重要性排序信息。

    用充足的空間來創(chuàng)造一個(gè)容易檢視的架構(gòu)


設(shè)計(jì)成也細(xì)節(jié),敗也細(xì)節(jié),其中留白和對齊影響很大,這兩者可以讓版面又?jǐn)D又混亂,也可以帶來干凈和秩序。

讓我們一起來看看幾種常見的留白:

字距(Tracking):文字間距,又稱字間,這是在一段或一句文字中,每個(gè)文字的固定間距,調(diào)整這選項(xiàng)會讓整體文字看起來更擠或更松,縮小間距常用來節(jié)省空間,但太過緊密會讓文字難以閱讀,配合所選字型,找到適合的文字間距,是讓文章好讀的最佳方法之一。

行距(Leading):每行間距,這是行與行間的垂直距離,就像字距一樣,過多過少都會讓文字難以閱讀或格格不入。

邊界:這是設(shè)計(jì)周邊的空白空間,除非有特殊需求,不然通常你不會想讓內(nèi)容看起來像要掉出頁面一樣,在頁面周圍大方地留點(diǎn)空間,讀起來會更舒服。

留白:用來指設(shè)計(jì)中所有空白、白色、空無一物的空間,如果你要放很多內(nèi)容,留白看似很浪費(fèi),但要讓畫面平衡、有條理,這是不可或缺的。他讓觀眾的視線在畫面中移動,同時(shí)讓眼睛有地方可以休息。

至于對齊方式,「保持一致」是增進(jìn)文字排版最好的方法,在同一設(shè)計(jì)中無意義地切換各種對齊方式(靠左、靠右、置中、分散),只會看起來很隨便。

一些小訣竅:

    少用兩端對齊。這幾乎每次都會產(chǎn)生一堆不規(guī)則的空間和隨機(jī)分布的大量空白,看起來很亂而且很難閱讀。

    在段落文字選擇一種對齊方式(通常是靠左),并保持一致。

6. 學(xué)會字距微調(diào)
有一種留白是大家常常忽略的:字距微調(diào)(字間)。字句微調(diào)常和字距搞混,但兩者是不同的,字句微調(diào)是單指兩個(gè)文字間的距離。

字句微調(diào)通常是用來檢查文字排版是不是完美且專業(yè)的最后一個(gè)步驟,每種字型都有默認(rèn)的字句微調(diào),但有些文字組合起來間距就是不理想,尤其又大又顯眼的文字排版,比如說標(biāo)題,最好多檢查一下有沒有哪兩字間隔過大或過小,必要的話再手動調(diào)整。

7. 限制你的字體、粗細(xì)和樣式數(shù)量
我們熱愛各種字型,但好東西太多也不好,一個(gè)設(shè)計(jì)用過多不同的字體看起來會混亂又不專業(yè)。

基本上,一份設(shè)計(jì)別用超過三種字體,如果是好的設(shè)計(jì)搭配對的內(nèi)容,也是可以打破這項(xiàng)規(guī)則,制造電子、復(fù)古的效果,比如以下這份設(shè)計(jì)。

如果你剛開始混合使用字型,基本的襯線搭配無襯線字體,幾乎都能搭配,或者找一種有各種粗細(xì)和樣式的字體或字體系列來搭配,這樣你的文字排版看起來就互相呼應(yīng),同時(shí)還保留一些變化空間。

粗細(xì)和樣式很容易被濫用,這些樣式可以強(qiáng)調(diào)文字的重要性,在視覺上更突出,或是模擬說話語氣,但別在一段文章內(nèi)用上一堆樣式,這樣會看起來強(qiáng)調(diào)得太用力,而且會讓讀者感到不禮貌。實(shí)際上,就算只用超過一種以上樣式的機(jī)會都不多。

8. 避免常見的「排版病」
設(shè)計(jì)程序當(dāng)著我們完成很多了不起的事,但若不夠小心,有時(shí)候也讓人容易犯下一些顯而易見的錯(cuò)誤?!碩hinking with Type〉 的作者 Ellen Lupton 在書的官方網(wǎng)站上,舉了幾個(gè)壞習(xí)慣作為例子: 不要為了填滿版面任意拉長文字,若你只拉長一個(gè)方向,會讓文字及間距嚴(yán)重變形,如果要重設(shè)大小,請固定長寬比例。

別用錯(cuò)誤的引號。在英文字句中有的人會用直線引號代替逗號型引號,或者在中文使用英文引號,大部分的程序可以設(shè)定自動取代功能,或是打字的時(shí)候善用快捷鍵。

不要使用假斜體。如果字型本身沒有提供斜體,在設(shè)計(jì)程序里還是可以簡單地把它傾斜,做成斜體,但這種技術(shù)會讓字體變形,而且通常看起來很糟糕。真的斜體是另外設(shè)計(jì)來補(bǔ)充原本字型的不足,而且通常是比較好的選擇。

這兒的知識點(diǎn)可以參考:《專業(yè)干貨!想強(qiáng)調(diào)重點(diǎn)該用粗體、下劃線還是斜體?》

9. 避免沖突的顏色或背景
文字排版很少獨(dú)立存在,它通常會和其他元素搭配,尤其是背景。文字和其他部分間有足夠的對比,可以讓文字更易讀,但有些小技巧可以幫忙調(diào)降一下對比:

顏色的沖突:如果要幫文字挑顏色,你可能會想要挑個(gè)能和其他元素搭配的顏色,包括背景,如果顏色太格格不入,像是很丑的彈出式廣告窗口,背景是紅色,字是鮮綠色,或者顏色太相近,像是白色的字搭淺色背景,眼睛負(fù)擔(dān)都很大,視覺效果很差。

試試用現(xiàn)有的色系組合,來創(chuàng)造和諧的畫面:

圖案或復(fù)雜的背景:一樣地,太復(fù)雜的背景也會讓字難以閱讀,而你應(yīng)該不想觀眾找不到信息。


總而言之,當(dāng)你嘗試發(fā)揮創(chuàng)意的同時(shí),記得保持文字排版的清晰易讀。

10.觀察與練習(xí)
增進(jìn)文字排版技巧的最佳方式之一,就是觀察其他設(shè)計(jì)師的作品是如何運(yùn)用文字排版,這需要不斷地練習(xí)并培養(yǎng)判斷的眼光。所以請時(shí)時(shí)注意優(yōu)秀的文字排版,它可能是捷運(yùn)告示,也有可能是雜貨的標(biāo)簽。
16
評論區(qū)(0)
正在加載評論...