核心要點

  • Claude Skill 是由 Benchmark Email 提供的免費下載資源。你可以從 Benchmark 的 HTML 電子郵件代理頁面取得，該頁面連結至 GitHub 上的 Skill，隨後即可將其新增至你自己的 Claude 帳號中。
  • 您應該在 Claude 中使用此 Skill，而非在 Benchmark 內部。無論是在桌面應用程式或網頁版，只要在 Claude 的「Settings > Skills」下將其上傳一次，之後在任何新的 Claude 對話中都能直接使用。
  • 詳細的需求說明能獲得效果更好的郵件。請提供你的目標、品牌顏色、標誌、連結及關鍵細節給 Claude。該 Skill 會將這些資訊轉化為符合電子郵件規範、且在收件匣中不會跑版的 HTML Code。
  • 將結果貼入 Benchmark 的自訂 HTML 編輯器。複製 Claude 生成的 HTML，或是上傳它給您的檔案，接著新增合併標籤並照常發送即可。
  • 沒有使用 Claude？HTML 電子郵件代理頁面也提供了一段 Prompt（提示詞），適用於 ChatGPT、Gemini、Perplexity、Copilot 等其他 AI 助手。

 

過去製作自訂的 HTML 電子郵件，意味著必須手動編寫基於表格（table-based）的原始碼、對抗 Outlook 的渲染怪癖，而且花在除錯上的時間往往比設計還多。對大多數行銷人員來說，這足以成為一道門檻，以致他們寧可繼續使用拖曳式模板，將客製化工作交給別人處理。

Benchmark Email 的 Claude Skill 讓這件事變得更簡單。您只需要在 Claude 中設定一次，之後只要描述您想製作的電子報，就能取得可直接寄送的 HTML 郵件內容，再貼入 Benchmark 即可直接發送。

本篇文章將帶您了解如何安裝、使用，並發揮它的最大效益。

什麼是 Benchmark 的 Claude Skill？

Claude Skill 是一套封裝好的指令與規則組合，您可以將其新增至 Claude 帳號中，讓 Claude 在執行特定任務時調用它。Benchmark Email 針對 HTML 電子郵件打造了這項工具，它賦予了 Claude 寫出符合規範、且在收件匣中不會跑版所需的工具與規則。

此 Skill 存在於您的 Claude 帳號中，而非 Benchmark 內部。您需在 Claude 中撰寫電子郵件，接著再將完成的 HTML 檔案匯入 Benchmark 的編輯器中發送。

由於它是專為電子郵件設計的，因此會考量一般網頁不必擔心的因素，例如不同收件匣和電子郵件客戶端顯示 HTML 的方式。您可以利用它來：

  • 根據需求說明製作完整的範本
  • 調整顏色、字型與版面配置
  • 新增或刪除區塊
  • 提供 A/B 測試所需的不同版本

所有操作都可以直接用一般文字與 Claude 對話來完成。

如果您的團隊使用的是不同的 AI 助手，HTML 電子郵件代理頁面上也提供了一段適用於 ChatGPT、Gemini、Perplexity、Copilot 等工具的提示詞（Prompt）。本指南則將重點介紹 Claude Skill。

步驟教學：使用 Claude Skill 製作 HTML 電子郵件

以下是一段關於如何使用 Benchmark Email 的 Claude Skill 功能來製作 HTML 電子郵件的影片教學。

為求更清晰易懂，以下列出具體步驟。

步驟 1：從 Benchmark 的 HTML 電子郵件代理頁面下載 Skill

前往 Benchmark 的 HTML 電子郵件代理頁面並點擊 Get Skill。這會將你引導至 GitHub。不用擔心，GitHub 不僅僅是給開發者用的，您只需要在該頁面上點擊 Skill 連結，檔案就會自動下載到你的電腦中。

步驟 2：將 Skill 上傳至 Claude

開啟 Claude（桌面應用程式或網頁版皆可）。前往 Settings > Skills 並選擇上傳 Skill，接著將剛下載的檔案拖曳進去。安裝完成後，你就會在 Skill 清單中看到 Benchmark HTML 電子郵件 skill。

