網(wǎng)站設(shè)計模式：打破規(guī)則是OK

（非凡的一面注意：你已經(jīng)買了全新的非凡書＃3本書介紹了新的實用技術(shù)和整個漸進(jìn)式網(wǎng)頁設(shè)計的新思維。取得今天你的書?。?/div>

網(wǎng)站設(shè)計模式的歷史

建筑師克里斯托弗·亞歷山大在1977年，合著一本書名為模式語言：城鎮(zhèn)，建筑，建設(shè)“一個良好的專業(yè)領(lǐng)域內(nèi)的設(shè)計手法描述的結(jié)構(gòu)化的方法”，這本書的目的是模式語言的概念引入給普通的人-不只是建筑師和政府-為改善自己的城鎮(zhèn)和社區(qū)的藍(lán)圖。在亞歷山大自己的話說：

為核心的是，人們應(yīng)該為自己設(shè)計自己的房子，街道和社區(qū)的想法。這個想法......僅僅從觀察世界最美麗的地方不是建筑師，而是由人民。

一種模式-無論是在架構(gòu)，網(wǎng)頁設(shè)計或另一個領(lǐng)域-總是有兩部分組成：第一，它描述了一個共同的問題，其次，它提供了一個標(biāo)準(zhǔn)的解決這個問題。例如，模式88模式語言與身份問題和公共場所如何處理，可以推出鼓勵在公共場合混合。建議的解決方案之一是街頭的網(wǎng)吧：

街上的咖啡館提供了一個獨特的環(huán)境，特殊的城市：一個地方，人們可以坐在懶洋洋的，合法的，是對視圖，并觀看世界去了。因此，鼓勵當(dāng)?shù)鼐W(wǎng)吧春天在每個居委會。讓他們親密的地方，有幾個房間，開到一個繁忙的道路，人們可以坐在一起喝咖啡或飲料和觀看世界去了。建立這樣一組表伸出到街上的網(wǎng)吧，網(wǎng)吧前。最人性化的城市總是充滿街頭網(wǎng)吧。

對于那些有興趣進(jìn)一步下降的格局88兔子洞，甚至有一個Flickr組致力于這種模式的例子。

從建筑跳轉(zhuǎn)到Web是很自然的，因為情況是類似的：我們有許多共同的互動的問題，值得標(biāo)準(zhǔn)的解決方案。這樣的一個例子是雅虎的“導(dǎo)航標(biāo)簽“的格局。問題：

用戶需要通過網(wǎng)站導(dǎo)航定位的內(nèi)容和功能，并有明確指示他們在該網(wǎng)站的當(dāng)前位置。

和解決方案：

呈現(xiàn)出持續(xù)單行排在單杠下面的網(wǎng)站品牌和頭的標(biāo)簽，是一種提供一個高水平的網(wǎng)站導(dǎo)航，當(dāng)類別數(shù)是不太可能經(jīng)常改變。元素應(yīng)該橫跨整個寬度的頁面使用明確強(qiáng)調(diào)當(dāng)前選定的選項卡上的限制，以及短期和可預(yù)見的標(biāo)題，以保持文件夾的比喻。

這是非常好的，但我們需要深入理解數(shù)字化產(chǎn)品設(shè)計中使用這種模式的好處。

網(wǎng)站設(shè)計模式的好處

模式是特別有用的設(shè)計主要有兩個原因：

• 模式節(jié)省時間，因為我們沒有解決問題，這已經(jīng)得到解決。如果使用得當(dāng)，我們可以適用于每一種模式背后的原則，以解決其他常見的設(shè)計問題。
• 模式，使網(wǎng)站更容易使用，因為作為設(shè)計師之間通過增加，用戶習(xí)慣是如何工作的，這反過來又降低了他們的認(rèn)知負(fù)荷，當(dāng)遇到共同的設(shè)計元素。把它在學(xué)術(shù)方面，當(dāng)模式達(dá)到高的采用率，他們成為心智模式-套系統(tǒng)應(yīng)該如何工作，在用戶心中的信念。

也許最強(qiáng)的情況下使用現(xiàn)有的設(shè)計模式，而不是新的架構(gòu)（再次）。的文章“價值Unoriginality，，“德米特里·法捷耶夫援引歐文·瓊斯，19世紀(jì)有影響力的建筑師和設(shè)計理論家，他的書飾品語法：

嘗試建立藝術(shù)理論，或形成一種風(fēng)格，獨立的過去，將是一個至高無上的愚蠢行為。這將是一次拒絕的經(jīng)驗，千百年來積累的知識。相反，我們應(yīng)該把我們繼承過去所有成功的勞動力，而不是盲目地跟隨他們，但雇用他們只是作為指導(dǎo)，以找到真正的路徑。

