Checklist Design 網頁開發者必備參考手冊，助於學習更好的設計方式

身為網頁開發者總會不斷重複一些類似的情境，例如協助其他公司製作網站的價目表、購物車、新手上路、網誌、招聘、聯繫頁面等等功能，可能不同公司對於內容的細節要求略有差異，但整體來說主軸不會相差太遠。舉例來說，部落格頁面需要有文章標題、縮圖、作者、內容和分享按鈕，非必要項目則有相關文章、訂閱、發佈日期和留言功能，那麼有沒有檢查清單可以讓開發者參照呢？

本文要推薦的「Checklist Design」是提供給網頁設計或開發者的參考資料，網站的作者最初在一家協助澳洲科技新創團隊製作網站和產品的公司，雖然累積不少工作經驗，但總在開發時遭遇一些小問題，不得不回頭找出以前做過的專案，於是他決定把這些資料集合起來，以便為下次開發做足準備。

Checklist Design 收錄一些開發者會用到的頁面和元件，每個頁面依照需求列出必要和非必要（可選用）的項目，也可用來檢查自己手邊開發的項目是否有達到這些功能。頁面裡會有相關資源或範本可以連結參考，不過不一定適用於每個情境，還是得回歸客戶需求面，但 Checklist Design 能讓我們在建立開發特定功能頁面時有個參考依據，而不用去找其他網站做為範本。

網站名稱：Checklist Design
網站鏈結：https://www.checklist.design/

使用教學

STEP 1

打開 Checklist Design 網站後有兩大項目：頁面和元件，頁面就是我們經常會瀏覽的網頁，像是登入頁、價格頁面、404 頁面、新手說明、聯絡、註冊頁、購物車、問與答、網誌文章和招聘頁面等等，而元件部分則有按鈕、文字欄位、導覽、搜尋和表格等項目，更多的內容仍在持續更新。

從上方選單也可快速找到你想要瀏覽的頁面或元件詳細資訊。

STEP 2

點選進入任一種頁面類型，會看到需要顯示於頁面上的各個項目，大家比較熟悉的網誌文章就會有標題、縮圖、作者介紹、內容、社群分享按鈕等等部分，每個項目有更多詳細說明（和小提示），網頁右側則有其他相關資源，例如一些設計範本、參考文章和鏈結。

另一個大家比較會用到的是「聯絡」頁面，在聯絡頁面中建議放入和個人或品牌一致的視覺效果和內容、明確的聯絡方式和社交媒體帳號，此外，如果你還想放入更多資訊，Checklist Design 也建議可以細分聯絡方式（例如不同的窗口），提供方便前往的路徑提示，像是放入 Google Maps。

整體來說，Checklist Design 確實是一個相當好的網頁開發參考資料，除了在設計頁面時可以參照，也能回頭檢視自己的網站有沒有符合這些要件，是不是有其他能夠改進的部份。

Checklist Design 更像是一本標準化的手冊，對於設計師來說或許會很有幫助。