不會 Coding 也可以設計網站

這篇文章想要分享為什麼我認為設計師都需要一個網站來放置作品與介紹自己的空間，同時分享過去我使用海外平台架設網站的經驗。這個時代，就算設計師不會 Coding ，只要有一點網站的相關基本知識，其實也可以架設出好的作品集網站，甚至也可以用這些平台為客戶架設網站。

從 2016 年唸研究所時，學校教授就開始要求我們把作品放置到自己的網站上，當時，我一聽到網站就傻住了…需要 Coding 嗎？我又不是工程師，教授是瘋了嗎？這是要怎麼用！回家後，花了一段時間比較各個平台之後，我選擇在最容易上手的 Squarespace 架設了自己的第一個作品集，同時也買下自己的第一個域名 Hsiuchikuo.com，隨然現在已經沒有在用了。現在想想第一個網站真的是非常不專業，對於來訪用戶體驗也是非常的不友善，用戶應該看完第一頁就直接跳出了吧！這 4 年來我也一直保持更新自己的作品到網站上面，每半年也會重新設計、更新作品到網站上。

看下去之前，你要了解架設網站不一定需要 Coding

你一定會想怎麼可能？那不是只有模板( Template ) 可以用嗎？身為設計師，我才不想要我的網站看起來像模板，跟別人一樣。但其實 Wix & Squarespace 在 2020 年初，也開放自由度更高的版本，只要你有基礎架設的網站知識，透過簡單的視覺拖移就可以自行架設網站，你現在看文章的 Boring Design Blog 與 Boring Design Lab 也是不需要 Coding 的方式架設出來的，想不到吧！

雖然我有些朋友在 UI&UX 產業工作都會很看不起這種類性的平台。但對我來說，在學生時期或是創業初期的客戶可能沒有多餘的資金架設網站，所以網站只需要最基本的功能就好，所以視情況我滿推薦使用這類型的平台，並且隨著自己的能力或者產業成長到某一個高度，再請專業的工程師團隊重新架設網站也不遲，只要可以達成現階段的目標，就是好工具。

為什麼設計師需要一個網站來放作品集？

找工作？找客戶？轉職的需求？備用作品集的雲端硬碟？經營個人品脾？我個人覺得最主要的兩大原因是展現自己的作品與讓潛在客戶了解你的服務有哪些。但是很多人覺得「使用 Behance 或 PDF 就夠了，為什麼我還要花錢架設一個網站？」這是我聽許多在台灣的設計師朋友跟我分享的，其實我滿驚訝的。因為如果要在美國找工作，一個自己的網站幾乎是必備的，個人網站最能展現設計師的能力與個性。雖然 Behance 可以免費放置作品集，但當每個人的版型都是一樣的時候，我要怎麼了解這位設計師以外的個性與特長？ PDF 對於商業人士是個非常好的選項，因為開會時可以列印出來，但是隨著時代發展，放在網站不是更便利嗎？手機一開就可以看，開會也可以共享到大螢幕上。那到底是為什麼不架設網站？是不是因為麻煩或是懶惰？如果不是應該就是不知道有哪些資源可以使用吧，那接下來的內容應該能幫助到你。

一直保持最好的樣子

在這個時代透過網路每一個人都可以輕易的連結到任何人，機會更是比起 10 年前要多很多，我們不需要再主動一件一件寄送實體作品集給公司，或許對方也可以利用不同的管道主動聯繫到我們。但是當機會來臨時，我們網站上面的內容是否能提供我們最新的作品？是否可以展現：「Hey，這個案子我可以勝任！」這樣的形象？第二個原因就是為了未來做準備，我們無法預測未來，如果哪一天要離職了，或是公司面臨財政危機而被開除了，我們就不用花費額外的時間準備作品集，隨時可以移動到下一間公司。以上是兩個主要比較現實面的問題，所以我一直保持網站更新。

好網站的定義

