目錄
網站並非從無生有,架設網站,可以從畫出你的網站地圖( Sitemap )開始。
無論你是要請設計團隊為你量身打造個人網站,還是喜歡從零開始自己動手做的專屬感,第一步畫出網站地圖,能夠幫助你整理出想放在的網站上內容,以及網站運行要做到什麼程度。
我建立這個網站的目的是什麼?
要能夠說出:為什麼要架這個網站? 通常架設網站的目的不外乎:
1.公司或電商品牌官網:
2.建立網紅形象宣傳自己:
3.活動網站:
4.個人部落格:
5.作品集履歷:
清楚自己的目的後,便可以根據需求,整理出不同的網站地圖。當開始著手規劃網站地圖時,就會發現根據架站目的,而出現各種的網站形式( Landing Page 、部落格、精美的相片 Gallery 等),會吸引到的瀏覽者和使用者也會不同,並且抱持著各自的目的造訪你的網站 。
網站功能的需求差異:商業性質網站 v.s 非商業性質網站
商業性質網站
商業網站往往最後導向一步最重要的功能:讓消費者下單。
在建立官方網站、宣傳個人形象等商業目的的網站、可以在規劃地圖之前,透過調查使用者分布、研究人們的使用網站的習慣、以及蒐集同業或相關品牌做參考。
首先訂立出你的目標客群( TA )是誰;我們可以透過免費的臉書洞察報告、 Google analytics 等工具,幫助了解何種年齡層、性別、所在地區的人喜歡你的主題,以及他們瀏覽網頁的時間、頻率等。
這些資訊會成為你建構網站地圖時,思考功能選單、按鍵導向、內容多寡、圖片文字大小、配色等元素的參考。還有一點重要的、能夠當做未來優化網站的基礎考量,例如:如果要進展到製作手機版網頁時,需要以美觀讓人想分享、還是功能選單越細緻為導向,還是簡單的連續下拉式網頁,讓人可以在通勤時放鬆腦袋單純滑手機就好了呢?
非商業性質網站
如果是經營個人部落格或作品集履歷、這類非商業的網站,那主要目的便是讓人記住你、驚豔你的作品集有多強大。
這時候如果作品跳出來的方式能人性化、直覺化;例如 slide 、跑馬燈式呈現、 游標經過選項時變色突顯項目,方便使用者選擇要瀏覽的作品等;就能帶給使用者舒服的網頁瀏覽體驗;不僅能夠讓人更專注於欣賞作品,也能潛意識中吸引人像追劇一樣不停地看下一張照片、下一個作品。
還有,如果想要收集意見反饋讓自己成長,不建議跳出小互動工具或問答視窗,這些對於剛踏進網站的瀏覽者是干擾、不能好好欣賞你的作品。
建議可以在作品的最後附上留言區,或是連結到你個人的 IG 、 Twitter 、 Facebook 等,普遍的情況是,在社交軟體上粉絲願意暢所欲言的頻率比官網高。現在的插畫家、攝影師等,通常把粉絲經營的主力放在 IG ,由 IG 上的短網址連結到詳細的作品集,對於增加互動率、建立長期的黏著度會是比較理想的。
規劃網站地圖的步驟教學
網站是給別人看的,好的網站地圖可以讓瀏覽者一眼知道你的網站裡說的是什麼、也能輕鬆找到想要的網頁項目按鍵。
以打造一個 WordPress 網站為例,我們可以先從電腦版的網站地圖開始,規劃網站地圖並不難,甚至可以說拿起紙筆就可以開始了。初學者可以參考以下步驟:
1.整理思緒、初步分類草圖
用紙筆、或任何你方便的工具,畫一個樹狀圖或新智圖,將想放的內容一一列出來做分類。
確定了想要放的內容之後,就可以在一個 16:9 、符合網頁桌面尺寸的長方形裡規劃出網頁的母分類、子項目、額外功能等。這個步驟稱為 Mock-up。
網站地圖是以功能性為取向做視覺設計,不需要炫技的外表;有時我們進入一些時尚華麗的官網,發現網站跑得過慢、點擊等好幾秒沒動靜、或是看到一半才跳出蓋板廣告,正是因為充斥太多負載量大的元素堆疊導致。
2.1骨架:組織出整個網站的大架構
選定後就可以直接從左邊的功能選單裡面挑出符合自己網站地圖的元素, 再從右邊的內容選單裡,挑出示適合你內容中的選項輸入,輕鬆完成一頁一頁的內容網頁;最後把每一頁內文做歸納、整理成子母項目,就會成為一般我們看到的、網站中使用者點選網站選項、出現清單和子母項目的狀態。
2.2肉體:確立選單後,上傳網頁內容
3.邀請他人試用你的初步成品、收集回饋
製作出初步的網站後,建議邀請身邊友人在不需要你解說的情況下,使用你的網站、測試流程是否流暢、能不能快速找到他們想要的資訊等。請他們給你最真實的使用者體驗感想,幫助你逐步整理出優化方向。