網頁設計理論：對比和等同

 　　等同和對比，聯系與分別，歸類和不歸類等都是能將元素中相同或不同的元素加以區別的方式。基於它們所承載的信息，我們希望等同的元素能發生某種聯系，用以表明它們在某一方面的相似性。我們同樣也希望不同的元素加以區分，以顯示它們分屬不同的類別。

　　等同和對比是通過元素之間所呈現的關系表現出來的，如果兩個元素有著某種聯系，可以確定這兩個元素必定有相同的特性。當然，兩個不同元素也必定看上去不同。

　　基礎特性

　　你是如何表達元素間的等同和對比性的?是的，從它們的基礎特性中表現出來。

　　那麼，什麼是元素的基礎特性呢?基礎特性就是指的元素本身所固有的特點。舉例來說，這個元素是什麼顏色?它有多大?它是什麼形狀?

　　這些特性都試圖傳遞著關於元素的最本質的信息。如果一個標題看上去比另一個標題更大，那麼我們就會預估第一個標題更加重要。我們也會把那些尖銳的凹凸不平的東西視為危險信號。

　　通常，元素的一類特質通過與另一元素的同類特質相比較才具有意義，上面關於標題就是這樣一個例子。一個標題必須與另一個標題或另外一片文字相比較才能凸顯它的重要性。在這裡，大小成為一個很重要的對比特質。通過比較，元素才得以表達出它們之間的等同和對比。

　　另外一種情況是，我們讓幾個元素在視覺上出現相同的特質，讓這些元素成為一組同類元素。如果一個網頁上出現兩個元素：兩個紅色圓圈，用戶自然就會對此產生好奇，為什麼它們都是紅色?為什麼都是圓圈?這會引發出的結論是也許它們不止是外觀上的等同，還有其他更深的聯系。元素外觀的等同也會讓人聯想到它們會攜帶相似的信息。

　　同樣的，如果我們讓兩個元素外觀上不同，那麼它們表達出的就是兩個完全不同的元素，它們的意義也有所不同。

　　任何可以被改變的元素特性，都可以讓元素變得等同或不同。下面所列出的元素特性便是如此：

　　尺寸

　　形狀

　　顏色

　　賦值

　　紋理

　　位置

　　方向

　　一個長方形和一個圓形的形狀對比很明顯，而兩個紅色元素在顏色上具有一致性。一個紅色長方形和一個紅色圓形就會出現形狀各異而顏色相同的情況。你怎樣平衡元素中的等同和不同的元素特性，這將決定你的元素要與用戶溝通些什麼。

　　注意：基礎特性是區分類似與不同的基本方法，但還有其他方式可以對它們加以區分：元素實際上所承載的信息內容。例如“停”和“走”這兩個字的對比，“停止”和“停下”這兩個詞的相似。圖片對比文字，長文章對應短文章，等等。

　　對比

　　當人類看到不同的元素會本能地產生緊張的反應，這是自然進化的生存機制，以使我們能迅速辨認出威脅，讓我們快速反應出是否需要立刻飛奔回到安全的地方。

　　我們的這種分辨異類的能力使“對比”這一方式變得特別強大。凡對比定會引起注意。它就是吸引眼球的方法。想要讓某個元素得到注意，那就讓它在視覺外觀區別於其他元素即可。如此一來，我們便能制造出視覺焦點。事實上，正因為讓元素從環境中脫穎而出的方法是如此簡單，我們也不難猜測，如果想要你的設計變得更有趣，這或許也是一個最有效方法。

　　對比的確可以增強吸引力。它也能在兩種元素間建立起分界。舉例來說，主要內容和花絮內容的不同背景色就能輕松將它們區分開來，讓用戶一看便知哪裡是主要內容，哪裡是花絮。

　　對比也能起強調的作用，高亮顯示某一重點元素和內容。越是明顯的不同，對比越明顯，其重要性就越強。

　　例如，有兩種不同的文字標注方式：加粗和斜體。加粗通常會讓對比更為明顯。即使是遠距離一瞥也能比斜體文字更易辨認。

　　如果你想要區分兩個元素，那就將放大它們之間的對比。相信你不希望讓用戶自己來判斷它們是否不同吧?確保對比直觀且顯而易見。不要有模糊不清的地方，讓人產生困惑。不要用16px的文字去對比15px的文字。人們通常不會注意到細微的差別，就算是注意到，也會發生誤判。‘

　　但是，也請不要對比得太過火。慎用對比。如果所有元素都有區別，都在爭搶注意力，那麼，其實就等於沒有對比一樣。過多的干擾產生視覺混亂。

　　太多的對比也會打破設計中的和諧，造成不必要的緊張和凌亂。也許在某些特別的設計中需要用到它，但是平時絕對少碰為妙。首先確認哪些元素需要突出，然後讓它們與其他元素發生對比。

