這篇文章整理了 20 個個人網站與作品集網站，橫跨互動設計師、攝影師、作家、講師與文案工作者五種身分。
我們在意的重點是版面之外的東西：網站能不能讓人在幾秒內知道你是誰、作品排列的方式看不看得下去、動畫加到什麼程度會拖慢載入速度。
個人網站和企業官網的目標不一樣。
官網通常要先把服務、產品和公司資訊交代清楚；
個人網站要在很短的時間內回答三件事：你是誰、你擅長什麼、為什麼值得繼續往下看。
設計師、攝影師、作家、顧問和自由工作者的網站，也常常比一般公司官網更依賴個人風格、作品呈現和互動方式來吸引人，這也是網頁設計上最考驗判斷力的地方。
20 個個人網站設計案例，哪些地方值得參考？
每個案例除了看畫面，我們也整理了設計亮點跟益盛觀察，方便你判斷這種網頁設計手法適不適合放進自己的網站。
1. Bruno Simon｜3D 互動式作品集網站
Bruno Simon 是 Creative Developer、自由接案開發者，作品集把整個網站做成 3D 場景，用滑鼠、方向鍵或遊戲手把操控一台小車在場景中移動，
觸碰不同物件會切換到「關於」「作品」等頁面，行動裝置則改成觸控搖桿操作。
設計亮點：
作品集本身就是一個作品，訪客還沒看到履歷就已經體驗過作者在 3D、互動與網頁技術上的能力。
益盛觀察：
這種做法很適合互動設計師、Creative Developer 或遊戲相關工作者用來證明技術實力，但不代表所有個人網站都該照做。
如果網站的主要目的是接案詢問或預約，導覽方式太特殊反而會拉長使用者理解網站的時間。
一般商業網站可以學它「第一眼就呈現核心能力」的邏輯，不用整套搬 3D 操作過來。
2. Jasmine Star｜大字訊息與人物影像建立品牌氣氛
Jasmine Star 從攝影師發展成講者、Podcast 主持人與商業顧問，目前網站主要圍繞品牌經營、行銷與商業成長，
以大字訊息、人物影像與強烈的品牌排版建立個人品牌氣氛，並整合合作、推薦與商業內容。
設計亮點：
2025 年底重新做過一次品牌視覺更新，大字主張搭配人物影像，讓網站在幾秒內就傳達出她的定位轉變。
益盛觀察：
個人品牌網站最怕的是網站定位跟本人現況脫節。
這個案例示範了怎麼透過大字訊息跟人物影像重新定位，把過去的攝影師身分自然帶到現在的商業顧問角色。
如果你的服務內容或身分有明顯轉型，首頁的第一句話最好先講清楚現在在做什麼，不要停留在舊的介紹。
3. Robin Sharma｜明確定位加上品牌背書
Robin Sharma 是領導力講師與作家，首頁用「LEAD YOUR FIELD」「OWN YOUR GENIUS」「IMPACT THE WORLD」等明確主張定位自己，
搭配 Fortune 100 等信任背書、FedEx、Microsoft、Nike、Starbucks 等合作品牌標誌，並整合書籍、Podcast 與第三方推薦內容。
設計亮點：
用明確的定位主張搭配品牌背書與第三方推薦，快速建立專業與可信度。
益盛觀察：
這種排法很適合顧問、講師這類需要證明合作實績的角色。
如果你的產業也需要建立信任感，可以參考把定位主張、合作品牌跟第三方推薦放在首頁而不是藏在內頁，但品牌標誌牆要選真正合作過、可查證的對象，避免誇大。
4. Brandon Johnson｜學術網站也能有互動層次
Brandon Johnson 是普渡大學地球、大氣與行星科學系副教授，個人網站用視差效果與垂直點狀導覽，配色跟研究主題的科學感相符，但整體呈現並不死板。
設計亮點：
學術網站少見地加入視差效果，讓內容更有層次，又沒有偏離專業形象。
益盛觀察：
學術或研究型個人網站常常只放履歷跟論文清單，這個案例證明加一點互動效果也不會影響專業度。
企業網站如果服務對象偏理性、需要建立權威感，可以參考它用動畫襯托內容、而不是取代內容的做法。
5. Haruki Murakami｜用最少選項直接進入作品
Haruki Murakami 目前網站把書籍放在最前面，以大幅封面與直接購買入口為核心，資訊量很少，讓讀者第一眼就進入作品。
設計亮點：
大幅書封搭配直接購買按鈕，把瀏覽路徑縮到最短。
益盛觀察：
內容型個人品牌不一定需要複雜首頁，當使用者目的很明確時，減少選項反而能縮短操作路徑。
如果你的網站主要目的是導購或導向單一行動，值得參考這種只留書封跟購買按鈕的極簡做法。
喜歡某個網站，不代表整套搬過來就適合你
個人作品集、企業官網、品牌網站的目的不一樣。
動畫多的網站可能很吸睛，但如果你的主要目標是取得詢問、介紹服務，網頁設計還要一併考慮資訊架構、手機版跟載入速度。
6. Gala Darling｜文字語氣與視覺風格一致
Gala Darling 的網站以鮮豔色彩與勵志文字為主，搭配部落格分享個人觀點與生活風格內容，目標讀者是女性族群。
設計亮點：
色彩與文字語氣一致，整個網站看起來像同一個人在說話，而不是拼湊出來的品牌。
益盛觀察：
個人品牌網站最容易出現的問題是文字語氣跟視覺風格不一致，這個案例算是示範得不錯。
如果你的網站有清楚的目標受眾，配色跟用字可以大膽一點，不用追求中規中矩。
7. Scott Boms｜極簡版面適合已有知名度的人
Scott Boms 是跨領域設計師、藝術家與作者，個人網站採用極簡方式整理設計與創作內容。
設計亮點：
版面留白多，項目清單一目了然，不會被多餘的裝飾分散注意力。
益盛觀察：
這種極簡做法適合已經有一定知名度、不需要靠網站證明自己的人。
如果你才剛開始累積作品或案例，極簡版面反而會讓內容看起來太少，建議先充實作品說明，再考慮精簡設計。
8. Gary Vaynerchuk｜大字體快速傳遞訊息
Gary Vaynerchuk 的個人品牌網站採用簡潔版面搭配大膽字體，色彩鮮豔，並整合多種媒體內容。
設計亮點：
版面配置清楚劃分重點訊息，搭配大字體凸顯重要的行動呼籲。
益盛觀察：
這種高對比、大字體的做法很適合需要快速傳遞訊息、帶動點擊的個人品牌，例如講師、KOL、業務型顧問。
一般服務型企業如果照搬，訊息量不能太多，否則版面會顯得吵雜。
9. The Craftaholic Witch｜內容分類與社群入口
The Craftaholic Witch 目前定位是手作教學社群，首頁主打 273 個原創教學，並依 Jewelry Making、Paper Crafts、Origami、Home Decor 等分類整理內容，另外提供會員社群入口。
設計亮點：
用清楚的教學分類加上會員社群入口，把大量內容量體跟社群功能同時攤開，不會讓訪客迷路。
益盛觀察：
內容量大的網站，分類清楚比視覺風格更重要。
如果你的網站也累積了上百篇教學或作品，建議優先做好分類與搜尋動線，再考慮要不要加裝飾性的視覺風格。
社群入口放在明顯位置，也能把單次訪客轉換成長期會員。
10. ASHFAK｜復古配色最考驗功力
ASHFAK 用復古色調與圖案營造懷舊氛圍，版面簡潔，搭配動畫增加首頁的生動感。
設計亮點：
懷舊色調搭配簡潔排版，新舊元素混搭卻不顯得雜亂。
益盛觀察：
復古風格很吃配色功力，顏色沒挑好容易顯得老氣而不是懷舊。
如果想走這個路線，建議先參考真正的年代色票，再套用到網站上，而不是憑印象調色。
看完這些網站案例，你的網站該學哪一種？
看案例的時候，我們不建議先問「我喜歡哪個版型」，而是先確認網站要完成什麼工作。
同樣是網頁設計，設計師、顧問跟企業品牌需要的版面邏輯完全不一樣。
設計師／攝影師
作品本身最重要，可以拉高圖片比例、簡化文字說明，把版面空間留給案例。
顧問／講師／專業工作者
先說明專業背景、服務內容、合作紀錄或媒體露出，再安排諮詢或預約入口。
企業品牌
不能只追求視覺效果，產品分類、SEO 架構、RWD、網站速度跟後續內容維護都要一起考慮。
11. David Carson Design
David Carson 是平面設計界公認的「反網格」代表人物，早期以 Ray Gun 音樂雜誌藝術指導、Beach Culture 與 Transworld Skateboarding 的版面設計聞名，2014 年獲頒 AIGA 金獎。
個人網站本身就是他設計語言的延伸：單頁面一路往右捲動，沒有制式選單，混雜大量媒體讚譽、案例照片、影片與合作品牌清單，
Nike、Pepsi、Armani、Microsoft、Prince、Macallan 威士忌都看得到。
設計亮點：
整個網站刻意不做傳統導覽與分類，版面密度極高，文字、圖片、引言堆疊在一起，
直接把「打破網格」這套設計哲學套用在自己的網站上，而不只是套用在客戶的作品裡。
益盛觀察：
Carson 已經用幾十年的作品證明自己值得這樣呈現，一般個人或企業網站如果沒有同等的知名度與作品量，
照搬這種零導覽、高密度的版面，只會讓訪客找不到重點就離開。
真的想學，建議只學它的精神，不要學它的形式，
先用清楚的版面讓人看懂你是誰，再用內容證明你夠特別，不要反過來做。
12. by Alice Lee
Alice Lee Alice Lee 是舊金山的插畫家、壁畫藝術家、陶藝創作者兼內容創作者，
首頁用一整片彩色縮圖牆呈現作品，每張縮圖都標明作品類型跟合作對象，例如 Chipotle、Google、National Geographic、NBA All-Star Weekend、Washington Post、Uniqlo、Adobe 等，
下方再依插畫、壁畫、陶藝、其他企劃分類整理，另外還有線上商店跟電子報訂閱的入口。
設計亮點：
每張縮圖同時呈現作品風格，也標出合作品牌，不用另外寫合作紀錄段落，整片作品牆本身就是社會證明。
益盛觀察：
這種做法很適合案子多、單案規模小的接案創作者，例如插畫家、壁畫師、手作品牌。
與其幫每個案子寫完整案例研究，不如把客戶名稱直接標在縮圖上，用數量本身建立可信度。
如果作品量還不夠多，這種滿版縮圖牆反而會顯得單薄，建議先累積到一定數量再走這個方向。
另外它把商店跟電子報訂閱放在網站尾端，把作品流量導向長期經營的訂閱名單，這個做法值得接案型工作者參考。
13. Mack & Pouya Photography｜留白讓作品說話
Mack & Pouya Photography 是攝影工作室網站，大幅圖片搭配簡潔排版，讓瀏覽者專注在作品本身。
設計亮點：
版面幾乎把空間都留給照片，文字說明降到最低。
益盛觀察：
攝影、影像類的作品集本來就該讓作品說話，文字越少越好。如果你的產業也是靠視覺說服客戶，例如室內設計、婚顧，這種留白邏輯值得直接參考。
14. Colin Moy｜把導覽選單變成可互動元素
Colin Moy 的首頁用動畫「O」字搭配芥末色背景吸引注意，「關於」「作品集」「聯繫」裡的「O」都可以點擊，展開額外資訊。
設計亮點：
把導覽選單做成可以互動的圖形元素，不只是文字連結。
益盛觀察：
這種巧思式互動可以讓網站被記住，但要留意如果元素不夠直覺，使用者可能根本不知道能點，建議搭配簡單的動態提示，例如滑鼠移過去時的微動畫。
15. Anna Sabatini｜手繪風格建立辨識度
Anna Sabatini 的網站結合手繪風格與數位設計，首頁是鉛筆線條自畫像，搭配手繪字母與互動文字，另外設有「日記」區塊分享個人觀察。
設計亮點：
打字機風格排版跟手繪元素混搭，呈現出屬於作者自己的視覺語言。
益盛觀察：
個人網站最難做到的就是一眼認出是誰的網站，這個案例靠手繪風格建立了辨識度。
如果你的服務很依賴個人風格，例如插畫家、文字工作者，花時間建立專屬的視覺語言，會比套用現成模板更有記憶點。
16. björk
Björk 的官方網站走高度精簡路線，首頁幾乎不放內容本身，只有 M/M（Paris）操刀的專屬字體與動態片頭、目前主打作品的宣傳橫幅，以及幾個分流入口：
巡演照片、最新專輯 Fossora 的獨立網站、粉絲論壇 4um、周邊商店與電子報訂閱，社群連結放在最上方。
整個網站沒有傳統的「關於」或「作品集」頁面，而是把不同性質的內容拆到各自獨立的子網站上。
設計亮點：
用客製字體跟動態片頭建立高辨識度的品牌識別，首頁本身幾乎不放內容，
直接把流量導向對應的子網站或商店，運作方式比較像入口網站，不是傳統的個人網站。
益盛觀察：這種「入口導流」模式只適合本人知名度已經很高、同時有好幾個活躍計畫在跑（音樂、巡演、論壇、周邊）的狀況，
訪客不需要網站解釋你是誰，直接告訴他們現在有什麼新東西就夠了。
17. Es Devlin
Es Devlin 是 1971 年生於倫敦的英國藝術家與舞台設計師，
作品橫跨公共雕塑裝置（Tate Modern、特拉法加廣場、林肯中心）、劇場與歌劇舞台（皇家歌劇院、大都會歌劇院、國家劇院），
以及演唱會與大型典禮的舞台設計，
合作對象包括 Beyoncé、Adele、Kanye West、U2、The Weeknd、Lady Gaga、Louis Vuitton，也做過倫敦奧運閉幕式與超級盃中場秀。
網站首頁不寫自我介紹，直接把幾十年來上百件作品全部列出來，
並提供「List」「Spectrum」「Timeline」三種瀏覽方式，加上搜尋功能；
個人背景、榮譽與聯絡方式則收在另一個「Information」頁面
設計亮點：
不做精選，直接把完整作品清單攤開，用瀏覽方式的切換（清單、色彩光譜、年份軸）取代傳統的分類篩選，讓訪客自己決定要怎麼看這批作品。
益盛觀察：
這種做法建立在龐大作品量跟既有知名度上，網站本身更像一座作品檔案庫，不是一份行銷用的作品集。
真正值得借鏡的是它提供多種瀏覽路徑（依清單、依類型、依時間）這個做法，
如果你的網站內容量大、訪客需求又不一樣，與其硬塞成一種版面，不如像這裡一樣給幾種切換方式，讓不同目的的訪客各自找到想看的內容。
18. Kimsooja
Kimsooja 本名 Kim Soo-ja）1957 年生於韓國大邱，目前在首爾生活與創作，是國際知名的視覺與裝置藝術家，
代表作品包括《Bottari》包袱布系列、《To Breathe》光影裝置系列、《A Needle Woman》錄像作品，作品曾在威尼斯雙年展韓國館、古根漢美術館、MMCA 韓國國立現代美術館等地展出。
網站首頁不放任何文字，直接用兩排大幅裝置攝影組成滿版拼貼牆，導覽只有「Exhibitions」「Works」「Texts」「Biography」「Bibliography」「Contact」幾個入口
，個人背景、學經歷、展覽紀錄跟收藏機構清單都收在 Biography 頁面裡，用年表方式完整列出。
設計亮點：
這種「零文字首頁」只有在作品本身視覺張力夠強、而且訪客多半已經知道你是誰的狀況下才成立，
藝術家、攝影師這類靠影像說話的角色比較適合。
它把「作品呈現」跟「背景資訊」徹底分開的做法——首頁專心做第一印象，完整的學經歷、獎項、收藏紀錄放到另一個頁面用清楚的年表呈現，
而不是全部擠在同一頁。
19. Brett Land｜文案語氣就是最好的作品證明
Brett Land 是文案寫手、設計師與創意總監 Brett Shea 的作品集，
文字風格自信又帶點古怪，例如「現在進入 Brett Land」，作品目錄收錄替 Lyft、Airbnb 等公司做過的專案。
設計亮點：
文案語氣貫穿整個網站，連幽默的「Stupidfest」頁面都在強化個人特色，不是單純的娛樂內容。
益盛觀察：
文案工作者的網站，文字語氣本身就是最好的作品證明。
這個案例示範了怎麼把個性放進商業網站又不失去專業感，重點在於幽默的地方跟正式作品集分開陳列，不會互相干擾。
20. Adam Ho｜高資訊量是實驗，不是範本
Adam Ho 的作品集採用高密度、資訊量大的版面，首頁提示訪客每次重新整理看到的內容組合都不一樣。
設計亮點：
刻意打破簡約設計的常規，用資訊量本身製造記憶點。
益盛觀察：
這種做法通常不建議一般企業官網照搬，因為資訊量一大，使用者反而找不到重點，也不利於手機版體驗。
它比較像是設計師拿來證明創意實力的實驗作品，不是拿來做商業轉換的網站。
找到喜歡的網站之後，開始找網站公司前要確認什麼？
看到喜歡的網站只是第一步。
真的準備建站的時候，還要確認後台權限、網站所有權、保固範圍、維護方式，以及 SEO 基礎設定有沒有做，還有日後能不能自己新增內容。
延伸閱讀：網頁設計公司怎麼選？5 個問題檢查 SEO、AI 搜尋與電商架構
網站可以有設計感，但最後還是要完成商業目的
如果你正在規劃個人品牌網站、企業官網或舊網站改版，益盛科技可以一起評估網站架構、RWD、內容層級、SEO 與後續維護。
不用先整理成完整規格，有現有網站、參考網站或初步想法就可以討論。
