常用網頁元素
過去要設計網頁，通常都要學習 HTML、CSS、JavaScript 等網頁語法，而 Canva 只需要幾個步驟，就能輕鬆地搭配各種網頁元素，並將設計轉換成網頁，這篇教學會介紹 Canva 裡常用的網頁元素。
快速導覽：
常用網頁元素
網頁設計和一般的設計比較不同的地方，網頁設計會使用「網頁元素」來呈現網頁內容，雖然使用 Canva 進行網頁設計時並不會直接編輯網頁程式碼，但使用了下列的元素，仍然會轉換成網頁語法來呈現，Canva 裡常用的網頁元素如下：
| 元素 | 說明 |
|---|---|
| 網頁標題 | 網頁 title 元素，不會顯示在畫面中，但會出現在搜尋引擎和瀏覽器頁籤上。 |
| 頁面標題 | 連結每個頁面的標題文字，Canva 作為導覽列專用的連結標記。 |
| 標題、副標題 | 網頁 h1～h6 標題元素，一個網頁通常只有一個 h1 標題，內容和 title 相同，但 Canva 並沒有使用標準 h1～h6 作為標題，而是透過網頁 CSS 設定文字格式。 |
| 內文 | 網頁 p 段落元素。 |
| 連結 | 網頁 a 超連結元素。 |
| 表格 | 網頁 table 表格元素。 |
| 清單 | 網頁 ul、li 清單元素。 |
| 圖片 | 網頁 img 圖片元素。 |
| 形狀 | 網頁 SVG 圖形元素。 |
| 影片 | 網頁 video 影片元素。 |
網頁標題
「網頁標題」是網頁的 title 元素，不會顯示在畫面中，但會出現在搜尋引擎和瀏覽器頁籤上，Canva 的網頁標題就是「這個專案的名稱」，從「檔案」和最上方的輸入欄位 ( 畫面夠寬就會顯示 ) 可以進行設定。
發佈並開啟網頁後，從瀏覽器頁籤和原始碼裡，就會看見設定的標題名稱 ( 參考「網頁標題 title」 )。
頁面標題
「頁面標題」是連結每個頁面的標題文字，也是 Canva 作為導覽列專用的連結標記，從「頁面」可以進行設定。
當設計專案有「多個頁面」，轉換成網頁後就會變成「單頁式」網站裡有「多個區塊」，透過導覽列就能快速前往指定的區塊，例如下圖從網頁原始碼裡，就會看見不同區塊的名稱。
標題、副標題
「標題、副標題」通常是指網頁的 H1～H6 元素，一個網頁只會放置一個 h1 標題，其內容通常和 title 相同，但 Canva 並沒有使用標準 H1～H6 作為標題，而是透過網頁 CSS 設定文字格式，使用的方式只需要添加文字，將文字樣式設定為標題或副標題即可。
發佈並開啟網頁後，從網頁原始碼裡，就會看見網頁標題和副標題使用 span 標籤，並非 H1～H6 的標題標籤 ( 參考「標題 h1～h6」 )。
內文
「內文」通常是網頁的 p 元素裡的內容，通常會放置主要的文字，並透過不同的 p 元素進行分段，在 Canva 裡只需要添加文字，將文字樣式設定為內文即可。
發佈並開啟網頁後，從網頁原始碼裡，就會看見設定的內文 ( 參考「段落 p」 )。
連結
「連結」是網頁的 a 元素所實現的「超連結」，可以開啟其他的網頁或前往頁面中指定的位置，選擇畫面中的元素或文字，點擊「,,,」選擇「連結」，就能替元素或文字加入連結。
加入的連結可以選擇 Canva 中已經發佈為網頁的專案，或這個專案裡的指定頁面。
除了 Canva 本身的頁面，也可以填入外部的連結網址。
發佈並開啟網頁後，從網頁原始碼裡，就會看見設定的連結，仔細觀察可以發現如果是連結到「頁面的特定區塊」，網址使用「#」的方式連結到指定的 id ( 參考「超連結 a」、「HTML 元素屬性」 )。
清單
「清單」是網頁 ul 和 li 等元素所組成的條列項目，在 Canva 裡使用文字的「清單」按鈕，就能將分段的文字轉換成清單。
發佈並開啟網頁後，從網頁原始碼裡，就會看見設定的清單 ( 參考「無序清單 ul、li」 )。
表格
「表格」是網頁 table、th、tr、td 等元素所組成的表格，在 Canva 裡加入「表格」設計元素，就能夠開始使用表格。
發佈並開啟網頁後，從網頁原始碼裡，就會看見設定的表格 ( 參考「表格 table、tr、td」 )。
圖片
「圖片」是透過網頁 img 元素所顯示的圖片，只要是 Canva 可以進行「編輯照片」的圖片元素，都是屬於圖片類型。
某些小動畫元素，也是屬於圖片類型。
發佈並開啟網頁後，從網頁原始碼裡，就會看見加入的圖片，仔細看可以發現小動畫使用 .gif 格式，靜態圖片使用 .jpg 格式 ( 參考「圖片 img」 )。
形狀
「形狀」是透過網頁 SVG 元素所顯示的圖片，只要是 Canva 可以進行「編輯影像」的形狀或向量圖元素，都是屬於形狀類型。
此外，便利貼或圖表元素，也屬於形狀類型。
發佈並開啟網頁後，從網頁原始碼裡，就會看見使用 SVG 呈現形狀元素 ( 參考「向量圖形 svg」 )。
影片
「影片」是使用網頁 video 元素所呈現的影片，只要在 Canva 設計專案中加入影片元素，都會使用這種方式呈現，點擊「播放」按鈕可以設定網頁載入時影片播放的方式。
注意，轉換成網頁的專案，無法使用「聲音」檔案。
發佈並開啟網頁後，從網頁原始碼裡，就會看見使用 video 標籤播放影片 ( 參考「播放影片 video」)。
如果使用 Youtube 應用程式加入 Youtube 影片，則會使用 iframe 的方式呈現 ( 參考「網頁中嵌入 YouTube 影片」 )。
小結
如果較為熟悉網頁 HTML 語法，則就更能掌握 Canva 發佈成網頁之後，各個元素彼此之間的運作原理，也更能做出漂亮精美的網頁囉。
意見回饋
如果有任何建議或問題，可傳送「意見表單」給我，謝謝～