一份 meta 標籤產生器速查表,是你在編寫 HTML 頁面 head 區段時會一直開著參考的簡短對照表:它列出你要填寫的三個欄位、工具強制執行的精確字元長度上限、套用的跳脫規則,以及複製回給你的精確標記區塊。Lizely 的 Meta Tag Generator 刻意遵循這個模式——它會產生一個小型、可稽核的 head 區塊,內含 UTF-8 字元集宣告、回應式 viewport、title 元素、description 中繼資料,以及選用的 author 中繼資料,僅此而已。Canonical 連結、robots 指令、Open Graph 屬性以及 Twitter Cards,各自住在不同的工具中,因為它們各自編碼不同的頁面決策,正如 WHATWG HTML 語義規格所組織的方式。把速查表範圍縮窄,意味著你貼上的區塊短到可以逐行檢視,並能找出後續由佈景主題、外掛或框架所新增的衝突。本文其餘部分會逐步說明輸入內容、長度限制、精確輸出、四步驟工作流程,以及讓該區塊成為真實頁面可用一部分的部署後檢查。

三個輸入欄位及其長度限制
這個表單只詢問三件事,別無其他。其中兩個為必填;一個為選填,只有在網站為其維護一個具意義的值時才值得填入。
| 欄位 | 必填 | 最大長度 | 去除空白 | 控制字元 |
|---|---|---|---|---|
| Title | 是 | 200 | 是 | 拒絕 |
| Description | 是 | 500 | 是 | 拒絕 |
| Author | 否 | 120 | 是 | 拒絕 |
title 欄位在 HTML 標準中代表文件標題或名稱——也就是瀏覽器在分頁、書籤以及其他介面區域所顯示的文字。搜尋系統在建構結果標題時,可能會把該元素當作一項輸入,但根據 Google 的標題連結指引,顯示出來的連結可能會從頁面上的其他文字改寫而來。description 欄位是一段簡短的頁面摘要,某些消費者會將其顯示在標題下方;它並非保證一定會出現的搜尋摘要,因為搜尋系統可以選擇改用其他可見文字。author 欄位僅描述作者身分的中繼資料;它並非經驗證的身分、著作權聲明、rel="author" 的替代品,也並非結構化資料,當網站並未為其維護一個具意義的值時,你應該省略它。
輸出區塊:實際會產生的內容
複製出來的區塊是一段固定、由最多五行組成的序列。每一行會在一次複製到剪貼簿的動作中產生,排版上方便閱讀,但會以單一可稽核的字串形式輸出。
| 順序 | 標籤 | 值 | 條件式 |
|---|---|---|---|
| 1 | meta charset="utf-8" | 固定 | 永遠 |
| 2 | meta name="viewport" | width=device-width, initial-scale=1 | 永遠 |
| 3 | title | Your document title | 永遠 |
| 4 | meta name="description" | Your page description | 永遠 |
| 5 | meta name="author" | Your author name | 僅在有提供 author 時 |
viewport 那一行固定為 width=device-width, initial-scale=1。工具絕不會加上 maximum-scale 或 user-scalable 限制,因為這些可能會損害無障礙性,而回應式行為仍然取決於 head 區塊之後的 CSS、媒體查詢以及元件層級的工作。charset 那一行會在任何文字中繼資料之前輸出,讓瀏覽器從第一個位元組起就將 title 與 description 以 UTF-8 解析,而伺服器回傳的 HTTP 回應必須與該宣告一致。
如何透過四個步驟產生區塊
- 在現代瀏覽器中開啟 Meta Tag Generator,輸入一個精確的文件標題、一段簡潔的頁面描述,以及一個選填且有持續維護的作者姓名。每個值在輸入時都會去除空白,因此前後的空白字元不會計入字元長度限制。
- 點擊產生動作,將已跳脫的基本 head 區塊複製到剪貼簿。輸出為單一可稽核的字串,不會混雜任何重複的專門中繼資料。
- 將該區塊貼到目標 HTML 文件的 之中。請勿將其當作可見的 body 文字貼上,也請勿貼到會對標記進行第二次跳脫的編輯器中,因為雙重跳脫會把 & 號再變回實體。
- 重新載入頁面,檢視實際送出的原始碼,並移除任何由佈景主題、SEO 外掛、框架或部署平台所注入的重複 title、description 或 author 中繼資料。這個產生器是語法輔助工具;真正的稽核發生在貼上之後。
處理過程完全在瀏覽器中進行,不會將任何文字傳送給 Lizely,因此你輸入的內容從未離開你的機器。這使得即使是在處理尚未上線頁面的草稿內容時,速查表仍可放心遵循,而複製出來的區塊是一個固定的起點,你可以交給同事進行審閱。
跳脫與編碼規則
每個文字值在出現在複製出來的區塊之前,都會針對其 HTML 內容進行跳脫。& 號與角括號會編碼為實體,而引號則會在任何可能影響屬性值的地方進行編碼。控制字元會直接遭到拒絕,而不是悄悄地被刪除,因此貼上的描述中若有夾帶的換行字元或空位元組,會以驗證錯誤的形式浮現,而不是毀損輸出。UTF-8 宣告必須放在實際文件 head 中較前面的位置,而伺服器的 HTTP 回應不得宣告衝突的編碼,因為瀏覽器會採用它所看到的第一個編碼宣告。這個產生器無法檢查 HTTP 標頭、模板佈局,或在 CMS 插入片段之後的位元組位置,因此編碼檢查發生在伺服器端與部署後的原始碼中,而不是在工具本身之中。八個有標準背後依據的測試案例涵蓋了精確的 charset、viewport、title、description 與 author 形式,加上 & 號、屬性引號以及角括號的跳脫,並透過負面測試拒絕缺少必填欄位、數值過大以及控制字元的情況。
速查表未涵蓋的內容
範圍的縮窄本身就是特色。Canonical 連結、robots 指令、Open Graph 屬性以及 Twitter Cards,各自表達一個獨立的頁面決策,而且在 Lizely 上各自有專屬的工具。把所有詞彙混進同一個冗長的表單,容易複製到互相矛盾或不相關的標記,而產生的區塊也會更難逐行稽核。Meta Tag Generator 僅處理可以一起檢視的基本文件中繼資料,因此本工具的速查表就止於 charset、viewport、title、description 與 author。它也不會衡量關鍵字品質、像素寬度、點擊率或搜尋需求——那些是內容與產品層面的問題,而不是語法驗證。這個工具不會擷取即時頁面、不會更新 CMS、也不會發布變更;它產生的是正確的起始語法,並信任部署步驟能將其正確整合。
部署之後:稽核已貼上的區塊
一旦區塊就定位,稽核工作就從產生器轉移到瀏覽器與伺服器。檢視頁面原始碼,確認文件中有恰好一個 元素、一個 標籤,以及最多一個 標籤,然後移除任何由 CMS 或外掛在片段之上額外加入的重複項目。以行動裝置寬度檢視頁面,確認版面 viewport 如 viewport 那一行所預期地遵循裝置寬度,並在重新檢索後使用你平台的搜尋控制台檢查工具,確認已部署的 title 與 description。關於將區塊放入既有模板的實作逐步說明,請參閱 如何將基本 meta 標籤放入你的網站 head 之中,該文會從本速查表結束的地方接續下去。請將複製出來的區塊視為正確的起始語法,而非索引、排名或任何特定搜尋摘要的保證——搜尋系統仍然可以從送出的頁面中選擇其他可見文字。
想深入了解,請參閱 免費無註冊 Htaccess 產生器:瀏覽器即時輸出。