網頁設計筆記

製作網站之前，需要制定網站企劃書，以作為網站後續製作的依據。

網站企劃書並沒有一定的製作格式或樣本，會根據不同的網站屬性、規模、製作形式等，有不同的企劃規格與方向，但是基本架構是一樣的，網站企劃可以製作屬於自己風格的專業企劃書，主要需要讓客戶了解這份企劃書想表達什麼，我們能夠給他們什麼。

寫一份網站企劃不僅僅要考慮網站的立意與定位，還涉及相對應的分析調查、執行流程、人員分配等具體事項，也依照每個網站不同屬性產業的結構而有各種模式的企劃書綜合型式，主要以突出優勢的方向為重即可。

本單元根據本課程OnePage網頁設計，制定企劃內容，請依項目修改為個人設定的內容，並依據網站風格及配色做企劃書之修改，更為詳盡的企劃方式，將於進階網頁設計中繼續進行。

企劃範本以Figma製作，以下為企劃大綱，內容請依據個人設定撰寫：

Figma企劃範本

• 企劃書播放預覽
• 企劃書編輯網址

1. 企劃書封面：可依網站風格修改，並寫上網站主題及相關資訊。


---

2. 設計動機與目標：請描述網站設計的動機與目標。


---

3. 用戶分析：主要使用網站的目標族群（職業、性別、年齡），並分析其背景、偏好及上網習慣等。


---

4. 設計理念與風格設定：

網站是在網路上的「門面」，設計風格主要應符合品牌的形象，建議使用相對應的色系、LOGO等，還有整個網站的版型呈現，包括產品如何整齊排列、顯示，都是一門艱深的功課，以上的眉角都可以提出與專業的設計師討論。



---

5. 標誌與網頁圖示：請放置網頁LOGO與網頁圖示 Favicon。


---

6. 字體設定與色彩計畫


---

7. 網站架構與功能分析：

單元規劃／網站地圖（site map）「網站地圖」是網站的骨架，由各個單元組合而成，每單元都是獨立的功能或獨立資訊頁面呈現（ OnePage以區塊方是區隔 ），例如：簡介、最新消息、作品（產品）介紹…等。依照提出的單元選擇最佳製作方式，可適當的調整順序及設定的內容。



---

8. 製作項目與時程：請依照實際製作設定製作進度。


---

9. 網頁呈現與網址：將成果上傳，並將最後成果截圖（FireShot）。

企劃範本以Figma製作，請先註冊後可複製修改為個人可使用的網頁企劃。

1. Figma註冊

• 請至Figma官網，並進行註冊。

---

2. Figma企劃範本

• 企劃書播放預覽
• 企劃書編輯網址

---

3. 將檔案複製（Duplicate）



---

4. 製作完成，可將播放檔連結分享



---

5. 完成後，可將整份檔案輸出成pdf檔或圖檔。



---

6. 網頁企劃完成後，pdf檔於期末繳交至Moodle
   線上連結回覆至期末作業區｜ 北視傳【 OnePage作業 】｜ 竹視傳【 OnePage作業 】。

---

1. 寫一份網站的建置規劃書
2. 網站企劃從何開始？這三大點先準備好！
3. 撰寫網頁企劃的五個要訣
4. 網站企劃- 網站的基本規劃
5. 網站企劃 網站進件流程表
6. 網站規劃Website Planning
7. 淺談網站企劃的工作
8. 全方位服務網站企劃

[OnePage] 實作解析 | 網頁企劃