網站建設中設計良好網頁的4項原則發布者：本站     時間：2022-04-04 19:04:26

我最喜歡的設計書籍之一就是《Robin Williams Design Workshop》.它深入實際的設計理論，并且包含許多極棒的設計實例。其中一個值得關注的地方就是4項主要的設計原則，它們已經在設計中為我所用。這4項原則就是：反差, 重復, 排列, 和分類。

本文將討論這4項與web設計相關的原則。只要在腦海中牢牢記住了這4項原則，你就一定可以設計出更加整潔漂亮的網頁。

1.反差效果

好的反差效果設計可以給用戶一個極好的第一印象。如果用戶的眼睛沒有焦點，注意力就會在處處是相同尺寸的元素和排版界面中迷失。設計師需要設計出很明顯的突出視覺元素來引導用戶的體驗。你可以通過選擇圖片、顏色和字體等來形成良好的反差效果。

圖片反差

當需要在很多小元素后面展示一個大尺寸的插圖時，這種方法很有效。嗯，我的意思就是，比如：

The Invoice Machine

設計良好網頁的4項原則

這個網頁利用一張大圖片來吸引用戶的注意。而同時網頁很自然的單色又讓很少的藍色應用有了更好的效果。

Instabox

設計良好網頁的4項原則

當你眼睛看到這個頁面的時候，首先你會注意到什么？最有可能的就是盒子上面的那個星星了。跟 The Invoice Machine 一樣，它們都是通過用一張大圖片和很少的顏色來制造一個視覺焦點。

顏色反差

恰到好處地使用少量顏色，是網頁中另一種制造視覺反差的有效方法。可以在網頁的頭部和文本拷貝中使用不同的顏色，也可以在一張圖片或插圖的顏色里面應用。

Fatburgr

設計良好網頁的4項原則

這個網站是極出色的一個所有設計原則的應用實例。關于顏色反差我們來看看它大大的黃色頭部和小小的淡灰文字。排列、圖片反差、重復和分類這幾個原則做得都很徹底。

I Love Typography

設計良好網頁的4項原則

一個用來展示排版的網站如果在它自己的頁首就為我們展示了一個極好的排版效果，那讓人覺得多驚奇啊！我喜歡他們所用的字體，也喜歡他們良好的青色和深灰色搭配。

字體反差

如果你想通過字體來產生反差效果，就應該避免使用2個很相像的字體外觀和大小。很相像的字體會造成混淆，并讓設計變得模糊。不過把字體大小弄得很不一樣就會非常有效果，或者是把字體最細和最粗的版本拼合到一起也同樣有效。同樣的，如果你將兩種外形差別明顯的兩種字體排在一塊，就會對它們帶來的視覺沖擊效果感到驚奇。把一個 san serif 字體和一個手寫字體放在一起就是一個例子。

Fixie Consulting

設計良好網頁的4項原則

哇噻，我真的非常喜歡這個網站上使用的排版和顏色。注意看他們標語的大小和筆畫。頁面上灑水效果和少量藍色的使用，都讓我非常欣賞。