網(wǎng)站設(shè)計(jì)

Website development

如何快速提高你的版式設(shè)計(jì)水平？

發(fā)布時(shí)間：2017-07-23 16:39:47

版式設(shè)計(jì)水平.jpg

學(xué)習(xí)版式設(shè)計(jì)就是學(xué)習(xí)如何處理信息重點(diǎn)，因?yàn)樵谌魏卧O(shè)計(jì)中，重要的信息需要首先被注意到，然后是次要信息。下面介紹幾種適用性強(qiáng)的區(qū)分層次的手法給大家。

在開始設(shè)計(jì)之前，關(guān)鍵要先梳理好哪些是重點(diǎn)信息，哪些是次要信息。接著就是要講重點(diǎn)放在什么位置，是標(biāo)題，內(nèi)容，還是圖片。這些信息的重點(diǎn)就是版式的層次結(jié)構(gòu)。一旦確立好層次結(jié)構(gòu)，接下來就是靠常用的視覺形式來處理即可，例如通過字距，筆畫粗細(xì)，顏色，以及字體等等。方法如下：

1. 添加垂直空白空間

在標(biāo)題的單行或更多距離上下，將其與其他內(nèi)容分開，達(dá)到強(qiáng)調(diào)的效果。

2. 利用黑色的濃度

這個(gè)方法能強(qiáng)調(diào)其自身的視覺效果。如輕粗線字體、中等粗細(xì)搭配超大字體等。要記住，字號(hào)小的粗體視覺上會(huì)比正常墨線的大號(hào)字顯得更加厚重

例如從常規(guī)體切換到斜體或手寫體，斜體手寫體是好東西，要善用，它可以打破呆板的版面，也會(huì)讓設(shè)計(jì)變得沒那么正式，線條柔和，但是弊端是可讀性低一些，可以適當(dāng)加大字號(hào)，這樣利用閱讀。

4. 換小寫字體為大寫字母

相較于第三點(diǎn)而言，換小寫字母會(huì)比大寫字母能增加設(shè)計(jì)的正式性。大寫字母需要更多的空間，小字號(hào)的大寫字母是一個(gè)更加微妙的轉(zhuǎn)移重點(diǎn)的辦法

5. 色彩是有萬能的工具

字體不一定要用黑白灰來創(chuàng)造出對比的效果，色彩的色相值或者明暗值太相近效果也不好。紅與綠這一類的互補(bǔ)色會(huì)讓字體看上去在波動(dòng)。添加細(xì)膩的顏色或字體時(shí)，可以考慮使用較粗的字體，并給顏色提供大一些的區(qū)間。

6. 改變字號(hào)大小

改變字號(hào)大小來強(qiáng)調(diào)某些內(nèi)容的同時(shí)，要確保主體段落和標(biāo)題之間的實(shí)質(zhì)性差異。如字號(hào)大小太過接近，便不能很好地突出重點(diǎn)。要想突出重點(diǎn)，就要使得字號(hào)之間的差別足夠明顯。還需要注意的是，同樣的字號(hào)大小也可能看起來完全不一樣。如圖，14pt的Baskerville要比14pt的Helvetica看起來大。這取決于：文本周圍的空間，文本的相對尺寸，字體的粗細(xì)等。加大字號(hào)的關(guān)鍵在于，它能作為一種吸引讀者的注意力制造的方法。

7. 少即是多

盡量不要同時(shí)采用太多方式表達(dá)強(qiáng)調(diào)和重點(diǎn)，如果在一個(gè)地方使用過多的技術(shù)，會(huì)讓人有點(diǎn)眼花繚亂。這樣不僅起不到強(qiáng)調(diào)的作用，相反還會(huì)淡化重點(diǎn)。當(dāng)你試圖強(qiáng)調(diào)重點(diǎn)，并分出層次時(shí)，少即是多是一個(gè)很強(qiáng)的判斷標(biāo)準(zhǔn)。用電腦來做出一些調(diào)整十分容易，你需要有一些約束，避免將上述的各種方法用的混雜。

如上圖，強(qiáng)調(diào)的內(nèi)容過于多，標(biāo)題加粗加下劃線，用了兩種無關(guān)顏色，僅僅一p的內(nèi)容就用了4種字體，調(diào)整方案如下，去掉多余裝飾，僅保留兩種字體，只用黑灰兩色，好配合這張干凈簡潔的圖片。

