所見即所得編輯器（WYSIWYG）是什麼？網站後台編輯器的種類與 3 個使用重點

所見即所得編輯器（WYSIWYG，What You See Is What You Get）是網站後台最常見的內容編輯工具：在編輯畫面看到的樣子，就是發布到網站上的樣子。不需要懂 HTML，也能像用 Word 一樣，直接在後台設定標題、粗體、插入圖片與表格。

這篇說明所見即所得編輯器是什麼、和其他編輯方式的差別、使用時最常遇到的問題，以及我們的網站後台提供哪些編輯器。

所見即所得編輯器是怎麼運作的

網頁的內容，實際上是用 HTML 這種標記語言寫成的。例如一段粗體字，背後其實是 <strong>粗體字</strong>。

所見即所得編輯器做的事，就是讓你用按鈕操作，由編輯器在背後自動產生對應的 HTML。你按下「粗體」，畫面上的字變粗，編輯器同時把那段字包上 <strong> 標籤；存檔時，存進資料庫的是這段 HTML，網站再把它顯示給訪客。

大多數編輯器也提供「原始碼」模式，可以直接看到、修改背後的 HTML。

常見的網站內容編輯方式

所見即所得編輯器的優點

• 上手快：操作方式和文書軟體類似，不需要學程式
• 內容可以自己更新：最新消息、產品介紹、活動公告，不必每次都請廠商修改
• 格式比較一致：標題、清單、表格都用編輯器的功能產生，網站的樣式會統一套用

使用時最常遇到的 3 個問題

一、從 Word 直接貼上，格式全亂了

從 Word 或網頁複製貼上時，會連同一大堆隱藏的格式一起貼進來，造成字型、字級、行距和網站其他地方不一致，手機上也可能跑版。貼上時請使用「貼上為純文字」，或先貼到記事本再複製一次，然後用編輯器重新設定格式。

二、用「放大加粗」代替標題

把字放大、加粗，看起來像標題，但對搜尋引擎來說只是一段普通文字。段落標題要用編輯器的「標題」功能（標題 2、標題 3），搜尋引擎才看得懂文章的結構，對 SEO 也有幫助。

三、圖片太大或沒有替代文字

直接放上相機拍的原始照片，檔案動輒好幾 MB，會讓網頁變慢。上傳前先把圖片縮小，插入時記得填寫「替代文字」（alt），說明這張圖片的內容。

更多操作細節與常見狀況，見後台編輯器怎麼用？貼上、排版與常見問題。

我們的網站後台提供哪些編輯器

NC 網頁設計製作的網站，後台可以依需求選用不同的編輯器：

• TinyMCE 所見即所得編輯器：功能完整，可以設定標題、清單、表格、插入圖片與影片，適合大多數的內容編輯
• 簡易標籤編輯器：介面單純，適合只需要基本格式的欄位

後台可以管理哪些內容，見後台管理系統是什麼？能改什麼、不能改什麼；規劃網站時哪些內容該做成可以自己管理，見哪些內容需要做成後台可自行管理？

想要一個自己就能更新的網站？

如果你目前的網站每改一個字都要請廠商處理，歡迎參考我們的客製化網站設計服務，或直接與我們聊聊。