在開始介紹好用資源之前，我們要先了解「好網站」的定義是什麼？最基本的一個好網站，就是幫助來訪的用戶獲取他們所需要的資訊與內容，之後才是調整網站的 Looks & Feels 、動態設計、3D互動設計等等。我舉一個很簡單的例子好了，以前小時候為了追日劇都會去一些比較兩光的網站，雖然那些網站的設計與視覺呈現非常凌亂，有時候頁面還會自動亂跳，廣告又一大推。但是只要我可以追日劇，這個網站就達到最基本的功能，滿足我身為用戶的基本需求，就是個最基礎的「好網站」。

如果網站主人把網站視為長期性的數位產品，那也會慢慢隨著時間把網站的一些問題修改、優化掉，讓用戶有更好的體驗。像是 Netflix 在 2008 年的網站服務項目只是提供簡單的用戶註冊功能與介紹郵寄服務頁面， Netflix 的前身並不是我們現在所知道的線上影音串流平台，而是像百視達這樣的租片中心。所以當時的網站，也只需要達到那時候的需求即可，但是隨著科技的進步， Netflix 也把數位產品延伸到不同大小的裝置同時也一直保持優化，讓用戶有更良好的體驗，漸漸轉變成主流的線上影音平台。

那對於設計師來說，作品集的功能就是展示自己能力的空間，但是隨著我們的資歷越來越豐富，我們的作品集網站也要越來越好。「好」不代表一定需要花俏的動態設計，也不是一定要自己動手 Coding 出這個網站，而是優化『展示自己能力的空間』與『讓用戶了解你』這兩樣能力。所以以下我分享的平台都可以簡易的達到上面兩個目標。甚至我有時候也會推薦給客戶使用，畢竟再創業初期資金短缺的狀況下，應該把資金花在刀口上。

Squarespace 7.1 適合你嗎？

我已經使用 Squaresapce 快要四年了，我的作品集 Boring-lab.com 也是使用 SP 架設出來的，各位可以去參觀看看。雖然過去三年 SP 都只能使用模版，但由於 SP 提供的模版都非常的有質感，所以我非常推薦。在 2020 年初， SP 釋出的 7.1 版本，開放了自由度非常高的通用模板，原理就像是使用不同的拼圖拼湊出一個網站，在這個模板上可以使用不同的動態效果，不同的區塊獨立也可以使用不同的顏色與字體大小，我個人覺得對於架設一個設計師網站，這些功能已經是非常足夠的，在使用上面也是非常的簡單好上手， Youtube 上面也有非常多的教學資源，對於個人工作室與藝術相關工作者是非常的夠用。