另外一個(gè)特別需要注意的，少即是多不僅僅是對視覺，更是對設(shè)計(jì)師的欲望控制，很多人都想一次性把所有技術(shù)一并用上的沖動(dòng)。因?yàn)椴灰欢ㄒ蠛按蠼胁拍茏屓寺牭?，在耳邊吹個(gè)風(fēng)更能撩人，哈哈！

8. 標(biāo)題

一旦確定好正文中的各個(gè)部分的側(cè)重點(diǎn)后，便可以開始設(shè)置適當(dāng)?shù)淖煮w和版式，如果各級(jí)標(biāo)題有著不同的重要程度，應(yīng)該盡量確保在視覺上就能夠區(qū)分開來。

把一行或一個(gè)字分成不同部分，或者對一個(gè)標(biāo)題運(yùn)用不同大小的字號(hào)，這樣的畫面看起來會(huì)更有靈動(dòng)性，不會(huì)呆板。例如，英文的話可以把介詞或者連接詞（a，the，and，or）設(shè)置成小點(diǎn)字號(hào)，以此突出其他重點(diǎn)文字。所以在標(biāo)題內(nèi)容本身也是有重點(diǎn)層級(jí)的區(qū)分。

還有一點(diǎn)，如上圖，介詞“the”的位置比大標(biāo)題和正文高度高了一行，這樣處理的原因是可打破其規(guī)矩的畫面，使得版式不顯得呆板。

有一些設(shè)計(jì)師還會(huì)用斐波那契數(shù)列來決定字號(hào)的大小層次。在斐波那契數(shù)列中，每一個(gè)數(shù)字是前兩個(gè)數(shù)字之和。通過這種方式可能會(huì)出現(xiàn)的數(shù)列，如8，10，18，28，46或者8，12，20，32，52。這也是一直比較不會(huì)犯錯(cuò)的做法，當(dāng)然不一定完全按照數(shù)列的數(shù)值，根據(jù)具體要求細(xì)微調(diào)整是可行的。

原創(chuàng)不易，未經(jīng)授權(quán)，嚴(yán)禁轉(zhuǎn)載

原文地址：http://www.mpian.cn/i,72,7242,0.html

上一篇：大型的視覺設(shè)計(jì)系統(tǒng)都是怎么設(shè)計(jì)出來的？

下一篇：設(shè)計(jì)合理的障礙，同樣可以成就優(yōu)秀的用戶體驗(yàn)

您還有可能感興趣的內(nèi)容

建站流程

Website development

網(wǎng)站需
求分析
網(wǎng)站策
劃方案
頁面風(fēng)
格設(shè)計(jì)
程序設(shè)
計(jì)研發(fā)
資料錄
入優(yōu)化
確認(rèn)交
付使用
后續(xù)跟
蹤服務(wù)
+86 10 64758810
18510861135

熱門標(biāo)簽

Website development

客戶評價(jià)

更多+

感謝云智互聯(lián)，系統(tǒng)提前完成，在整個(gè)項(xiàng)目周期內(nèi)，云智互聯(lián)對待我們并不像是對待客戶，更像是朋友一樣，每一次，都能以專業(yè)的角度向我們提出更合理、更有效的解決方案，并快速、細(xì)致地完成我們的每一個(gè)需求，再次感謝以至誠之心做事的云智互聯(lián)團(tuán)隊(duì)。

潘濤
我是東方龍馬集團(tuán)，在云智家做了2個(gè)企業(yè)官網(wǎng)，服務(wù)態(tài)度超級(jí)好。如果想做網(wǎng)站，選擇他家一定不后悔。性價(jià)比高，服務(wù)態(tài)度好。值得你的信賴！

譚嬌
技術(shù)好，設(shè)計(jì)精良，操作便利，很專業(yè)！配套的服務(wù)和后續(xù)的服務(wù)都很好,網(wǎng)站封面堪稱精品，運(yùn)行方便，后臺(tái)操作的簡單。技術(shù)還會(huì)耐心教我,很好的云智互聯(lián)（北京）科技有限公司，建站很不錯(cuò)的。

陳曦
不錯(cuò)，價(jià)格比較合適，重點(diǎn)是響應(yīng)速度蠻快，有什么問題都會(huì)馬上給你解決，公司很滿意，因?yàn)樗麄兌际轻槍γ總€(gè)項(xiàng)目建了相應(yīng)的討論組，有問題可以再里面提出，人員分工到位，解決問題很及時(shí)。

張經(jīng)理