前言
元素工具有很多個，這邊僅列出常用的，像我接案七八年，真的很多冷門的元素工具我從來沒用過，這邊把較常用的用表格方式列出。
常用的元素工具
| 元素工具名稱 | 主要用途 | 備註 |
|---|---|---|
| 【基本】 | ||
| *Container | 容器，用來做網頁區塊佈局，即切版。 | |
| *標題 | 每頁都會用到。 | |
| *圖片 | 每頁都會用到。 | |
| *內容編輯器 | 每頁都會用到。 | |
| 影音 | 可插入Youtube影音、Vimeo影音、或站內影音。 | 常用在「首頁」。 |
| *按鈕 | 每頁都會用到。 | |
| *分隔線 | 就是分隔線，有許多樣式可選。 | |
| Google地圖 | 常用來做在「聯絡我們」或「活動報名頁」、「頁尾(footer)」。 | |
| *圖示 | 置入icon圖示，有數百種可選，常與標題、內容編輯器配合使用。 | |
| 【一般】 | ||
| 圖片轉盤 | 用來做『圖片輪播』，沒買Pro版的只能用它做輪播的需求。 | |
| 圖示列表 | 用來製作條列項目。 | 常在頁尾(footer)。 |
| 分頁 | 頁籤切換內容。 | #收合與展開資料 |
| *收合容器、 切換 |
用來做『問與答』，兩個功能差不多。 | 常用在「首頁」。 #收合與展開資料 |
| 社交網路服務圖示 | 不是 |
|
| 警告 | 用來寫一段區塊顏色分明的「文字段落」，用來講一段很重要的提醒的話。 | |
| 短代碼 | 有些外掛會提供短代碼，我們可以用短代碼來置入其它外掛的功能效果。 | 整合其它外掛功能，偏客製化。 |
| Html | 會寫語法的人可以在此寫語法來修改網頁。(CSS、jQuery) | |
| *選單錨點 | 常用來做一頁式網頁的「同頁內之連結」。 | 一頁式網頁範例 |
| 資訊欄 | 置入部落格之資訊欄。 | |
| 【專業版】 | ||
| 文章 | 文章列表，可用來做『最新消息、作品集、成功案例、部落格』。 | 文章列表排除某分類:Ultimate Category Excluder |
| *藝廊 | 用來做「作品集」。 | 純圖片作品集，點開後沒有文字介紹那種。 |
| 表單 | 用來做「聯絡我們」。 | |
| *幻燈片 | 用來做『大圖輪播』，圖上可以置入文字。 | |
| 導航選單 | 脫離「自訂」的單樣式，用來做新的『主選單』。 | 模版設計 |
| *媒體輪播 | 用來做『圖片輪播』、可混搭『影片輪播』。 | |
| 見證輪播 | 客戶心得的輪播。常用在『成功案例』。 | 各產業都可運用。常用在「首頁」。 |
| 目錄 | 自動抓取同一頁中的標題形成小目錄。 | |
| 分享按鈕 | 替文章加入「分享此篇」的按鈕。 | |
| 段落引用 | 與「警告」類似，用來寫一段區塊顏色分明的「文字段落」，用來講一段很重要的提醒的話。 | |
| Facebook粉絲專頁 | 用來崁入粉專的主頁。 | |
| 版型 | 把已存的小版型置入網頁呈現，常用來做『簽名檔』。 | 只要修改已存小版型，全站每一處有置入小版型的就會統一更新。 |
總結
1、想要做出精美的網頁，除了要熟知每種元素工具的用途之外，更要發揮創造力來思考一些用哪些元素工具可以更佳來呈現素材與文案。
2、另每個元素工具中都有「樣式」可以讓你配色、調整外觀，這也是讓網頁變得有美感、有質感的重點，例如光是一個「標題」，你好好研怎樣調製它的樣式，就可以有不同的風格，參考此篇!
3、更要多看多觀察一些不錯的網頁來思考，要想若是我，我會用什麼樣的元素工具來達成這樣的效果？我版型要怎麼切？久而久之，你所設計的網頁就會越來越有質感、越來越好看!
