設(shè)計(jì)制作網(wǎng)站越來越復(fù)雜，通常不是一個(gè)人的工作。為確保設(shè)計(jì)的一致性，以滿足業(yè)務(wù)目標(biāo)和創(chuàng)造愉快的經(jīng)歷對(duì)用戶是重要的。

　　什么是風(fēng)格指南?

　　風(fēng)格指南是整理設(shè)計(jì)元素，圖形和規(guī)則設(shè)計(jì)者和開發(fā)者的集合，應(yīng)遵循以確保獨(dú)立網(wǎng)站的作品一致，并會(huì)創(chuàng)造出完美的視覺和用戶體驗(yàn)。

　　創(chuàng)建一個(gè)Web設(shè)計(jì)風(fēng)格指南

　　1、研究品牌

　　首先，你需要研究用戶的品牌，了解品牌背后的故事，并找出了公司的愿景，使命和價(jià)值觀。重要的是要深入挖掘風(fēng)格指南，你會(huì)產(chǎn)生視覺和情感代表品牌。

　　如果你是一個(gè)設(shè)計(jì)師，不會(huì)寫代碼，只需打開Photoshop，把你的文檔標(biāo)題和文檔，進(jìn)行描述。主要包括顏色，還有字體的大小。

　　如果你能代碼，這是更好地創(chuàng)建具有代碼的HTML文檔，能夠更方面的使用。

　　2、定義排版

　　排版是網(wǎng)頁設(shè)計(jì)的95%。你必須設(shè)計(jì)正確的版式，因?yàn)樗窃L客和您的網(wǎng)站之間最重要的溝通工具之一。

　　設(shè)置等級(jí)和標(biāo)識(shí)。有標(biāo)題的類型：H1，H2，H3，H4，H5和H6。然后正文，粗體和斜體變。想想將用于較小的環(huán)節(jié)，介紹文字等的自定義副本。提供字體系列，顏色。

　　3、調(diào)色板

　　人類如何感知與知名品牌的色彩，這是不可思議的。想想可口可樂，我敢打賭，你想到的肯定是紅色。

　　通過設(shè)置主色，將主宰你的網(wǎng)站整體色調(diào)，主色應(yīng)包括不超過三個(gè)輔助色。在某些情況下，您將需要二級(jí)，甚至三級(jí)的顏色，展示你的頁面。還包括中性的顏色，如白色，灰色和黑色為主要品牌顏色脫穎而出。

　　4、圖標(biāo)的運(yùn)用

　　圖標(biāo)已經(jīng)存在了幾千年，比文字的時(shí)間還長(zhǎng)。把圖標(biāo)充分利用在網(wǎng)頁設(shè)計(jì)中，圖標(biāo)更能直接的傳達(dá)信息，并知道接下來會(huì)發(fā)生什么。選擇正確的圖標(biāo)將給予更多的上下文內(nèi)容的提示。當(dāng)使用圖標(biāo)，一定要考慮目標(biāo)受眾，宗教，歷史。還有一件事更重要，想想這個(gè)品牌和它的價(jià)值。

　　5、圖像

　　確保圖像定義風(fēng)格和圖片的網(wǎng)站相統(tǒng)一。再次，想想這個(gè)品牌和它的使命的價(jià)值。(與官網(wǎng)產(chǎn)品相關(guān)聯(lián)的素材或圖片)

　　6、彈窗與提示

　　什么樣的彈窗才能讓網(wǎng)站與用戶產(chǎn)生互動(dòng)，以便用戶可以輸入數(shù)據(jù)，完成輸入和操作。

　　確保建立一個(gè)層次結(jié)構(gòu)，并包括可能的形式反饋-活躍，懸停，添加錯(cuò)誤，警告和成功的消息，包括的東西，如密碼過于軟弱，電子郵件是無效的或簡(jiǎn)單的成功消息如“郵件已發(fā)出。”

　　7、按鈕

　　按鈕是顏色的調(diào)色板，創(chuàng)建具有不同顏色，一致的設(shè)計(jì)外觀和功能按鈕。

　　9、間距

　　間距是非常重要的。它可以是用于布局的網(wǎng)格形式; 能使標(biāo)題，按鈕，圖像，表格和其他元件之間間距限定。正確的間距是非常重要的，因?yàn)樗峁┝烁嗟拇⒖臻g元素。