根據調查,38%的網站造訪者會純粹因為網站不美觀而離開網頁,可見網站設計的重要性。要如何一步一步打造出超強的網站呢?今天,哈利熊為大家整理了網站設計的八大步驟。
網站設計八步驟
38%的網站造訪者會因為網站設計不美觀而離開網頁,可見
網站設計的重要性。今天,哈利熊為大家整理了網站設計的八大步驟。
- 定義網站的目標和策略
- 研究最新的網站設計趨勢
- 選擇平台
- 選擇模板並開始客製化
- 選定品牌策略
- 增加並優化內容
- 發布網站
- 分析並改進
一、定義網站的目標和策略
要訂定目標是在我們幾乎所有網路行銷策略中最重要的一步,網站設計也不例外,在埋頭開始創作前,你必須先弄清楚這個做這個網站的目的是什麼。這會為未來網站設計的方向訂下重要的基礎。
網站目標有非常多種,以下只是一些常見的例子:
- 單純陳列資訊?
- 增加營收?
- 打造品牌?
- 收集聯絡資訊?
- 成為產業具權威性的指標?
- 與現有或潛在客戶增進互動?
如果今天製作的是針對單一產品的登陸頁面,那麼可以
遵照SMART原則,訂下一個明確的、可衡量的、可達成的、相關的及有時限的目標。
二、研究最新的網站設計趨勢
但記得,非常新穎、流行的趨勢不一定是最適合你的品牌的。
48%的人認為一個網站最重要的因子就是網站設計!所以在設計上絕對不能馬虎,除了研究最新的網站設計趨勢外,也可以看看競爭對手、業界的設計,決定你是要符合產業的設計趨勢,還是打破傳統的設計風格,做設計上的先鋒者。
三、選擇平台
想到網站設計,大部分的人可能會想要雇用專業人士,但有時候純客製化的網站成本非常非常高。但是還好,現在有非常多已經架好的網站以及電商平台供選擇,讓你能夠在完全不懂任何coding的情況下,快速的架出一個好網站。
架網的平台選擇非常多元,有Wix、Shopify、BigCommerce、Squarespace、GoDaddy等。
Website Builder Expert針對不同的平台做了品質上的比較,不同的平台可以因應不同的需求。
而針對有一些基礎coding知識的人來說,可以選擇WordPress。WordPress是網站設計最熱門的平台,可以幾乎客製化你想要的版型與風格、免費的使用,還可以插入一些非常有用的小工具。
哈利熊上也有許多優質的賣家,可以教你快速的架網,回答你網站設計中遇到的問題。
四、選擇模板並開始客製化
現在你已經確立了網站的目標、查清楚了最新的設計趨勢,並且選定了理想的平台,就可以開始選擇網站的模板。網站模板,也有些人稱之為網站的主題(Website Theme)是你網站的頁面配置。就有點像是一個房子的基本結構,牆面、地板、隔間等等,在你把沙發、床這些家具搬進來前的樣貌。
如果你選擇的是市面上常見的平台,那麼其實會內建非常多模板供選擇,通常這些模板也會根據不同產業進行分類,在篩選起來應該是蠻容易的。
比如說Wix,是非常適合架設登陸頁面的平台。
你可以根據網站目標以及產業進行選擇,可以選擇「線上商城」、「設計師」、「部落格」、「美妝」、「餐廳」、「健身」、「攝影」等。
接著,就可以選擇不同的版型。
五、選定品牌行銷策略
現在,我們要開始進入真正的設計階段!
在設計的時候,你應該把整體的品牌策略納入考量,這包括了品牌的顏色、風格、字體、圖片等等,在設計的時候,非常重要的一點就是保持品牌的一致性,每一個頁面、每一個元素都應該是要圍繞著品牌的策略進行的。
1. 品牌顏色
通常品牌會有一個主要的顏色,再加上兩到三個輔助色,而數據顯示,最受歡迎的顏色是藍色,在
品牌最愛用的顏色中,有幾乎1/3的品牌都會選擇用藍色。
2. 字體風格
顏色對於人類大腦的影響很大,而字體也同樣有很大的影響。平均網站造訪者會讀取頁面上約略20%的文字,所以必須將字體設計得妥當、吸引人。
基本上,白領階層的品牌會想要使用比較經典的字體,英文的話比如說Arial或是Helvetica,中文的話可能是黑體或是華文細體,給人一種比較穩重、專業的感覺。
如果是崇尚有趣、活潑、玩樂的品牌,就可以使用比較抽象的字體。但記得,字體的選擇必須找到有趣與可讀性的平衡,不要為了讓字體過於花俏,而失去本來想要讓讀者閱讀的初衷。
3. 圖片
圖片是網站設計中非常重要的一個元素,對於客戶的點擊與互動有極大的助益。且圖片的使用可以讓客戶對你的品牌印象更為深刻,也更容易吸收內容與資訊,研究顯示,對於一份資訊,當我們用聽的,只能記住10%的內容,但當我們用視覺圖片的方式呈現,就可以記住65%的內容!
但是要小心,也不要放置過多的圖片,而拖慢了網站的速度。在
網站設計最重要的7大元素中,我們有大部分的用戶期待網站在2秒內就加載完成。
六、增加並優化內容
現在,你應該對於網站上要放入什麼樣的資訊有了大概的想法,那麼就該做這三件事:
- 版面配置
- 內容放置
- 內容優化
1. 版面配置
版面配置(Positionging)指的是每一頁上的內容要該如何擺放。
根據Nelson Study的研究,我們發現通常一般人在讀一個網頁的時候,會使用英文字母F的閱覽方式。所以這也是為什麼通常導覽欄會放置在頁面的最上方,因為這通常是用戶第一個注意到的地方。而網站中最重要的資訊也應該考慮「F格式」,放置在相應的位置。
2. 內容放置
內容放置就是要將所有的內容放置其中,包括文字、圖片等。
3. 內容優化
內容優化(Content Optimization)指的是透過內容的優化,更好的讓用戶接收網站的資訊,也能進而轉換為較佳的網頁表現指標讓網頁在搜索引擎的排名更前面。
說到內容優化,也牽涉到了SEO(搜索引擎優化),透過對於頁面資訊的改進,來增加頁面在搜索引擎中的排行。網站中的每一個元素都有可能影響到網站的排名,包括文字、圖片、內部鏈結,甚至是在手機裝置上的反應,而對於SEO不熟悉的朋友,可以參考
哈利熊的SEO系列文章。
七、發布網站
當網站網站有了一個雛形,就進入到測試網站的階段,展示給家人、朋友、同事看,看看是否有錯誤,或哪裡需要改進,一般需要注意的地方有:
- 測試所有的鏈結是否都正常運作,連結到正確的頁面
- 所有的內容是否可讀,方便被找到
- 離主頁不要超過3個點擊次數
- 網站在各個裝置都是可以運作的,包括桌機、手機、平板
- 任何頁面的加載速度不要超過5秒
八、分析成效並持續改進
在設計、放置內容、發布後,並不是結束!
網站發布完成後非常重要的一點就是要看網站的表現,很多平台都會有內建的分析器,或是類似的小程式可以插入,你也可以選擇
使用Google Analytics,查看頁面的閱覽量、轉換率、每一頁的停留時間、跳出率等。
最後,再來總結一下網站設計的八大步驟吧!
- 定義網站的目標和策略
- 研究最新的網站設計趨勢
- 選擇平台
- 選擇模板並開始客製化
- 選定品牌策略
- 增加並優化內容
- 發布網站
- 分析並改進