網(wǎng)站設(shè)計(jì)的風(fēng)格規(guī)范有哪些內(nèi)容？

每個(gè)網(wǎng)站都具有自己的風(fēng)格規(guī)范，這并不困難，但如果在整個(gè)項(xiàng)目中或讓每一個(gè)都使用同一種風(fēng)格規(guī)范，這就難能可貴了。我們討論一下，到底應(yīng)該如何做來(lái)確保人們遵循網(wǎng)站的規(guī)范，使網(wǎng)站在視覺(jué)上存保持一致性？??

一、品牌概述

如果你從來(lái)沒(méi)有從頭創(chuàng)建過(guò)一個(gè)設(shè)計(jì)模板會(huì)有點(diǎn)困難，對(duì)于初來(lái)乍道的來(lái)說(shuō)，可以在MailChimp中找到他們喜歡的風(fēng)格，MailChimp可以更根據(jù)你選擇的喜歡的并獲得通用安裝證書許可，然后以此作為一個(gè)模型開(kāi)始這個(gè)風(fēng)格規(guī)范的規(guī)劃。

大多數(shù)設(shè)計(jì)模板有兩個(gè)部分：1、文字標(biāo)準(zhǔn)；2、視覺(jué)標(biāo)準(zhǔn)。

這兩個(gè)標(biāo)準(zhǔn)，是同等重要的，都是整體風(fēng)格規(guī)范的一部分。把元素結(jié)合在一起將建立一個(gè)整體形象。每一個(gè)品牌或企業(yè)網(wǎng)站都有自己與眾不同的地方。選擇一個(gè)色調(diào)和風(fēng)格，同步運(yùn)用在字體和視覺(jué)畫面的效果上，把你的網(wǎng)站和用戶融為一體。

建立網(wǎng)站整理形象的時(shí)候，也正是品牌需求考慮到用戶和相關(guān)利益的人對(duì)此有何種期望的時(shí)候。是否被期待？是否有關(guān)聯(lián)，是否愿意在這樣的網(wǎng)站上進(jìn)行瀏覽使用等交互行為？

二、語(yǔ)言風(fēng)格

雖然我們將主要精力集中于網(wǎng)站風(fēng)格規(guī)范的視覺(jué)方面，但語(yǔ)言風(fēng)格是非常重要的，是整體網(wǎng)站的一部分，也是你與用戶“交談”的方式。語(yǔ)言風(fēng)格是正式還是輕松的？是冗長(zhǎng)或更簡(jiǎn)潔的？

用同樣的方式為網(wǎng)站格式寫你的風(fēng)格規(guī)范。這將有助于提示你的團(tuán)隊(duì)知道網(wǎng)站的初步設(shè)想，以及如何運(yùn)用語(yǔ)言風(fēng)格去協(xié)助于品牌標(biāo)識(shí)。

語(yǔ)言風(fēng)格是與每一位用戶溝通使用的。返回到MailChimp，我們通過(guò)他的品牌語(yǔ)言風(fēng)格的塑造上著重審視。注意到公司談?wù)摷八募槲?，舉個(gè)例子：“Freddie是我們的吉祥物。我們不需要使用他與我們的logo組合。Freddie的臉右側(cè)面的，他的表情一直是眨著眼睛的?！?/p>

了解更多匠人匠心產(chǎn)品：

天津網(wǎng)絡(luò)公司??網(wǎng)站建設(shè)??網(wǎng)絡(luò)推廣??定制型網(wǎng)站??響應(yīng)式網(wǎng)站??移動(dòng)端定制開(kāi)發(fā)??關(guān)于匠心??聯(lián)系我們

三、“準(zhǔn)則”及用途?

你的風(fēng)格規(guī)范應(yīng)該是你設(shè)計(jì)的“劇本”。（可能是比“規(guī)范”聽(tīng)起來(lái)更通俗易懂？）? ? ? ? ? ? ? ? 它應(yīng)該概括了如何以及何時(shí)使用的字體、顏色和所有其他設(shè)計(jì)元素類型，讓人更容易理解。包括：

1、調(diào)色板，包括標(biāo)準(zhǔn)色和可適用的色彩

2、排版，可適用的字體、字號(hào)、縮進(jìn)、行間距跳轉(zhuǎn)?

3、LOGO，包括尺寸和位置

4、圖標(biāo)或元素樣式（包括分享按鈕等）

5、拼寫，選項(xiàng)和格式風(fēng)格（應(yīng)該遵循哪種編輯格式？ APA格式？AP格式？或其他？）

6、照片格式，包括顏色、裁剪尺寸和視覺(jué)效果

