網站設計系列｜2020年8個創新的網站設計趨勢 - 哈利熊

網路設計的趨勢不斷變化，到了2020年，技術的更迭似乎孕育著無限的可能性 ... 情況下，全螢幕、超真實性的3D設計是為網站創造沈浸式體驗的最佳作法。

哈利熊線上服務市集 > 哈利熊部落格>創意設計>網站設計系列>網站設計系列｜2020年8個創新的網站設計趨勢網站設計系列｜2020年8個創新的網站設計趨勢2020-08-032020-09-28網站設計系列,電子商務網路設計的趨勢不斷變化，到了2020年，技術的更迭似乎孕育著無限的可能性，我們看到設計師不斷在極限中發揮創意，重塑過往的風格，並不斷創新新的技術。

同時，有一些恆久性的風格並沒有消失，比如說，我們一直以來看到的極簡主義和色彩豐富的平面插圖，似乎依然在流行的巔峰。

2020年的設計趨勢究竟是什麼呢？99Design平台上的頂尖設計師們為大家整理了今年的新趨勢。

內容目錄 1.暗色風2.增加個性的不完美感3.沈浸式的3D元素4.柔和的陰影、塗層和浮動元素5.將攝影與圖形結合6.留白的應用7.發光的夜光色系8.極簡的導覽設計1.暗色風暗色風格的網站不僅僅看起來極為時尚，也非常耐看，適合將重要元素襯托出來。

有時候，很多風格的出現一開始其實都隱藏著非常實際的用途，像是暗色風格的出現，一開始其實是為了讓OLED的螢幕更省電，延長螢幕的壽命。

但後來，在實用性的基礎上，我們發現了暗色風在設計上的彈性。

99Design上的頂尖設計團隊DarkDesignStudio表示：「我相信2020年其中一個主要的趨勢是暗色調的設計風格，主要是在UI上提供用戶暗色系主題的切換選擇。

暗色的背景能夠讓設計的元素凸顯出來，與使用的其他顏色呈現強烈的對比，與此同時，還能夠以減少眼睛疲勞來感善人體工程學。

」已經陸續有許多品牌開始走暗色調的風格，比如說YouTube、Gmail、GoogleChrome等。

YouTube暗色風Gmail暗色風GoogleChrome暗色風有興趣的朋友可以參考這篇：超強的暗色風網站設計？!2.增加個性的不完美感不完美、手寫的元素能為網站注入靈魂以及人性化的溫暖，隨著網路世代的發達，越來越多品牌開始使用過於冰冷的技術、製作出完美的設計，卻缺乏了溫度，這樣的趨勢下，當網站融合了一些不完美、更為人性化的元素時，就更容易抓住客戶的心。

99Design設計師：ElisabettaCalabritto99Design的頂尖設計師ElisabettaCalabritto認為：「明年的一個大趨勢會是手畫的標誌，它們會帶來情緒，但是是正面的。

這個趨勢與我們渴望更多正面的東西有關，一些能夠讓我們每天振奮心情的元素。

」其實很多大品牌都開始使用這種作法，比如說MailChimp、BaseCamp、簡訊設計等。

MailChimp主頁BaseCamp網站簡訊設計網站3.沈浸式的3D元素3D的設計一直都令人振奮，之前因為科技尚未普及與昂貴的製作價格拉緩了這個趨勢，但是現在的技術讓設計師們可以不用NASA級的設備就能製作3D效果，也為設計師們開啟了3D設計的大門。

在VR技術還沒有廣泛以低價格應用的情況下，全螢幕、超真實性的3D設計是為網站創造沈浸式體驗的最佳作法。

那麼，使用3D設計不僅僅在視覺上是一種衝擊，互動式的3D設計還可以增加用戶停留在頁面上的時間。

99Design上的PinchStudio認為：「我期待在平面設計中看到更多3D技術與互動性設計的運用。

科技與設計的推進相輔相成。

設計師可以創意性地『漫遊』在3D空間中，擁有豐富的各種選擇。

他們提升了整個互動遊戲，將我們所有的感官都融入了體驗中。

