12個網站版面設計靈感來源、作品案例 寫網頁更易上手

愈來愈多人希望擁有一個屬於自己的網站，或是工作上有網站製作的需求，但有時候卻靈感枯竭，感覺無從入手。這時候，全球各地的版面設計網站就能夠成為你的靈感來源！小編在此提供12個全球網頁設計師都常用的免費網頁設計資源給大家參考，寫網頁更易上手。

版面設計網站 (1) - awwwards – 版面設計得獎網站作品案例

awwwards是一個網頁設計得獎作品的線上展示平台。平台裡每個得獎作品網站都有四個評分項目，分為整體設計、易用性、創意度、內容，是由眾多設計師進行評選，實用性十分高。

Link : https://www.awwwards.com/

圖／graphic design tools

版面設計網站 (2) - Behance - 探索各種網頁設計作品範例

Behance是一款Adobe旗下用於展示並發現創意作品的在線平台，因此與 Adobe CC 系列可以互做非常方便的連結與上傳。

網站使用時，可以直接依關鍵字搜尋你要的設計作品，而且有中文版面。其中內容也分得很細、也比較廣，從 App、網頁設計、插畫等都有。使用上也沒有任何限制，任何人都能註冊、發布作品。

Link : https://www.behance.net/

圖／google play

版面設計網站 (3) –templated - 發掘各種網頁設計版型作品範例

templated裡有不少網頁版型，同時也提供原始檔供大家下載，而且可以商業使用但需註明版型出處，沒有靈感或想更方便時，可以下載作為自己的參考素材。操作使用上也簡易，找到喜歡的版型後點選縮圖，就會開啟完整的網頁預覽畫面，即可點選右上角的下載按鈕。

Link : https://templated.co/

圖／夏木樂

版面設計網站 (4) - RWDJP - 日本的RWD響應式網頁設計作品案例

RWD JP是一個以日本網站為主的網站，可以看到在三種不同視窗大小的響應式呈現，可以用關鍵字、分類、顏色等來搜尋你需要的版型類型。

Link : http://responsive-jp.com/

圖／RWD JP

版面設計網站 (5) -W3 - 免費的RWD網頁設計版型作品案例

W3是一個免費的RWD自適應網頁版型下載平台，此網站裡面提供的版型數量很多，甚至針對版型進行分類，最重點的是，裡面的所有網頁版型都免費，更可作為商業使用，同時網頁不但很有質感也有設計感。

Link : https://w3layouts.com/

圖／twitter

版面設計網站 (6) -html5xcss3 - 符合HTML5和CSS3的網頁設計作品範例

將近500多種的作品主題，版面簡單操作，符合Html5和Css3響應，適合專業人士參考及使用。

Link : https://www.html5xcss3.com/

圖／hashnode

版面設計網站 (7) –UI – 中國一站式生態服務平台

UI中國除了是一個網頁設計版面參考網站外，更是一個知識分享互動社區和創意整合營銷平台。此網頁希望藉助互聯網的力量，打造國內用戶體驗設計師一站式生態服務平台，設計師人才數據庫，為設計師做最好的服務提高價值。如果想學習更多新奇有趣的知識，這個網站也不錯。

Link : https://www.ui.cn/

圖／hksilico

版面設計網站 (8) - Pinterest  - 各種網頁設計範例的靈感來源

Pinterest是一個以圖片分享平台，裡面也有許多網頁設計範例。用家可以利用其平台作為個人創意與專案所需的圖片，也可以用來收集各家網頁設計公司的作品。界面也很簡單方便，若看到喜歡的作品，可以釘選起來或是追蹤這個作者。

Link : https://www.pinterest.co.uk/

圖／Pinterest

版面設計網站 (9) –Dribbble 神級設計師聚集地

最有人氣的設計靈感網站，許多神級設計師會將自己的作品上傳這個網站分享給大家，是挖寶的好地方。

Link : https://dribbble.com/

圖／Dribbble

版面設計網站 (10) –OS Templates - 各種免費的網頁設計版型範例

這是一個免費的網頁的素材版型平台，裡面提供HTML的樣版外，還有PSD的網頁版型，同時這些PSD的版型圖層都未合併，方便用家修改與微調。

Link : https://www.os-templates.com/

圖／twitter

版面設計網站 (11) -設計游牧 Podcast交流

設計遊牧是華語最國際的 UX 設計 Podcast，我們分享各地關於 UX 設計的留學經歷、工作故事、設計新知，準備好與我們一起學習成長！

Link : https://designnomads.co/

圖／anchor

版面設計網站 (12) – lookup.design 實用性更高

相較於 dribble 或 pinterest 上許多分享太過華麗卻不實用。Lookup.design 是一個收集現實案例的網站，並且是以的UI元件為主，可以快速了解某家公司怎麼設計的，也可以對於產業慣例有比較好的掌握。

Link : http://lookup.design/

圖／夏木樂