- 相關推薦
網(wǎng)頁設計中多元素是如何做到統(tǒng)一
形式美法則是人類在創(chuàng)造美的形式和過程中對美的形式規(guī)律的總結(jié)概括，世間萬物的美都可以用形式美法則來概括。在平面構(gòu)成中也有形式美法則：統(tǒng)一和變化，對稱和平衡，節(jié)奏和韻律，對比和調(diào)和。前面跟大家有分享了對比、留白在網(wǎng)頁當中的運用，今天我們繼續(xù)來分享網(wǎng)頁當中那么多元素是如何做到統(tǒng)一一致的。就跟隨百分網(wǎng)小編一起去了解下吧，想了解更多相關信息請持續(xù)關注我們應屆畢業(yè)生考試網(wǎng)!
在視覺上的統(tǒng)一可以體現(xiàn)在：圖片，色彩;區(qū)塊;布局;字體，視覺元素。此外，還有一個交互上的統(tǒng)一。
1、圖片統(tǒng)一
圖片統(tǒng)一體現(xiàn)在圖片大小尺寸上的統(tǒng)一，顏色色系上的統(tǒng)一和圖片風格的統(tǒng)一。
不管是京東還是天貓?zhí)詫殻@些商城在網(wǎng)站上的圖片處理就用了這樣的統(tǒng)一原則。不一樣的場景下對圖片的要求也都不一樣。比如京東商城的首頁，每一個區(qū)塊起到一定的導航性作用，在這樣的場景下，需要的圖片都是比較簡潔而不是背景復雜的。下面我做了一個錯誤的示例給大家演示：
左圖是官方的網(wǎng)站的圖片，右圖是一個錯誤示范。顯而易見，左圖的展示性和可讀性都比較強，視覺效果也比較好。右圖之所以覺得不好看是因為圖片大小不一致，圖片的背景顏色也不一致，所以看起來特別不協(xié)調(diào)。
好了，現(xiàn)在應該有人會想問，那京東或是天貓?zhí)詫毻ㄟ^搜索后進去的頁面里面的產(chǎn)品配圖不是五顏六色的嗎，那怎么看起來也沒有覺得不協(xié)調(diào)。
這些界面的統(tǒng)一一致性體現(xiàn)在產(chǎn)品區(qū)塊的大小尺寸上和整體的樣式上，除了產(chǎn)品圖不一樣，其他的布局樣式、區(qū)塊大小都是一樣的，這恰恰跟首頁相反，首頁各個區(qū)塊大小不一致，所以采用圖片一致來協(xié)同，內(nèi)頁則是區(qū)塊樣式一致，圖片不一致。但不管哪一種協(xié)調(diào)方法，界面都起到了很好的協(xié)調(diào)性。
圖片風格上的統(tǒng)一主要體現(xiàn)在網(wǎng)頁當中的圖片選擇上，在寫實風格的網(wǎng)頁中就不適合卡通的圖片，在清爽的界面當中，就不適合勁酷的圖片。
2、色彩統(tǒng)一
色彩統(tǒng)一指的是網(wǎng)頁當中色彩色系運用的統(tǒng)一性，這樣的統(tǒng)一性可以體現(xiàn)在網(wǎng)頁中的整體色系，也可以體現(xiàn)在網(wǎng)頁當中所有區(qū)塊標題的顏色，甚至統(tǒng)一到整個網(wǎng)頁界面當中按鈕的顏色搭配。一般情況下如果不知道網(wǎng)頁定什么色系好，小編給的意見和建議就是跟著你們的logo顏色走。
Obrigado椰子水飲料網(wǎng)站的主色調(diào)就是用了綠色與白色相結(jié)合，穿插了一些橘黃色，起到活躍畫面的作用，綠色是標志的主色，橘黃色也是標志的一個輔助色，可以看到整個網(wǎng)站簡潔清爽，黃色和綠色并不是等比重出現(xiàn)在網(wǎng)頁當中，就跟標志一樣，黃色的占比少。可以訪問看看，里面一些交互運用也做得比較好。
【網(wǎng)頁設計中多元素是如何做到統(tǒng)一】相關文章：
網(wǎng)頁設計中應該如何配色09-06
如何使用網(wǎng)頁設計中的圖片敘事07-28
網(wǎng)頁設計中的字體設計07-26
如何進行網(wǎng)頁設計06-16
如何成為網(wǎng)頁設計專家06-30
Dreamweaver如何制作網(wǎng)頁設計07-02
php如何去除數(shù)組中相同的元素07-09
網(wǎng)頁設計中的文字運用07-09
網(wǎng)頁設計中字體規(guī)范06-07