」PinchStudio設計4.柔和的陰影、塗層和浮動元素99Design的設計師AlexIvanov認為：「柔和的陰影以及浮動元素會製造出偽3D的效果，為整體設計帶來層次感以及趣味性。

」這種趨勢為2D元素設計帶來了深度。

柔和的陰影以及浮動元素讓你的設計更有趣，整個網站會呈現一種偽3D感。

那麼這種應用不只可以用在圖上，文字也可以創造同樣的效果。

JPSDesignDribble：TrumanHalladay5.將攝影與圖形結合將原創圖形放置於真實的攝影圖上可以創造一種充滿回憶性的視覺效果，刺激用戶的創意。

Dribble：RoseeBryneRoseeBryne設計的這個杯子與手繪感圖形的融合，就會整個網頁帶來了無窮的趣味性。

Dribble：AshishRai而AshishRai的設計則是用圖形為本來的攝影圖增添了個性。

無論品牌選擇如何融合這兩者，確保這與你的品牌形象與個性相符合，不同風格的圖形都會改變人們對於同一張攝影圖的看法，比如說卡通風格就增加了「玩樂」、「有趣」的感覺，而幾何圖形以及比較細的插圖則是創造了一種複雜、深層的感覺。

6.留白的應用過去有很長一段時間，大家都流行將網站放的非常豐富、非常滿。

而現在設計師們開始使用堅固的結構，以大量的白色空間賦予新的結構，使用簡潔的框架增加設計的穩定性。

99Design的DaanSpits說到：「我努力的在網站中挖掘留白的位置，避免使用整個畫面的圖片以及視差設計。

當某東西被『框住』時，它在網站上就會更醒目，讓圖片更凸顯、跳出來。

」有效地運用網站設計中的留白效果是非常重要的，而這樣的網站也隨處可見。

比如說，Google。

Google首頁在簡潔的白色背景之上，只有醒目的Google品牌字樣，下面有一個搜尋欄，也就是整個網站最重要的部分。

這種設計與Yahoo搜索引擎呈現強烈的對比。

這並不是說這種簡潔的設計絕對比較好，因為根據客群的不同，可能會有不同的設計方式。

比如說，這種簡潔的風格在歐美非常流行，但是在中國大陸則不吃香，中國的族群特性更喜歡內容滿滿的網站風格。

7.發光的夜光色系2020年，將有更多設計師開始使用大膽的配色手法，讓網站設計在螢幕上凸顯出來。

網站設計逐漸變得更大膽，比如說在暗色背景上使用發光的尼龍色，以及超飽和色調與深色、柔和隱影設計的組合。

99Design的藝術總監AdrianneMesnard說道：「充滿未來感的色系及設計會是明年的趨勢，伴隨著等距趨勢，引入藍色、紫色和亮粉色的這種充滿未來感、發光的感覺。

」DuoTone雙色調的這種設計風格，也是夜光色系會如此流行的一個絕大因素。

雙色調是圖像的半色調再現，使用的是對比色半色調與另一種彩色半色調的疊加。

DuoTone雙色調的設計風格DuoTone雙色調的設計風格DuoTone雙色調的設計風格隨著暗色系、極簡系的崛起，使用夜光色系的品牌或許可以創造出另一個天地。

8.極簡的導覽設計設計師AnanyaRoy認為：「2020年，網站內容將會有更多具語音腳本的影片形式，文字的使用將減少，朝著『精準勝於描述』的方向發展。

總體而言，網站設計將更加簡化，讓網站導覽變得更方便。

」隨著更多像是智慧手錶這樣小螢幕的科技產品問世，網站設計要更符合小螢幕趨勢。

而影響最大的就是導覽的部分，在過去幾年，為了因應小螢幕的使用，導覽越來越簡化。

當用戶不用費力的去想要如何在網站中找到想要的資訊，他們就越願意花更多時間在網站上。

同時，超大的圖片與影片將成為網站設計的主要趨勢，越少文字越好。

20thCENTURYSTUDIOSCreativePeople99Design設計師Coincept認為：「大的圖片與影片有著生動的好處。

