自上世紀末開始，台灣互聯網高速發展的近三十年，對比90年代緩慢的網速、小屏幕超低清的分辨率(只有800x600像素)，如今的網絡技術可謂是突飛猛進。加上個人電腦普及以來，媒體和企業對用戶體驗、頁面動效、富媒體的重視，直接催生了WUI設計師這樣的職業。

時至今日，網站仍是我們獲取訊息的主要平台之一，電腦端網站體驗並不比手機軟件和APP差。擁有一些網站設計的規範和理解網站運行的原理，也許能啟發一些同學在未來做WUI設計師。今天就好好看一些設計案例，也聊一聊網頁設計必須懂得的那些事兒：優秀的網站長啥樣？一睹為快吧！

「Web Design」&「Website design」

網頁設計

網站設計是功能上的設計，網頁設計是功能基本開發之後對具體頁面的排版佈局。

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

簡約+撞色

視覺體驗滿分

Pogon是一家集創意、設計、品牌策劃、網絡行銷等服務於一身的事務所，包括創立品牌、建設網站、線上購物平台、社交網絡、移動應用程序。他們專注於針對客戶群體打造最佳用戶體驗化。

●

這樣的工作性質使得Pogon的創始人和技術人員在設計自己的線上主頁時駕輕就熟。輕鬆、簡潔的排版和視覺中，除了文本的白色和一些必要的案例配色，偏執大膽的幾乎全部選擇了藍色，輕微動態的邊欄使使用感極其流暢。

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

人物+動效

趣味體驗滿分

第二個網頁則是品牌Fluff的官方主頁。 Fluff是一家生產和銷售化妝品的公司。創始人Erika Geraerts認為現在的年輕人很依賴化妝品，如果不化妝就會覺得自己出門少了些什麼。

●

年輕的Fluff主頁使用了明亮熱情的黃色，這種飽和度很高的顏色很符合年輕用戶群體的審美。 Fluff的陽光自信感和前衛的Fluff美學透出屏幕，旨在傳達產品的功能不會遮蓋每個人自身的美，

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

留白+熒光色

反差體驗滿分

亞當·何（Adam Ho）是紐約布魯克林的獨立設計師，專注於品牌識別，藝術指導和互動設計等學科的交集。 Adam Ho Portfolio是他的個人作品網站。

●

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

字體+復古色

懷舊體驗滿分

這是聖彼得堡鋼琴節的宣傳和活動宣傳網站。視覺上的一個很重要的特徵就是文字外觀的粗體設計、顏色的選擇。紅、白、藍三色構成了網站的主色調，黑色作為背景的想法是來源於國旗，音樂家分別來自瑞士、法國和俄羅斯，這些顏色就是取自這些國家的的國旗。

●

設計師首先是把時間表放在第一頁，同時讓人們熟悉藝術家的背景訊息。這個網頁的設計避免將內容拆分為多個頁面，使用戶能夠進行平滑的過渡，無需額外的HTTP請求即可單擊藝術家的姓名，從而了解他們的訊息。

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

襯線體+高級灰

視覺體驗滿分

http://這是一家設計工作室，位於法國南部和巴黎，與當地還有國籍品牌合作，涉及文化、奢侈品、生活藝術等領域的設計、創意以及品牌的相關工作。

●

創始人Daisy曾與Chanel、Swatch Group、Fours Seasons等品牌合作在Realms of communication和Digital Strategy方面有近十年的歷史。她創立自己具有濃厚美學品味的品牌D.Potfer Studio，面對全新挑戰和有意義的合作並渴望獲得卓越的表現。

#

SUMMER

DRINK SOME WRITER

RUNNING AGAIN

文字+動效

視覺體驗滿分

http://與之合作的品牌包含ADOBE、AIGA、APPLE、 Nike、FACEBOOK等等。

●

與此同時，Angela Milosevic還是一位數字插畫師，它的網站與它的插畫作品風格和配色都很像，網站最有趣的就是一個故障風交互，當用戶拖動鼠標，圖片便會出現無數層。

#

SUMMER
DRINK SOME WRITER

RUNNING AGAIN

構圖+復古紅

視覺體驗滿分

科普向網站ussr.obys.agency/——蘇聯設計年鑑令人驚艷。從配色到構圖，濃濃上世紀社會主義陣營風味的視覺體驗，對比當今設計界異彩紛呈，網頁當中交互動畫的巧思，一瞬間讓蘇聯設計的遺產躍然紙上。

●

蘇聯設計是一個大國留下的無價遺產，它是至上主義、構成主義又是先鋒主義。雖然作為藝術遺產，但在現如今各種各樣但設計風格中，眾所周知以包豪斯著稱的德國設計、北歐的極簡風格以及同樣極簡但富有東方禪意的日本設計獨樹一幟。

今日總結

許多優秀的網頁設計作品，不僅僅有著突出的排版設計，而且在動效、交互、體驗上有著頗為值得學習的地方。如果你願意仔細揣摩，還會發現每個網頁都有自己的性格，許多細節的處理技巧和內容相結合的搭配策略。設計的靈感來源多種多樣，不僅僅要了解別人的視覺設計，而且需要仔細體驗實際的效果。想比起零散地設計作品，這些來自著名設計機構的網站，在不同需求下誕生的網站產品，更有價值。