雖然《寫給大(dà)家(jiā)看(kàn)的(de)設計(j‍γ♠ì)書(shū)》在很(hěn)久之前已經出版，如(rú)今再看(kàn)還(há£​<i)是(shì)有(yǒu)許多(duō)值得(de)借鑒的(de)地(dì ₩≈÷)方。本期總結了(le)書(shū)中排版的(de)四大(dà)原¶π則部分(fēn)，結合我搜集的(de)一(yī)些(xiē)案例，希望有(yǒu)所幫助哈≥λ←₩。

一(yī)般說(shuō)來(lái)，如(rú)果γ∑我們想要(yào)控制(zhì)頁面，首先要(yào)知(zhī)道∑$(dào)有(yǒu)哪些(xiē)設計(jì)原則，一(yī)旦我們$≈注意到(dào)它，他(tā)們便無處不(bù)在。其中，最基礎也(yě)是←§(shì)最重要(yào)的(de)頁面排版四大(dà)原則：對(duì)比、重複σ∏™、對(duì)齊、親密性。

對(duì)比（Contrast）

對(duì)比從(cóng)字面上(shàng)簡單易懂(dǒng)，很(hěn)容易吸引讀(dλ ↓±ú)者去(qù)看(kàn)一(yī)個(™≥‌gè)頁面。例如(rú)大(dà)字體(tǐ)和(hé)小≥÷(xiǎo)字體(tǐ)的(de)對(duì)比↔©♥​，冷(lěng)色和(hé)暖色的(de)對(∞β​λduì)比等。如(rú)果兩個(gè)元素想要(yào)形成對(duì)比，就(jiù)λσ應當使之不(bù)同，而且是(shì)截然不(bù)同。↓πδ

一(yī)眼看(kàn)下(xià)去(qù)這(zhè)個(gè)頁面幹淨簡潔★✘÷β，但(dàn)是(shì)缺少(shǎo)了(le$ε∞→)一(yī)些(xiē)能(néng)夠抓住眼球的(d®★>e)東(dōng)西(xī)，也(yě)就(jiù)是(shì)看(kàn)不(bù)到(dπ& ào)明(míng)顯的(de)主次之分(fēn)。既然不(bù)同↑​ ，就(jiù)可(kě)以讓他(tā)們截然不(bù)同，我&♥₹β們可(kě)以嘗試做(zuò)以下(xià)修改：

對(duì)于标題，既然我們想讓讀(dú)者第一(yī)時(shíδ ≤≥)間(jiān)注意到(dào)，不(bù)妨用(yòng)更大(dà)更粗的(de)字體(tǐ ♣α•)來(lái)強調它，內(nèi)容的(de)小(xiǎo)标題，統一(↕★ ×yī)用(yòng)一(yī)種稍小(xiǎo)的(dγ≠e)加粗文(wén)字，也(yě)符合之後要(yào)講到  ≥(dào)的(de)“重複”原則。同時(shí)，标題和(hé)內(nèi)容的(de)$λ大(dà)小(xiǎo)要(yào)做(zuò)∞★ ¶明(míng)顯的(de)區(qū)分(fēn)，以此達到(dào)“對(duì)比”。✘φ 

一(yī)句話(huà)中不(bù)同部分(fēn)也(yě)可(kě)以采用(yòng)粗細或大↕×β(dà)小(xiǎo)對(duì)比，強調感情強烈的(dπδ≥§e)部分(fēn)，畫(huà)面也(yě)更具感染力。

強烈的(de)大(dà)小(xiǎo)對(duì)比可(kě)以使目光(guāng)很(hěn)∏ ♣€快(kuài)地(dì)聚集到(dào)文(wén)字較大(dà)的(de)部分(fēn)。

顔色對(duì)比，對(duì)于視(shì)覺☆¶∞感受的(de)影(yǐng)響立竿見(jiàn)影(yǐ<≠δ₽ng)，例如(rú)這(zhè)張一(yī)¶∞≠加3手機(jī)發布會(huì)的(de)PPT，僅僅通(tōng)過顔色好(hǎo)π÷​§像就(jiù)能(néng)體(tǐ)會(huì)到(dào)高(​<¶gāo)低(dī)溫的(de)區(qū)别。

對(duì)比（contrast）小(xiǎo)結

如(rú)果你(nǐ)想形成對(duì)比，不(bù)妨加大(dà)力度。對✔>✘α(duì)比不(bù)僅可(kě)以增強頁面效果，更有(yǒu)助于文(w飙n)字的(de)組織。可(kě)以通(tōng)過  >€大(dà)小(xiǎo)、顔色、粗細、空(kōng)間(jiān)∑₽≠λ等方式，需要(yào)注意的(de)是(shì)，對(duì)Ωγ比一(yī)定要(yào)強烈。