他們將為你的企業目標吸引更多目光，我認為這是為什麼越來越多網站開始使用大型的圖片來為用戶創造美麗的視覺效果。

」希望這八個趨勢能夠幫助你設計出讓人耳目一新的網站！準備好製作網站了嗎？FOLLOW這八個簡單步驟，設計出最強的網站！推薦文章：網站設計系列｜為什麼網站設計這麼重要？好的網站設計重要7元素電商系列｜想要成為成功電商的六個秘訣你好，我是「哈利熊」—賣家 行銷策略系列｜如何使用「誘餌效應」提升行銷目標產品銷量 價格是行銷4Ｐ中最有趣的部分之一，有許多Readmore 搜尋引擎行銷（SEM）與搜尋引擎優化（SEO）有什麼不同？在網路行銷中應該怎麼用？5分鐘帶你了解！ 接觸網路行銷的人，相信對SEO（搜尋引擎Readmore 網站設計系列｜網站UI/UX中「按鈕設計」的7大技巧！這樣做大大增加轉換率 按鈕是網站UI/UX設計中最重要的一環之Readmore Podcast行銷系列｜如何製作成功的Podcast？一定要知道的6大訣竅 在台灣越來越多人開始收聽Podcast，Readmore標籤:網站架設視覺設計UI/UX設計網站設計網路行銷發佈留言取消回覆發佈留言必須填寫的電子郵件地址不會公開。

必填欄位標示為*留言顯示名稱*電子郵件地址*個人網站網址在瀏覽器中儲存顯示名稱、電子郵件地址及個人網站網址，以供下次發佈留言時使用。

{{#message}}{{{message}}}{{/message}}{{^message}}無法完成傳送程序。

伺服器回應為「{{status_text}}」(代碼:{{status_code}})。

請聯絡這個表單處理程式的開發者以改進相關問題。

進一步了解{{/message}}{{#message}}{{{message}}}{{/message}}{{^message}}傳送程序已完成。

即使伺服器的回應為OK，一樣可能不處理傳送工作。

請聯絡這個表單處理程式的開發者以改進相關問題。

進一步了解{{/message}}正在傳送... Searchfor... 關於我們哈利熊是台灣最有趣的線上服務市集！我們的目標是解決傳統外包市場與接案時的種種問題，打造一個方便、好用的服務平台，讓斜槓與需要服務的人都能在我們網站上安心下單、更有效率的合作。

加入我們！瀏覽服務： IT與程式設計 視覺設計 影片動畫 音樂音效 行銷與企劃 商業支援 文書翻譯 線上教學 生活趣味 哈利熊臉書Seemore標籤雲Chatbot FB行銷系列 Instagram Logo Logo動畫 SEO工具 seo策略 TEDTALK WooCommerce youtube系列 互聯網 企業e化 健身 創業 命果報 咖啡 品牌建立 哈利熊是什麼 商業開發 嘉義 國外業務開發 在地商家seo 居家工作 工作效率 廣告文案 復古風格 心理測驗 技術SEO 正能量 溝通 潛能 瑜珈 甜點 生氣 生活 生產力風格 用人 直播 翻譯外包 腦力運動 臉書廣告 自由工作者 資安 連假 銷售近期文章 做好這6個電商行銷手法，你也可以輕鬆創造流量 不想再被平台抽成，WORDPRESS網站串金流其實超簡單? SEO專題：工程師最常犯的SEO優化錯誤 SEO專題：該如何面對即將到來的Google六月演算法更新？ 戶外運動好去處｜精選台灣北部休閒登山步道 近期留言「暴怒的人」在〈生氣的時候怎麼辦？8種讓自己冷靜下來的方式〉發佈留言「何正良」在〈數位轉型系列｜三個小插畫秒懂「數位轉型」不只是數位化！〉發佈留言「張愛玲」在〈行銷策略系列｜2021你一定要知道的行銷5大趨勢〉發佈留言「HoliBear哈利熊」在〈LinkedIn行銷系列｜2020年你一定要知道的十大LinkedIn數據〉發佈留言「JoeLien」在〈LinkedIn行銷系列｜2020年你一定要知道的十大LinkedIn數據〉發佈留言