此操作只需執行一次，之後無論何時需要，都可以直接使用該 Skill。

步驟 3：開啟新的 Claude 對話並提供您的需求說明

在 Claude 中開啟一個新的對話，要求它使用 Benchmark Email skill 來草擬一封新的 HTML 電子郵件，接著貼上您的需求說明。輸入的內容越詳細，產出的效果就越好，因此請盡可能提供更多資訊：

  • 郵件目的：這是促銷活動、電子報、產品發布還是歡迎郵件？
  • 具體細節：優惠內容、活動計劃或故事，以及您想包含的任何連結、QR Code 或圖片。
  • 品牌資訊：品牌顏色（最好提供 Hex 色碼）、字型，以及何處可以取得你的標誌（檔案連結或網站網址）。
  • 需要的區塊與順序：排出你想要的區塊順序，或者讓 Claude 為你建議版面配置。

如果您已經在 Claude 帳號中設定了品牌指南或標誌檔案，也可以在需求說明中直接指引 Claude 使用。

提示詞（prompt）範例：

「請使用 Benchmark Email skill 草擬一封新的 HTML 電子郵件。需求說明：我們是一間在地咖啡店，正在推廣『Love Your Neighbor』拿鐵計劃，每售出一杯拿鐵，部分收益將用於支持在地非營利組織。請使用我們的品牌顏色（#4A2C2A 與 #F5E6D3），從 [網站網址] 抓取我們的標誌，包含一個連結至 [網址] 的 CTA 按鈕，並加入來自 [頁面網址] 的 QR Code。文案應保持溫暖且以社區為導向。」

Claude 可能會請求存取您所指定的頁面或檔案的權限，請選擇核准，以便它能擷取所需的資料。

步驟 4：在 Benchmark 中開啟自訂 HTML 編輯器

Custom HTML Editor

當 Claude 在草擬信件時，您可以同步準備 Benchmark。在你的 Benchmark Email 帳戶中，前往「郵件列表」>「+ 建立新郵件」並選擇「自訂 HTML」。您會看到兩個選項：

  • 從頭開始：直接在編輯器中編寫或貼上您的 HTML 原始碼。
  • 上傳檔案：如果您的 AI 助手提供一個 HTML 檔案，可以直接拖放至此。

步驟 5：在 Claude 中查看並最佳化

當 Claude 完成後，它會提供您可以複製的 HTML 原始碼、可下載的檔案，或兩者皆有。請查看預覽畫面並檢查：

  • 架構是否符合您的需求說明？
  • 顏色、連結與圖片是否正確？
  • CTA 按鈕是否醒目？

如果標誌在 Claude 的預覽中顯示異常，請不用擔心；一旦將 HTML 原始碼帶入 Benchmark 的編輯器後，通常就能正常顯示。

如果需要修改，只需在同一個對話中告訴 Claude 即可，不需要重新開始：

  • 「將標題字型大小放大至 32px。」
  • 「將按鈕邊框半徑改成 6px。」
  • 「在主視覺圖片下方新增一個兩欄區塊，左側為圖片，右側為文字。」
  • 「將頁尾簡化，僅保留取消訂閱連結與公司地址。」

Claude 也能協助撰寫文案：「請為這封電子郵件提供三個郵件主旨選項。」

步驟 6：貼入 Benchmark 並新增合併標籤

複製最終的 HTML 原始碼並貼入自訂 HTML 編輯器中，或直接上傳檔案。

接下來，新增您的合併標籤。由於合併標籤對每個 Benchmark 帳號來說都是獨一無二的，因此該 Skill 無法自動為您加上。請使用 HTML 編輯器插入像是「名字」等標籤，並設定預設值，這樣即使聯絡人的欄位為為空白時，郵件內容讀起依然自然流暢。

步驟 7：完成檢查清單並發送

點擊「儲存並繼續」並完成 Benchmark 的常規電子郵件檢查清單：選擇你要發送的聯絡人名單、新增郵件主旨與預覽文字，並設定寄件者資訊。發送測試郵件給自己，並在 Gmail、Outlook 以及手機上進行檢查。一切確認無誤後，即可準備發送！

