在看組件和元素之前，我們先了解在他們之上的一個概念-模塊

模塊大家應該都不陌生，任何一個完整的界面，都會有多個功能模塊，而每個模塊內有相應的組件，每個組件中又有相應的元素，其中任何一點的變化，都會使用戶對產品的認知發生改變。



模塊并不是一個新的概念，早在20世紀初期的建筑行業中，將建筑按照功能分成可以自由組合的建筑單元的概念就已經存在，同樣也出現在早期的產品設計中，并且許多產品的設計都能將其很好運用，包括汽車，電腦，電器，鞋子等等。（如下圖）

這些產品之所以使用模塊是因為模塊具有這些優點：

1.標準化：模塊是具有標準尺寸和標準接口的預制功能單元，這是組裝、互換等特征的基礎；

2.可組裝：多個模塊可以方便、靈活地組合、配置，以構造不同大小、不同形狀、不同功能的系統；

3.可替換：通過用一個模塊去更換另一個模塊，可以改變系統的局部功能而不影響系 統的其他部分；

4.可維護：可以對模塊進行局部修改或設置，以滿足用戶需求，另外可以增加新模塊，擴展系統功能。

網站建設可以多做這樣的積累和標準化，這樣會讓你以后的網站設計中更快速化去實施，組件和代碼都可以大大提高重復使用率，提高網站建設效率。