　　對比與格式塔

　　格式塔完型規律在某方面也是依賴於等同和對比的。對於圖案背景和突出焦點來說，對比是特別重要的。

　　圖案背景

　　當我們看到一個對象，我們第一件事就是去區分哪裡是背景哪裡是主角。這對關系決定了這一對象中其他元素的角色內容。主角與背景必須要有顯而易見的對比，否則我們將很難區分它們。

　　焦點

　　焦點是指那些最具吸引和趣味的元素。設計它們時就需要讓它們從周圍環境中凸顯出來。這一對比也讓他們脫穎而出從而獲得注意。在一個對象中最突出的就是這個對象的首要元素，而在此對象中，那些次要突出的就是焦點。

　　等同

　　我們人類的另一個生存機制，除了讓我們察覺不同，也讓我們注意到相同。這讓我們能辨認出哪些是我們應該相信的，從而區別於潛在的危險。對等同有著較強的覺知力，這就是為什麼人類能很快認出各種模式。模式幫助我們理解周圍的世界，提供信息並且快速掌握規律，當形成習慣就能變作我們的直覺和本能。

　　當我們設計兩個或多個同類元素時，我們就在暗示，如果其中一個為真，另外那幾個等同的元素也為真。如果一個元素重要，其他幾個也同樣重要。如果其中一個元素可點擊，那麼其他幾個視覺上類似的元素也可點擊。這就是我們這樣在大段文字當中識別出哪裡是鏈接。視覺對比使得鏈接文字和其他文字不同吸引你的注意，同時，其他有鏈接的文字的類似也提醒了你，如果其中一個鏈接可點擊，其他的也一樣可以。

　　同等能顯示出幾個元素間存在某種聯系。它能給你的設計帶來熟悉和一致感。

　　同等讓我們組織信息能力日臻完美。當我們環顧視覺環境，並要對其加以理解，我們自然而然會將所有事物進行分類，以此掌握更多的信息，用記憶的形式存儲起來。讓它變成我們的長期記憶，以備以後分析問題解決問題而使用。

　　將相同信息的地方設計得外觀上也相似，這將會幫助用戶處理和理解信息，而這也正是我們設計的目標。

　　元素中的基礎特性共同點越多，它們看上去就越等同，從而也就有更多用戶認為它們是相同的。它們看上去在某方面成為同類，即使它們只有其中唯一一個特性相同。

　　我們用等同去構建系統性和模式。任何兩個元素的等同都會暗示著它們也許是一個系統。如果再在這個系統裡增加一些同類元素，那麼就會演變成為一種模式，在視覺上它會形成圖案、紋理或者具有節奏感的視覺效果。

　　不是所有看上去相似的信號都是等同的。如下圖所示，你是通過形狀或是顏色來分類圖形?你看見的是一組圓形和一組方形圖形?或者，你看見的是紅色圖形和藍色圖形?

　　你也許首先注意到顏色，將元素劃分為紅色和藍色。這就說明，顏色所傳遞的等同的信號比形狀更強。這也不是完全絕對的，舉個例子，一些紅綠色盲的人就不會注意到顏色的區別，他們首先注意到的是圖形的形狀。

　　等同和格式塔

　　我們又一次提到格式塔定律，每個格式塔都是關於我們如何察覺到物體間的等同和對比。下面是一些被認為顯示出等同的要點。

　　封閉

　　在一個整體中不同的元素都是這個整體的一部分

　　對稱和順序

　　對稱的元素兩相互屬

　　統一性的聯結

　　視覺上有聯系的元素間的等同

　　共同區域

　　在一個相同的區域裡元素的等同

　　鄰近

　　在一個相同的區域裡相續元素的等同

　　連續

　　在空間中以某種節奏或頻率出現的元素等同

　　共同命運

　　在運動中的一致

　　平行

　　在方向上的一致

　　等同和對比之間的關系

　　等同和對比用以表達元素間的關系。一個獨立的元素沒有意義。一個元素總是與處於同一環境下的其他元素發生著聯系。

　　一個大圓的一角有一個小圓，這樣的設計暗示著什麼?一段銀灰色文字比其他文字縮進更多這又試圖說明什麼?

　　可以這樣說，等同和對比就好像是一個天平，一端是完全不同，一端是完全相同。大多數情況都是介於兩者之間的，我們設計出的發生關系的元素特性也是部分而已，並非全部。等同和對比就是表達發生在這個天平兩極之間的關系。

　　即便我沒有說得很清楚，你都可以知道等同和對比是彼此互補的。它們彼此相依而存在，對比是等同所缺少的，而等同也是對比所缺少的。其互補程度全憑其在天平上的位置。

　　當你將這兩者結合在一起來思考就會