設(shè)計指南是一個核心工具，可以極大地提高網(wǎng)頁設(shè)計團(tuán)隊的輸出效率并確保品牌的一致性。成功的設(shè)計規(guī)范不是一次性過程，需要注意許多問題。

對于網(wǎng)站甚至是品牌，設(shè)計指南不僅僅是規(guī)范文檔。優(yōu)秀的設(shè)計指南本身就像藝術(shù)品一樣令人愉悅，在實際設(shè)計工作中具有不可替代的重要功能。它展示了您的產(chǎn)品應(yīng)具有的風(fēng)格和形式，并以可管理，易于使用且易于理解的方式將整個設(shè)計系統(tǒng)整合在一起。在制作設(shè)計指南時，不得忽視以下六個要點。 1.品牌識別示例首先，您的設(shè)計指南應(yīng)包括一個可視化的品牌標(biāo)識展示案例，以便展示品牌標(biāo)識應(yīng)該是什么樣子。眾所周知的案例實際上是符合實際應(yīng)用場景的案例，這樣的實際案例也符合設(shè)計指南的真實意圖。這些設(shè)計案例，通常是品牌的網(wǎng)站主頁，移動頁面，APP截圖，這些案例展示了正確使用的品牌標(biāo)識，以及相應(yīng)的顯示風(fēng)格的其他元素。下圖是Love to Ride的品牌設(shè)計指南。他們的設(shè)計指南的每一頁都像網(wǎng)頁一樣設(shè)計，并且本質(zhì)上是一致的。設(shè)計指南甚至討論了一些常見的小元素，這些元素組合在一起來說明，例如應(yīng)該在不同的地方呈現(xiàn)哪些樣式的APP圖標(biāo)。在設(shè)計指南中使用真實示例的真正優(yōu)勢在于您不必創(chuàng)建其他場景和模擬，而是使用真實示例直接說明它們，對于團(tuán)隊的其他成員，它們也是有效的示威游行。 2，從配色方案到布局布局的完整設(shè)計描述，從使用圖形到具體控件的外觀，必須有詳細(xì)的描述。在整個設(shè)計中，應(yīng)該在風(fēng)格和功能方面遵循哪些規(guī)則，并且應(yīng)該解釋設(shè)計理念背后的內(nèi)容。這些完整的解釋有助于整個設(shè)計和開發(fā)團(tuán)隊在不同媒體上準(zhǔn)確一致地采用一致的設(shè)計風(fēng)格。 內(nèi)核上相同的元素和高度一致的設(shè)計允許用戶在查看網(wǎng)頁和平面廣告時感知品牌的獨(dú)特性和統(tǒng)一性，從而使不同位置的內(nèi)容顯示出明確的關(guān)系。例如，由于用戶的設(shè)備，在線網(wǎng)頁通常顯示不同的字體。設(shè)計人員將使用Google字體和Typekit調(diào)用盡可能接近品牌默認(rèn)字體的第三方字體，以實現(xiàn)相同的可能一致性。經(jīng)驗。因此，如果字體是您品牌戰(zhàn)略中不可替代的一部分，那么您應(yīng)該在整體設(shè)計規(guī)范中考慮這一點。對于需要注意的點，必須明確說明。例如，H1標(biāo)簽下的字體大小必須為88磅，縮略圖的大小始終為200×200像素，但不必限制所有非關(guān)鍵點。將設(shè)計的精神和風(fēng)格與這些關(guān)鍵點相結(jié)合，將使您的團(tuán)隊能夠在規(guī)定的范圍內(nèi)有效地進(jìn)行設(shè)計。如果定義了所有細(xì)節(jié)，那么整個規(guī)范就變成了一個字典，每個人都只能依靠對規(guī)范的不間斷訪問來完成設(shè)計。 3.樣式和色調(diào)設(shè)計指南中每個設(shè)計元素的描述性和標(biāo)準(zhǔn)樣式可能不是那么有趣，但足夠重要。風(fēng)格的描述也會影響視覺設(shè)計。這些描述的文字將影響設(shè)計師對風(fēng)格體驗和圖片類型選擇的控制，甚至對顏色和字體的控制也會受到影響。所有這些事物共同構(gòu)成了品牌的整體個性。更重要的是，它們決定了外部世界如何識別您的產(chǎn)品和品牌。強(qiáng)大的風(fēng)格和色調(diào)是視覺識別的核心之一。設(shè)計元素應(yīng)具有屬于品牌的獨(dú)特個性，以便用戶即使看不到文本也能清楚地確定他們屬于誰。看看可口可樂的紅色和迪斯尼字體，這是典型的。搜索引擎優(yōu)化關(guān)鍵詞在搜索引擎優(yōu)化中的重要性日益凸顯。在網(wǎng)頁設(shè)計中，關(guān)鍵字優(yōu)化可能是一個討論得多但很無聊的組件。 但是，您需要盡早考慮關(guān)鍵字優(yōu)化。您應(yīng)該以設(shè)計語言表達(dá)與品牌相關(guān)的關(guān)鍵字，并在設(shè)計指南中明確指出。 Urban Outfitters在其品牌設(shè)計指南中仔細(xì)列出了相關(guān)的關(guān)鍵字。雖然作為服裝品牌，列出了許多關(guān)鍵字，但核心關(guān)鍵字以不同顏色突出顯示，以便您可以立即知道哪些應(yīng)突出顯示。對于負(fù)責(zé)網(wǎng)站副本的營銷策劃人員和設(shè)計人員來說，這樣的關(guān)鍵字列表無疑是非常有用的。對于撰稿人而言，思考和回憶往往很容易被困住，而這種列表的存在并不會使這種情況發(fā)生。為了使內(nèi)容創(chuàng)建和關(guān)鍵字系統(tǒng)統(tǒng)一，網(wǎng)站在排名方面的優(yōu)勢將更加明顯，并且它將更接近目標(biāo)用戶。 5，對元素風(fēng)格的控制如今，互聯(lián)網(wǎng)上的各種圖案和設(shè)計材料相繼出現(xiàn)，濫用材料已成為一種非常常見的設(shè)計問題。因此，在規(guī)范設(shè)計中，應(yīng)該控制模式和相關(guān)元素的使用范圍。這包括使用LOGO和圖標(biāo)，顏色匹配的限制，表單和導(dǎo)航的控制，以及靜態(tài)和動態(tài)元素的控制。您可以在設(shè)計指南之外創(chuàng)建在線樣式指南，以便設(shè)計人員可以快速復(fù)制和粘貼這些元素。 6.代碼片段許多網(wǎng)站設(shè)計指南現(xiàn)在包含許多常見的代碼片段。從按鈕的小動畫到滑動效果，這些代碼片段與許多細(xì)節(jié)的體驗相互關(guān)聯(lián)。關(guān)鍵是它們降低了手動輸入代碼的成本并確保了代碼的重用率。對于網(wǎng)站文本和媒體內(nèi)容，相關(guān)的公共代碼片段是提高效率的關(guān)鍵之一。 Firefox在其新設(shè)計指南中包含了元素使用的通用代碼。 即使您從未提供完整的代碼段庫，也要嘗試包含一些基本的常用代碼，以便設(shè)計人員和相關(guān)開發(fā)人員能夠更加一致，高效地完成日常編輯工作。