最后一句是關(guān)鍵。模式是不盲目照搬別人做借口，但他們提供的設(shè)計藍(lán)圖，可以是非常有用的設(shè)計者和用戶。所以我們需要站在肩膀上已經(jīng)擺在我們面前的設(shè)計師-良好的網(wǎng)絡(luò)和用戶的理智。許多人試圖記錄最常見的Web設(shè)計模式，與不同程度的成功。除了雅虎設(shè)計模式庫，還有彼得Morville的設(shè)計模式，Welie.com，和我個人的最愛，UI-Patterns.com的。

當(dāng)模式攻擊

這里的“，但”我們已經(jīng)討論到現(xiàn)在的一切。有一個黑暗的一面的模式，我們不談?wù)撟銐颉Ｒ粋€并不簡單的復(fù)制模式庫從一堆隨機(jī)的地方，把它放在一個內(nèi)部的Wiki，然后等待神奇的發(fā)生。內(nèi)部設(shè)計模式庫的整合與維護(hù)，是艱苦的工作，如果我們不采取這種認(rèn)真的工作，不好的事情會發(fā)生。斯蒂芬Turbek在他的文章中總結(jié)出的主要問題與模式庫“反模式是設(shè)計模式？“

• 設(shè)計模式是有效的培訓(xùn)工具。
• 設(shè)計模式不會取代UX的專業(yè)知識。
• 完整性和學(xué)習(xí)能力有沖突。
• 設(shè)計模式，采取了大量的投資。
• 設(shè)計模式應(yīng)該首先幫助非-UX的人。

本文不打算詳細(xì)討論這些問題，所以我強(qiáng)烈建議閱讀Turbek的職位。

對這篇文章的目的，讓我們假定我們所做的一切權(quán)利。我們有一個出版，知名的，我們的組織內(nèi)享有廣泛采用的模式庫。我們把圖書館作為指導(dǎo)方針和藍(lán)圖，而不是沒有想著手頭的問題，要遵循的法律。我特別感興趣的問題是，當(dāng)它確定以打破廣泛采用的設(shè)計模式，引導(dǎo)用戶采取新的方式解決問題的呢？

當(dāng)我們的攻擊模式

盡管所有的利益，大多數(shù)網(wǎng)站似乎有一點尊重的模式。破碎的設(shè)計模式最明顯的例子，被發(fā)現(xiàn)在Web表單。根據(jù)多年的研究，我們知道如何設(shè)計可用的形式。從盧克Wroblewski的書Web窗體設(shè)計無數(shù)這樣的事情多列布局和定位標(biāo)簽的文章中，我們沒有任何猜測。模式在那里，他們確立。然而，我們看到網(wǎng)上這么多的勉強(qiáng)可用的形式。

作為一個破碎的形式模式的一個例子，看看登記表Expotel低于：

注意小的輸入字段;公里的空間和它們之間的輸入字段的標(biāo)簽左對齊，“關(guān)閉”和“注冊”按鈕，這實際上強(qiáng)調(diào)“關(guān)閉”更多的布局和設(shè)計。哦，什么是“歡迎辭”？它會在哪里使用？我們都同意，這是不是好的形式設(shè)計，是不是一個好辦法，打破格局。

但通過判斷一個破碎的模式并不總是那么容易，因為它上面的例子。谷歌最近決定取消的“+”按鈕，在瀏覽器中打開一個新標(biāo)簽，最近受到了火位。它打破了一個已在大多數(shù)的瀏覽器有作為一個功能選項卡為基礎(chǔ)的瀏覽，但谷歌稱，它沒有包括的模式，然后才作出這一變化的用戶研究。這個決定是正確的嗎？

再有，我們可能不知道如何使用戶界面。如清除和路徑IOS應(yīng)用介紹，我們以前沒有見過的新的互動-以及備受贊譽(yù)的負(fù)反饋。一步一個在設(shè)計或失敗的實驗？

與大多數(shù)的設(shè)計決策，答案是很少明確或黑色和白色。張力之間存在的模式和新的解決方案，不能用一個公式解決。用戶熟悉建立做事的方式，但一個新的解決問題的方法可能會更好，更自然和合乎邏輯的。所以，當(dāng)正在改變一些熟悉的東西不同確定？有兩個方案中，我們應(yīng)該考慮打破了設(shè)計模式。

新的方式實證提高了可用性

對現(xiàn)有的設(shè)計迭代的危險之一是被稱為“當(dāng)?shù)卮笳缂s書亞波特解釋。“

當(dāng)?shù)卮蟮氖窃谀愦虻南拗?，目前的設(shè)計，它是有效的，因為它永遠(yuǎn)要在其目前的化身。即使你100的調(diào)整，你只能得到這么多的改進(jìn)，它是有效的，因為它曾經(jīng)是其目前的結(jié)構(gòu)基礎(chǔ)上。

有圖案，它可能發(fā)生，我們將繼續(xù)改善現(xiàn)有的解決方案，即使存在一個更好的。這是A / B測試的陷阱之一：它找到了當(dāng)?shù)卮蟮囊粋€偉大的工作，但不尋找那些新的和創(chuàng)新的解決方案。