7、SEO信息，如ALT標(biāo)簽和關(guān)鍵詞

8、電網(wǎng)標(biāo)準(zhǔn)（適用于網(wǎng)絡(luò)或打?。?/p>

9、間距方面的考慮（是否設(shè)計(jì)的太松或太緊）

10、反饋接觸信息（可以向團(tuán)隊(duì)成員提問(wèn)或建議的）

四、簡(jiǎn)單而具體的概念

這可能是困難的部分，你需要明白這些信息，并將其爛熟于心，理解成簡(jiǎn)單、具體、可操作性強(qiáng)的概念：?

1、當(dāng)涉及到風(fēng)格規(guī)范不能走端，只是一個(gè)視覺(jué)參考，而通過(guò)這種方式去設(shè)計(jì)。

2、組合相關(guān)內(nèi)容，并快速相關(guān)聯(lián)，比如頁(yè)面的顏色、已經(jīng)跳轉(zhuǎn)進(jìn)入另一頁(yè)的圖形和照片等。

3、為可以顯示的內(nèi)容舉一些相似的例子，不需要解釋的部分用占位符。

4、盡可能地提供細(xì)節(jié)，色彩樣式，例如，包括RGB（或HEX ）和CMYK值等，使顏色可以規(guī)范使用。

5、打破部分常用的元素案例去設(shè)計(jì)。

五、片段與實(shí)例

無(wú)論你的設(shè)計(jì)風(fēng)格規(guī)范是用于印刷還是數(shù)字使用或基于Web的文檔，應(yīng)該包含有用的工具。部分有用的元素品牌案例做得到也可能做不到，但他可以很容易把焦點(diǎn)放在你想看到的品牌視覺(jué)上。

然后，創(chuàng)建一個(gè)易操作的目錄。創(chuàng)建原型組（或一組常見(jiàn)的元素，這取決于你使用的軟件） 。保存在一個(gè)常用的位置，使其容易操作并且生成容易修改的文件。

為參與該項(xiàng)目的每個(gè)人提供基于云端軟件的工具列表。（這包括鏈接、用戶名等基本信息。）確保所有字體包、logo和圖像文件是在一個(gè)常用的位置，所有的使用者都知道他們?cè)谀睦铩?（在另一個(gè)地方保留備份，以防原文件、作品丟失。）

創(chuàng)建代碼片段，易于復(fù)制并粘貼到項(xiàng)目主列表。這樣不用每次重建，常見(jiàn)的元素需要被分享在一個(gè)每個(gè)人都可以訪問(wèn)的共享位置。

end一步是進(jìn)化優(yōu)化。每件事情都可能會(huì)變，而且必然要經(jīng)歷蛻變。

六、執(zhí)行風(fēng)格規(guī)范?

其中，很大的問(wèn)題是“如何讓人們遵循風(fēng)格規(guī)范呢？”按照以上這些列出的內(nèi)容，你已經(jīng)有一個(gè)很好的方式擁有了設(shè)計(jì)的輪廓，具有了簡(jiǎn)單、具體的概念。

風(fēng)格規(guī)范是很容易被追隨的，就像你寫的網(wǎng)站一樣。語(yǔ)言是簡(jiǎn)單的和不生僻的，可以讓人們?nèi)プ冯S這些準(zhǔn)則。

風(fēng)格規(guī)范應(yīng)該留下足夠的設(shè)計(jì)空間對(duì)于其靈活性和實(shí)際制作上。就像你的品牌，在一定范圍內(nèi)，可以幫助團(tuán)隊(duì)成員發(fā)揮他們?cè)O(shè)計(jì)的創(chuàng)造力，也同時(shí)創(chuàng)造新的東西。風(fēng)格規(guī)范的所有者也是如此，這是指批準(zhǔn)、更新和變化設(shè)計(jì)風(fēng)格規(guī)范的人，并能回答有關(guān)設(shè)計(jì)決策問(wèn)題的所有人。這個(gè)“所有者”可以是個(gè)人團(tuán)隊(duì)，或者更大組織的規(guī)模。

結(jié)論：

你是不是已經(jīng)有一個(gè)風(fēng)格規(guī)范，或者正在準(zhǔn)備一個(gè)新的網(wǎng)站？這是每年都會(huì)面對(duì)和處理的任務(wù)，這份指南將始終不會(huì)過(guò)時(shí)。去設(shè)計(jì)自己的網(wǎng)站風(fēng)格規(guī)范吧！

推薦閱讀

1、天津網(wǎng)站建設(shè)怎么選擇有實(shí)力的公司

2、像玩網(wǎng)游一樣做網(wǎng)站外鏈 每日必做外鏈攻略