重複（Repetition）

重複絕不(bù)僅僅是(shì)元素的(de)複制(zhì)≥®₹®粘貼，更多(duō)地(dì)時(shí)候我們可(kě)以把它理(lǐ)解為(wèi)頁面∞<≠×的(de)一(yī)緻性，利用(yòng)某些(xiē)元素的(de)重複來(lái)使整個(g₽β→è)設計(jì)作(zuò)品達到(dào)統一(yī)的(de)效果。它們可(k♣₽ě)以是(shì)字體(tǐ)、形狀、顔色等等，但( ← ±dàn)是(shì)一(yī)定要(yào)遵循某種設定好(hǎo)的(de)規律。

logo設計(jì)中，将相(xiàng)似的(de)元素進行(xíng §β≈)重複變形，也(yě)可(kě)以取得(de)不(bù)錯(cuò)的(de)效果←"£，例如(rú)華為(wèi)和(hé)Adid λas。

在PPT頁面排版中，将多(duō)個(gè)相(xiàn÷"g)同類别的(de)欄目重複排放(fàng)，屢試不(bù)爽≥™β。

在海(hǎi)報(bào)設計(jì)中，重複的(de)運用(yòng)也(yě)©‍可(kě)以使畫(huà)面富有(yǒu)張力，例如(rú)今年(ni↕"án)的(de)蘋果開(kāi)發者大(dà)會(huìφ¥β×)（WWDC）邀請(qǐng)函。

蘋果的(de)設計(jì)師(shī)對(duì)于重複似乎樂(yuè)此不(bù)疲，官網的(∑£de)廣告中也(yě)頻(pín)繁使用(yòng)這(zhè)種手法，将多(duō)個(g ±£è)相(xiàng)同的(de)産品同時(shí)呈現(xiàn)，但(dàn)他(tā)們各自β£×(zì)在顔色、形态上(shàng)并不(bù)完全相(xiàng)同。

在做(zuò)設計(jì)的(de)過程中，如(r₽αú)果一(yī)個(gè)元素引起了(le)你(nǐ)的(de)興趣，不(bù)妨拿(₹€∞ná)來(lái)做(zuò)重複元素，同時(sh ♠♣í)也(yě)添加一(yī)些(xiē)全新的(de)東(dōng)西(x₩<¥±ī)。這(zhè)些(xiē)重複的(de)部分(fēn)并不(bù)一εσ₹≤(yī)定完全相(xiàng)同，但(dàn)是(shì)會(huì)給人(rén$>≠$)一(yī)種不(bù)突兀的(de)整體(tǐ)感。

重複（repetition）小(xiǎo)結

重複最重要(yào)的(de)作(zuò)用(yòng)就(jiù)在于統一(☆<↓§yī)，并增強作(zuò)品的(de)視(shì)覺效果。同時(shí)< ÷₩，為(wèi)了(le)避免重複過多(duō)同一(yλ<'ī)種元素，不(bù)妨對(duì)其進行(xíng)适當的(de)變化(huà&¥)，引起興趣的(de)同時(shí)又(yòu)不(←$bù)會(huì)讓人(rén)生(shēng)厭(yà↔<≈↕n)。

對(duì)齊（Alignment）

對(duì)于設計(jì)新手而言，圖片、文(wén)字的(de)随意擺π<放(fàng)往往讓人(rén)感覺頁面很(hěn)雜(zá) Ωδ亂，任何東(dōng)西(xī)好(hǎo)像都(dōu)是(shì)随意丢在一(yī)邊。相(£♦ xiàng)對(duì)的(de)，對(duì)齊原‌♥λ$則是(shì)說(shuō)任何元素都(dōu)不(bù)能(néng)随意÷≠擺放(fàng)，它們應該與頁面上(shàng)的(de)₹‍★ε某個(gè)物(wù)體(tǐ)有(yǒu)空(kōng)間(jiān€εβ)上(shàng)的(de)聯系，雖然眼睛看(kà♦↕€πn)不(bù)到(dào)，但(dàn)是(sh β ì)好(hǎo)像有(yǒu)一(yī)條線将他(tā)們↓β連接起來(lái)。

現(xiàn)代大(dà)多(duō)數(shù)人(rén)的(deπ<≤σ)閱讀(dú)習(xí)慣是(shì)從(cóng)左側開↔♥☆♣(kāi)始，為(wèi)數(shù)不(bù)少(shǎo)的(de)海(hǎi)報(bào)設"< 計(jì)都(dōu)采用(yòng)了(le)文(wén)字左對(du♣‌ì)齊的(de)方式，即使文(wén)字大(dà)小(x≈÷±iǎo)、數(shù)量不(bù)同，仍可(kě)以'₩£↑散發出一(yī)種整齊的(de)美(měi)感。

在用(yòng)到(dào)邀請(qǐng←≥δ )函以及一(yī)些(xiē)較為(wèi)莊重的(de)場‍<¥✔(chǎng)合時(shí)，居中對(duì)齊的σ↔ (de)方式往往更加有(yǒu)儀式感，這(→ε±zhè)也(yě)是(shì)平時(shí)我們最常用$∞'(yòng)的(de)一(yī)種方式。

對(duì)齊（Alignment）小(xiǎo)結

對(duì)于新手而言，一(yī)個(gè)頁面上(shàng)一(yī)種對←‌(duì)齊方式已經足夠。另外(wài)在設計(jì)頁面時(shí)，使用(yòng±÷≈≠)輔助線是(shì)幫助我們對(duì)齊的(de)一(yī‍< )個(gè)好(hǎo)習(xí)慣，可(kě‍σ₩)以讓頁面統一(yī)而有(yǒu)條理(l‌✘&₩ǐ)。補充一(yī)條簡單實用(yòng)的(de)對(duì)齊方法：确保§  ®任何一(yī)個(gè)元素都(dōu)能(néng)在本頁與另外(wài)一(yī↑ε)個(gè)元素存在著(zhe)視(shì)覺聯系。

親密性（Proximity）

親密性的(de)原則是(shì)指将相(xiàng)關的(de₹ β→)部分(fēn)組織在一(yī)起，這(zhè)≈₩♦¥樣一(yī)來(lái)，有(yǒu)關系的(de)部分(fēn)被看(kàn)​ 做(zuò)一(yī)個(gè)組，而不(bù)是(shì)零散的♣β‍₩(de)個(gè)體(tǐ)，這(zhè)樣也(yě)給讀€‍‍ (dú)者明(míng)确的(de)提示，快(kuài)速掌握頁面的(de)內(nèi)容分(₩≠fēn)布。

在這(zhè)裡(lǐ)，我們不(bù)妨§&★§将“對(duì)比”中的(de)案例進行(xíng)優化(huà)。案例中小(x"★ δiǎo)标題與內(nèi)容、段落之間(jiān)的(de)距離(lí)過于相(xià★Ω≥ng)似，兩端的(de)區(qū)别沒有(yǒu)能(néng)很(hěn)好(π<‌♦hǎo)地(dì)區(qū)别開(kāi)，我們可(kě)以✔±€☆做(zuò)适當變化(huà)。

優化(huà)之後，頁面的(de)內(nèi)容被劃分(fē≈&↓₩n)為(wèi)了(le)明(míng)顯的(∞↑de)兩個(gè)部分(fēn)，更易于閱讀(dú)。

在多(duō)組并列內(nèi)容排版時(shí)，重複與親密性往往是(shì)不(bù)可(kě≈®)分(fēn)離(lí)的(de)，使頁面充滿條理(lǐ)。

親密性原則在一(yī)些(xiē)時(shí)尚畫(huà)冊類的(de££₹≠)設計(jì)中也(yě)尤為(wèi)明(míng)顯，畫(huà)面€γ✘π的(de)內(nèi)容呈現(xiàn)為(wèi)塊狀分α¥(fēn)布。

親密性（proximity）小(xiǎo  λ)結

親密性的(de)根本目的(de)是(shì)實現(xiàn)組織性，如$® ≥(rú)果信息具有(yǒu)條理(lǐ)，≈ 将更容易被閱讀(dú)，也(yě)更容易被記住。如(rú)果元素無關，就(jiù)要↔♣(yào)将其分(fēn)開(kāi)，同時(shí)避免頁面上(shàφ×φng)出現(xiàn)太多(duō)孤立元素。

四大(dà)原則的(de)內(nèi)容基本介紹結束啦，需要(yào)注意的(de)是(shì$✘≥)，它們并不(bù)是(shì)單獨分(fēn)離(lí)的(de)四項原則，而常常作(zuò)¶ ☆✘為(wèi)一(yī)個(gè)整體(tǐ)同時(shí)出現(xiàn)，下(★Ω→"xià)面補充一(yī)些(xiē)優秀的(de)排版設計(j§‍↓ì)作(zuò)品，共同學習(xí)進步。