取得更好成效的技巧

  • 背景資訊越詳盡，產出效果越好。該 Skill 在搭配詳細的需求說明時發揮的效果最佳。請分享優惠的真實細節、連結與圖片，以及品牌規範，不要讓 Claude 用猜的。
  • 對品牌細節務必精確。對不同人來說，「藍色」可能有不同的理解。像是 #0033CC 這樣的十六進位色碼能給予 Claude 精確的依據，讓您第一次嘗試就能獲得非常接近理想的結果。
  • 引導 Claude 至你的資料來源。提供網站或著陸頁的連結，Claude 便能直接擷取標誌、圖片與活動細節。
  • 不只用於初稿，更能用來生成不同版本。當您獲得一封可用的電子郵件後，可以要求 Claude 提供 A/B 測試版本，例如更換 CTA 顏色、精簡版內容，或是移除主視覺圖片。
  • 當畫面顯示異常時，詢問原因。如果某個區塊顯示效果不如預期，可以將該段程式碼貼給 Claude 並詢問：「這個區塊在 Outlook 中無法正確居中，原因為何？該如何修復？」

常見問題

Claude Skill 是內建在 Benchmark Email 裡的嗎？

不是。您需要將 Skill 新增到自己的 Claude 帳戶中。你可以從 Benchmark 的 HTML 電子郵件代理頁面（託管於 GitHub）下載它，在 Claude 的「Settings > Skills」中上傳，並在 Claude 內部使用。完成後，再將產出的 HTML 原始碼貼入或上傳至 Benchmark 的自訂 HTML 編輯器。

我需要有 Claude 帳戶才能使用這個工具嗎？

需要。該 Skill 是在 Claude 中運作，因此你需要一個 Claude 帳戶（桌面應用程式或網頁版皆可）。如果您使用其他的 AI 助手，HTML 電子郵件代理頁面也提供了適用於 ChatGPT、Gemini、Perplexity、Copilot 等工具的 提示詞（Prompt）。

我需要懂得如何使用 GitHub 嗎？

不需要。GitHub 只是存放 Skill 檔案的地方。點擊 Skill 連結，檔案就會下載到您的電腦中，您在 GitHub 上需要做的就只有這樣。

Claude Skill 也能順便撰寫電子郵件文案嗎？

可以。您可以要求 Claude 在同一個對話中撰寫內文、CTA 文字以及郵件主旨選項。當您的需求說明包含關鍵細節與核心訊息時，效果最好。

為什麼我必須自己新增合併標籤？

每個 Benchmark 帳戶的合併標籤都是獨一無二的，因此 Skill 無法自動新增正確的標籤。當您將 HTML 原始碼貼入 Benchmark 的編輯器後，再手動插入像名字等合併標籤，並設定預設值即可。

如果我已經有想使用的 HTML 模板該怎麼辦？

您可以將現有的 HTML 原始碼貼給 Claude，並要求它進行修改。例如，您可以新增一個區塊、修改顏色或修復顯示問題。

生成出的 HTML 原始碼相容於所有郵件用戶端嗎？

該 Skill 產出的 HTML 原始碼符合電子郵件規範，不會在收件匣中跑版。不過在發送給全部聯絡人之前，先發送測試郵件並在 Gmail、Outlook 和 Apple Mail 中進行檢查，仍然是個良好的做法。

哪些類型的電子郵件最適合這種工作流程？

任何需要自訂、具備品牌視覺風格版面的電子郵件都很適合，例如促銷類電子報、產品發布、專案或活動宣傳、節慶優惠，以及包含圖文區塊的電子報。

關於作:

Allie Wolff | VP Product Marketing

VP Product Marketing | Product, marketing, email | Allie Wolff is VP of Product Marketing at Benchmark Email, where she drives measurable product growth through compelling positioning, messaging, and go‑to‑market strategies. With over 18 years of expertise spanning B2B SaaS and email marketing, she’s spearheaded landmark initiatives—from the Canva integration to the rollout of Smart Content—bringing clarity and impact to busy marketers everywhere .