我們獲得了很多從漸進(jìn)式創(chuàng)新，但有時是成熟激進(jìn)的創(chuàng)新模式。我們需要去睜大眼睛，急于尋找新的解決方案，并準(zhǔn)備到每一個設(shè)計問題的解決方案進(jìn)行測試，以確保我們不壞直覺。作為保羅Scrivens指出“設(shè)計理念“：

你將永遠(yuǎn)是一個新的想法。你會先用一種新的方式呈現(xiàn)的想法或一種新的方式結(jié)合起來的想法與另一個。思想是沒有什么比過去更多的mashup。一旦你能坦然接受，你的想象力開辟了一點，你開始到別處尋找靈感。

這是什么鉻團(tuán)隊聲稱，他們已經(jīng)用“+”按鈕，在Chrome。它認(rèn)為它已經(jīng)找到了更好的解決方案，它測試了。

既定的方式變得過時

認(rèn)為，在大多數(shù)應(yīng)用中的作用“保存”圖標(biāo)。當(dāng)是你最后一次看到一個軟盤驅(qū)動器？沒錯。有時我們腳下移動世界，我們必須調(diào)整。如果不這樣做，我們可以得到停留在危險的車轍，作為Twyla的撒普證明（援引由Yesenia佩雷斯-克魯斯）：

往往比不，我發(fā)現(xiàn)一轍，是堅持以久經(jīng)考驗的方法，不考慮如何你或世界已經(jīng)改變的后果。

出版業(yè)內(nèi)人士都知道這比大多數(shù)。斯圖爾特庫里有“辭意必須死“這樣說：

設(shè)計模式是非常有用的，但是當(dāng)我們在媒體的大轉(zhuǎn)變，他們有時可以保持進(jìn)步回來。如果我們看一下在數(shù)字出版物的發(fā)展，它是一個緩慢而穩(wěn)定的運動，從音響的數(shù)字設(shè)備上打印的頁面打印頁面（大部分）。它是穩(wěn)定的，線性的，而不是極富想象力的，它在打印工作“，所以它會在數(shù)字”似乎是心態(tài)。

這是如清除和路徑的應(yīng)用程序的開發(fā)人員正在做大膽的，正確的事情。他們意識到，我們在一個時期的開始，是快速創(chuàng)新，基于手勢的界面，他們希望在該前列。將失敗的一些想法和一些會成功，但重要的是，我們的設(shè)計模式應(yīng)對新的觸摸為基礎(chǔ)的世界，我們的一部分。

我們的設(shè)計模式有調(diào)整不僅在我們的互動隱喻的轉(zhuǎn)變，但在技術(shù)的使用在一般的重大轉(zhuǎn)變。塔米·埃里克森做一些研究，對她所說的“重新生成”（即后Y世代），并討論了一些她的調(diào)查結(jié)果在“移動技術(shù)如何塑造新一代“：

連接是重新生成的基本假設(shè)和日常生活的天然纖維織物。技術(shù)連接的是人們?nèi)绾螡M足，表達(dá)思想，確定身份，并相互理解。老一輩，大部分使用的技術(shù)，以提高生產(chǎn)力 - 做我們一直在做，更快，更方便，更便宜的東西。對于重新生成，是有線是一種生活方式。

應(yīng)用程序和服務(wù)的期望改變時，一切都總是和訪問。緩慢的轉(zhuǎn)變和流動，被認(rèn)為是過于復(fù)雜，我們變得越來越寬容。我們正在被迫重新考慮簽署形式和支付流在其中的時間和精力，已經(jīng)成為比以往任何時候都稀缺的環(huán)境。我們不必推倒重來，但我們需要找到更好的方法來保持它滾動。

明智的決定是正確的決定

設(shè)計模式帶來許多好處，以及一些弊端，需要注意的。但我們很愚蠢忽視這些有用的指引。有是沒有為什么我們需要到做的的的計算公式;而不是，我們需要到某些界限之內(nèi)操作，，以確保我們正在創(chuàng)造而不疏遠(yuǎn)用戶的偉大的設(shè)計解決方案的。下面是我們需要做的：

• 學(xué)習(xí)設(shè)計模式相關(guān)的應(yīng)用，我們正在努力。我們需要知道他們的心臟-我知道他們?yōu)槭裁创嬖?因此，我們可以使用他們松散的藍(lán)圖，為我們自己的工作。
• 接近每用一記足以打開新的項目，發(fā)現(xiàn)更好的辦法來解決經(jīng)常出現(xiàn)的問題。
• 熬夜至今對我們行業(yè)（以及相鄰的），使我們認(rèn)識外部世界的變化，需要我們重新考慮解決方案，目前工作很好，但可能會很快過時。

總之，我們既可以遵循，也完全忽略設(shè)計模式。相反，我們需要一個人機(jī)交互的規(guī)則的深刻理解，讓我們知道打破他們是確定的。