如果正在辦活動，要在短時間建設一個可能活動結束之後就會關閉的簡易小網站（Landing Page) ，其實 SP 是非常適合的，架設完之後， SP 裡面的系統會直接自動幫網站設置 Responsive web design (延伸文章：手機體驗稱王的世代，如何讓你的文章更適合用手機閱讀），所以用戶在手機、平板、桌上型電腦都可以有良好的瀏覽體驗，不會把桌上電腦中呈現的配置，直接縮放到手機上，導致用戶使用手機瀏覽網站時非常的不方便而跳離。如果你有一點 CSS & Html 的背景，甚至可以在區塊中進行一點個人喜好的修改，所以這真的是非常強大的平台。

誰不適合使用 Squarespace

對於台灣電商來說可能比較不方便，因為 SP 目前沒有支援台幣支付，同時也不支援台灣的貨運系統，所以對於台灣電商來說，我這邊是非常的不建議。但如果未來 SP 開放台灣的金流與物流系統，那對於初期創業的電商來說，我個人是覺得非常適合， SP 在後台有提供網域與 Gamil Suit 的服務，同時也可以使用內置版本的數據分析來優化網站與產品，也支援 Google Analytics 等等第三方軟體，幾乎已經是一條龍包下來了，所以非常的適合對於不想花太多時間在適應平台的用戶。

Wordpress + Divi

相信大家一定都有聽過 Wordpress ， WP 介面與使用方式與另外兩個比較起來算是有點複雜的，同時如果不會 Coding 的朋友們，只能使用 WP 非常兩光的模板，就是那種… IG Logo還沒有更新的模板，反正不會想要使用的模板。 WP 是非常多元的社群，提供大量的第三方插件給用戶，所以就算不會 Coding ，我們也可以使用插件來完成架設網站，同時也可以請工程師幫我們製作出想要的網站，我們再導入 WP 也可以。
你目前看這篇文章的網站，就是利用 WP+Divi 所架設出來的。一開始我只是把文章放置在 Boring Design Lab 的網站中，也就是 Squaresapce ，但是因為隨著讀者的數量越來越多，我也覺得如果真的要好好經營這個自媒體，使用 WP 對於未來會比較保險。因為在未來如果我要搬家，或是升級我的網站時，我可以把所有的內容直接輸出搬家。但當時我從 SP 搬家到 WP 時，是一篇一篇文章慢慢複製，圖片也是逐個慢慢下載重新上傳，花費非常多的時間。因為 SP 或 Wix 都是使用他們自己的程式語言，所以無法完全的把內容下載下來，這一點是比較不方便的地方。

然後我使用 Divi 來設計網站頁面， Divi 是由 elegant 開發的軟件，功能性非常的強大，但同時你可能要花一點時間了解網站的基礎架構，像是 Margin, Border, Padding 這類型的知識，如果你對於網站基礎非常了解，同時會一點點 CSS & Html ，那 Divi 真的是一個非常適合你的工具。因為對於設計師來說，Divi 提供像是 SP & WIX 視覺導向的設計方式，同時也提供特別的動態或是3D物件給客戶使用。如果用蓋房子的方式來解釋，我們可以把 WP 當作一個非常強大的結構，而 Divi 是可以幫助我們打造房子外觀的第三方軟件。同時，我們未來要搬家具（網站內容）時，也是非常的方便。

對於設計師來說，這個選項可能要花多一點時間學習使用 Divi 軟件與了解架設網站的基本知識，但是如果有多餘的時間，我覺得這會是學習的好機會，同時你也可以把 WP 當作放置作品集的雲端硬碟，要是哪一天你的電腦壞了，所有的作品集都不見了，還是可以從 WP 下載下來。

誰不適合用 Wordpress + Divi

如果你不太想花太多時間在上面的人，這個選項可能不是最佳的選擇。畢竟 WP 與 SP or Wix 比較起來是非常的複雜，也需要花一點時間去了解。如果你過去使用過 SP 這種視覺導向的網站架設平台，突然跳過來 WP，一開始真的會傻眼，因為它一開始是以 Blog 會導向，所以在界面上的設計也是以 Blog 為主軸。至於 Divi ，你可以把它看成是你必須要學習的新軟體，雖然 Divi 是關於視覺導向的設計，但是也要花很多時間在 Youtube 看教學影片、了解基礎的網站知識。而且必須每一頁慢慢的設計，不像是 SP or Wix 可以快速的生成設計，而且每ㄧ個頁面都要去調整大小，同時也要自己手動調整 Responsive web design ，所以真的需要花費很多的時間在上面，但相反的也提供非常多元、自由的功能給用戶，所以如果你只是要架設網站擺放設計師作品，我個人是不推薦這樣的搭配。

Wix - Editor X

Wix 最近推出了 Editor X，是一個強打任何細節都可以調整的平台。我最近使用之後，發現真的像廣告介紹的一樣，任何細節都可以調整。自由度比 SP 還要高，介面也比 WP 還要容易使用，但是如果沒有基礎的網站知識，我個人覺得幾乎是不可能使用這個工具。這就像是 Divi 插件一樣，需要花時間去了解與學習工具，也要去官方 Youtube 平台把所有的教學影片看完之後，才有辦法開始架設網站。

我個人覺得 EditorX 有點卡在 SP 與 Wordpress + Divi 的中間，因為用它建立一個簡單的網站，又不能像 SP 可以快速製作，如果是要長時間經營的網站，又不能像 Wordpress 可以把作品集存放在後台，更新內容的方式也是有點不方便，如果你使用 Wix ，是無法把內容整個搬家的。雖然自由度比 SP 還要高，但其實 Divi 也可以做到這件事情。所以目前還在觀察中，或許在未來 Wix 會找到自己的方向。