Back

WordPress 網站設計流程與時間規劃

此篇分享我如何建立 WordPress 電商網站的時間規劃表,從需求確認、網站內容規劃、網頁視覺設計、WordPress 版型和 WordPress 外掛設定等,拆解每個階段的任務與細節

「實戰經驗分享,非只是網路資料整理」(更新時間: 2021.05.15)

嗨!我是爾文(Irving Chen),資深網頁設計師,先快速介紹一下自己的架站經驗,本人有多年使用 WordPress 架站與網頁設計的經驗,近年則專注 Shopify 電商網站設計與建置。對於這類架站平台的限制與可塑性有一定的了解,例如 Squarespace、Wix 後台真的限制超多,大部分的情況只能按照其版型去做編排,要做其他設定會相當困難而痛苦;WordPress 則是彈性度超高,可以在後台來去自如、修改頁面程式碼、使用海量的版型和外掛資源為網站打造全方位數位能力。若有網站相關問題,可以前往填寫表單留下訊息或需求給我,我會盡快回覆!

網站專案執行

經過這幾年來打造數十個 WordPress 網站,並與各種產業的客戶共同合作,從彼此磨合、錯誤經驗的學習,淬煉出一套網站專案執行的工作流程,而且不斷優化與更新,讓剛接觸網站設計這個領域的人,無論是設計師、工程師或客戶等,初步了解每個可執行的步驟,降低溝通成本,提高工作效率。

下圖是 WordPress 形象網站設計的時間排程,因每家公司或團隊的情況不太相同,所以每個階段規劃依實際需求和情況彈性調整,時程的長短可以當作一個參考值即可。我們有了「執行所需時間」與「工作事項」的概念,讓團隊、客戶或專案經理在初步規劃時不會毫無頭緒!

此檔案是建立 Figma 中,可以縮放瀏覽,我已設定公開,若你也有使用,歡迎蒐藏與分享,並且留言和拍手讓我知道這對你的工作很有幫助噢!因為我會不定時去更新檔案內容與流程編排,所以隨時可以回來閱讀文章囉!

WordPress 形象網站設計流程

各階段工作內容概要

  1. 需求探索:確認需求(相當重要的階段,了解需求與目標,幫助客戶釐清與整理思緒)
  2. 概念發想:團隊內部腦力激盪(可以與客戶一同探索與討論,必要時進行 Workshop)
  3. 內容規劃:建立網站地圖(Sitemap),根據企劃需求規劃頁面內容概要,此階段的 Wireframe 是討論需求使用
  4. 圖片素材:通常是攝影圖、插圖、產品圖或情境圖,必要時需提出攝影計畫外包攝影工作室拍攝
  5. 文案內容:提供網頁文案、網站內容建議如標題和內文根據設計排版的設定最佳的字數等
  6. 網站原型:最終版頁面框線圖 Wireframe,實際搭配文字
  7. 網頁視覺:順序是先進行主視覺設計提案,確認後再打造首頁設計,最後是進行網站其他頁面的設計
  8. WordPress 架站:主要階段有排版(用頁面編輯器外掛和 CSS 客製化)、設定網站功能外掛、內容上架、RWD(mobile web)、基本 SEO 設定
  9. 網站測試:至少要讓內部團隊、客戶進行實機測試瀏覽網頁,給予回饋與修正,例如表單填寫測試、電子報訂閱測試等
  10. 網站分析:必要設定追蹤碼如 Search Console、Google Analytics,視需求而定的 Google Tag Manager、Facebook Pixels 等
  11. 網站上線:理想時間是選在週二或週三,意思是只要上線後隔天不是假日較佳,這樣網站若一出問題時確定有人在崗位上可以進行修正
  12. 持續優化:UI/UX、文案、SEO、網站速度

有任何想問的問題,歡迎填寫表單留言或寄信給我 irving@irvinglab.comFB 粉絲團直接線上交談,我們一起交流、成長!附上我的網頁設計作品,可以來逛逛喔!歡迎加入 Shopify 網站設計與架站學習交流:Line 社群 一起交流與學習!但在美國的用戶無法加入台灣的 Line 社群,所以我也另外建立了 Telegram 社群,兩邊珍貴的經驗會同步分享與整理。若想進一步了解服務內容,可以加入 Irvinglab 爾文實驗室的 Line@ 官方帳號留下訊息給我們

爾文讀書中,跟我一起讀書去!精選書單 (持續更新):前往瀏覽
爾文上課中,跟我一起上課去!精選課程 (持續更新):前往瀏覽

Leave a Reply

發佈留言必須填寫的電子郵件地址不會公開。