01. 複習一下：什麼是元件統整頁

把所有的頁面中的共用元件統整在一個頁面

02. 為什麼要做元件統整頁？

你切版的時候，會遇到以下情況嗎?

1. 狀況A. 這邊的規則怎麼跟前面不一樣? 是故意的嗎?
   一樣的東西，為什麼兩頁不一樣？
   

2. 狀況B. 前面的頁面，有很像的東西，但又有點不一樣欸
   看看以下的版型，事不是有點類似呢
   

3. 狀況C. 喔不，PM要我改一個東西, 但不知道其他頁會不會出事

4. 狀況D. 和別人一起合作切一個網站，哪些東西我的合作夥伴已經切過了呢？難道要一個一個問，一個一個比對嗎？

綜合以上的狀況，就是 統整頁 的由來

03. 統整頁的整理方式分享

1. 全部頁面要看過(就算有Guideline統整頁也要全部頁面看過)
2. 把版型分類 (簡單說就是很像的放在一起)
3. 找出可重用的結構，或版型的最大集合
4. 記得要看小版! (大版一樣 小版不一定一樣)

如以下：將重覆的東西

04. 統整頁元件分類

基礎元件 (Element Component)

如按鈕、連結等，這種可以包含於多種不同版型(Template)的基礎元件

版型元件 (Template Component)

由多個基本元件構成的一個版型Template