網頁設計基礎:版面佈局的平衡性原理

本教程主要就網頁設計中頁面佈局的平衡性方面作了介紹,從而為,Web Design師朋友在設計靈感的實現、風格的確定、發展策略等方面提供一點建議,希望能對大家有用。
網頁版面與報紙版面設計
網站設計就像傳統的報刊雜誌一樣,我們通常都是把網頁看作一張報紙,或者一本雜誌來進行排版佈局。但是印刷和網絡是不一樣的。
傳統的佈局排版並不適於網絡,因為傳統的印刷佈局,幾乎想要什麼樣的平面效果都能很好的達到,但在網絡上設計就很困難,儘管很多的效果都能通過一些Javascript或是高級的CSS技巧來實現,但結果是使用你的源代碼很臃腫,網頁載入很慢。
而同樣的,網絡上的很多排版佈局也不同傳統的印刷打印,畢競這是兩個相隔時間很長的事物。但是,在最近的幾年中,我們發現越來越多的報紙開始使用網頁設計佈局排版,比如大量的頁面留白和基於網絡的設計。同時,我們也可以借鑒傳統報紙的排版佈局來獲取新鮮的網頁創意設計靈感。

el economista (madrid, spain)經濟學家報 馬德里,西班牙
el economista 使用一個很傳統,含蓄,獨特的報紙版面和公告,在印刷上面突出比較重要的文章。 圖片信息支持的內容和標題,四周都是大量的空白,我們可以看到這個版面設計很有網頁的風格。
下面我們通過幾個簡單的例子,從網頁寄存四個方面來看版面佈局的平衡性,分別是留白、顏色、文字和節奏

留白

這是某房產廣告設計,可以看到很好的運用了留白
顏色

色彩的平衡性
文字

文字排版的平衡
節奏
節奏表現手段從支配行為上可以概括為速度(快、慢),力量(輕、重),從排版上可歸納為集中與分散。節奏表現手段的運用所喚起的直接效果可以大致概括 為緊張、鬆弛、寧靜、躁動。
如果在繪畫實踐中對一根線條或是一筆顏色在速度上的使用造成快慢差異,其畫面結果可以直接導致視覺及心理上的緊張與鬆弛感。同 理,在網站設計中,針對點、線、面等元素,以集中或分散的排列差異變化將導致視覺及心理上的寧靜與躁動。