TechMoon 科技月球
WordPress、SEO 與 AI 工具實測指南
TechMoon 科技月球
WordPress、SEO 與 AI 工具實測指南

水印寶是 MIT 開源的線上文字浮水印工具,實測圖片全程不出瀏覽器,54 個請求無一外傳影像,5MB 與 JPG/PNG 限制如原始碼生效;但輸出就是預覽畫布,最長邊固定 800px。本文攤開實測數據、800px 的原始碼源頭,與適合及不適合的需求。
用 AI 摘要這篇文章:
先把結論擺前面。水印寶常被問到的問題是「圖片會不會被上傳」,這件事它兌現得很乾淨:我開著網路側錄跑完上傳、編輯、存檔的全程,54 個請求裡沒有任何一個帶著影像資料離開瀏覽器。但存檔那一刻有另一個代價,輸出檔的最長邊被釘在 800px,一張 1600×1200 的照片存下來只剩 800×600。它是一款給「要貼上網的圖」用的浮水印工具,不是給攝影原圖或電商主圖用的。
工具本身很小:開源、免費、MIT 授權,作者是獨立開發者 Chiloh,官網 watermark.chiloh.cn,原始碼放在 GitHub 上的 watermark-tool 存放庫,累積 86 顆星。介面只有簡體中文,功能也只做一件事,在圖片上疊文字浮水印。官網首頁用三張卡片介紹自己:「本地處理」、「開源免費」、「簡單高效」。前兩張卡我都能用實測與原始碼背書,第三張也成立,只是三張卡都沒有提到輸出解析度,而那正是最該被寫在第一張卡上的規格。

實際操作是三步:把圖拖進頁面中央的虛線框,在輸入框打上要疊的字,按下保存圖片。我丟進去的是一張 1600×1200 的 PNG,打上測試字樣,樣式選斜向平鋪,畫布上的預覽跟著每一次調整即時重畫。預設值開出來就是能直接用的組合:角度 335 度的斜向、透明度一半、字號 16px、行列間距 24px,不動任何滑桿按保存,出來的就是教科書裡那種斜向滿版浮水印。要微調的話,透明度、字號、角度、間距四支滑桿一拖就生效,色彩另外有色票與色碼可以填。按下保存,瀏覽器直接存檔,檔名固定是 watermarked-image.png,中間不需要註冊或留信箱,也沒有跳出任何付費引導。

側錄的結果比官網的宣稱更有說服力。整個過程一共發出 54 個請求,絕大多數是網頁自己的靜態資源,帶資料的 POST 只有 3 次,全部指向同一個位址,也就是開發者自己網域上的自架統計服務。對照原始碼會發現這個結果一點都不意外:整個專案沒有任何後端介面,圖片用瀏覽器的 FileReader 讀成本地物件,在 Canvas 上繪製,匯出時再把畫布轉成 PNG,三段路徑都出不了這個分頁。浮水印工具這個品類裡,把處理鏈完整攤在原始碼裡給任何人檢驗的並不多,水印寶是其中一個。
官網卡片寫的「所有功能免費使用,無任何隱藏收費」,放在它身上比放在同類身上可信,原因在結構。上傳式工具每處理一張圖都在燒伺服器成本,所以遲早會長出點數牆、次數牆或解析度牆,免費額度本質上是行銷預算;水印寶的運算全在使用者的瀏覽器裡,站方付出的幾乎只有一個靜態網頁的流量,沒有需要計價的成本,免費就不需要理由,取消免費的動機幾乎不存在。
隱私的細線還是要畫出來。圖片內容確實不出門,但頁面本身載了一支統計腳本,站長看得到頁面的被使用量。這支腳本掛在開發者自己的網域上,屬於自架的流量統計,與把瀏覽行為交給第三方分析平台的做法是兩回事,多數人用起來感覺不到它存在。真的連被統計都不想要的人,後面有自己部署一份把它拿掉的辦法。
回頭量那個輸出檔。輸入 1600×1200,輸出 800×600,寬度砍了一半。翻原始碼會找到原因,而且原因只有一個常數:程式在把圖放上畫布之前,會先把它縮到最長邊 800px,這個上限寫在工具原始碼的圖片處理模組裡,是個一目了然的常數;存檔時再直接把這塊畫布轉成 PNG 下載,中間沒有回頭用原圖重繪一次。存下來的檔案就是螢幕上那塊預覽,800px 是預覽的規格,於是也成了輸出的規格。
這個數字換算成實際場景會更好判斷。聊天群組傳圖、部落格插圖、文件截圖這類用途都裝得下;以 1080px 為顯示基準的社群平台,800px 的圖會被平台略為放大,看起來會軟一點但不至於糊;相機直出的原圖動輒 4000px 起跳,存檔後只剩五分之一寬度,主流電商平台的主圖規格常要求 1000px 以上,800px 往往過不了關。麻煩的是,防盜圖的浮水印通常最該加在畫質最高的那份原圖上,解析度先被壓掉,保護效果就跟著打折,這是使用前最值得停下來想的一步。
輸入端的邊界我也各試了一次。丟 15.5MB 的 JPEG 進去,畫面提示檔案不能超過 5MB;丟 GIF,提示只接受 JPG 與 PNG 兩種格式。這兩條線跟程式碼裡的白名單完全一致,沒有寬限也沒有繞法。5MB 對手機拍的 JPEG 通常夠用,一張千萬畫素的照片多在 2 到 4MB 之間;會被擋的族群很明確,無損 PNG、高畫質輸出、掃描檔,以及 iPhone 直出的 HEIC,後者得先轉檔成 JPG 或 PNG 才進得來。輸出固定是 PNG,連檔名都不能改,一次也只能處理一張,批次作業在這裡不存在。
把解析度上限放回浮水印的工作流裡看,其實有一個剛好對得上的用法。正確的浮水印習慣本來就不是加在典藏原圖上,原圖該保持乾淨放在自己的硬碟與備份裡,要加字的是「要發出去的那份副本」;水印寶的角色就是把發布副本快速壓字,只要發布對象是網頁、群組、社群動態這類顯示尺寸有限的場合,800px 的上限就踩不到。反過來說,需要把高解析檔案本身外流的情境,例如交付給媒體或印刷的原檔,這個工具給的副本就不堪用,浮水印應該在原始工作流程裡處理,而不是事後在瀏覽器裡補。
與開大砲級影像軟體的分工也順著這個邏輯。Photoshop 或 GIMP 當然能做全解析度的文字或 Logo 浮水印,還能錄動作批次跑整個資料夾,但為了一張要貼上社群的圖開一次專業影像軟體,啟動與操作的成本遠高於任務本身;水印寶換到的是零啟動負擔,付出去的代價就是解析度與 Logo 能力。偶爾一張的輕量任務用瀏覽器,常態大批次的重活回桌面軟體,這個切法比「哪個比較強」有意義得多。
還有一個工作節奏要先知道:編輯狀態只活在頁面裡。沒有帳號就沒有工作區,重新整理或關掉分頁,圖與設定全部歸零,重來就是重新拖一次圖。對三步就能出圖的工具這不算缺點,但若打算一邊調一邊做別的事,先把成品存下來再離開頁面,會比相信分頁一直開著更穩。
功能面很快就能講完,因為它真的只有這些:一個文字輸入框、一組色彩設定、四支滑桿管透明度字號角度與間隔,加上斜向平鋪與置中單點兩種樣式。斜向平鋪的原理是把同一串文字沿著行列鋪滿整張圖,角度作用在整組文字上,間距決定行列的密度,透明度直接對應繪製時的不透明度。調法有兩個常見方向:要走低調路線,透明度壓到兩成上下、字號縮小、間距拉開,得到一層隱約但蓋滿全圖的標記,不搶畫面本身;要做成明確的署名或宣告,透明度拉高、換置中單點,一個大字樣放在正中央,誰拿走都看得到出處。色彩用淺灰或白色配深色照片、深灰配淺色照片,比純黑純白更不刺眼。深色模式有,重置鈕有,介面回應很快,就這樣。
輸出格式固定是 PNG,這個選擇有兩個實際影響。PNG 是無損格式,浮水印文字的邊緣不會再被二次壓縮弄糊,存檔就是最終樣貌;同時輸出檔保留了透明色版,我實測存下的檔案是帶透明層的 PNG,也就是說,若來源本身就是透明背景的 PNG(例如圖示、去背素材),加完字存檔後背景仍是透明的,不會被填成白底。要在去背素材上壓字再丟回簡報或網頁的人,這條路是通的。
對浮水印的期待也要設對。文字浮水印的價值是提高盜用成本,並在圖片被搬走時留下清楚的主張標記,它不是加密,遇到刻意裁切、修圖或後製塗抹仍可能被處理掉;斜向滿版之所以是主流,就是因為裁掉任何一塊都會帶走字樣,比單點落款更難被乾淨地繞過。把期待放在「讓順手搬運變得麻煩」,這類工具的效益才好衡量。
沒有的功能一樣先講明白:疊不了 Logo 或圖片浮水印,輸出格式沒得選,介面也沒有繁體中文。這幾條都是翻過原始碼與實際操作後確定沒有的,不是還沒找到入口。對只是要在分享出去的圖上壓字的人,這些都不構成問題;工作流裡有品牌 Logo 或批次需求的人,看到這裡就可以轉向了。
授權是這個工具最慷慨的部分。MIT 條款,個人使用、商業使用、修改、自己部署全部合法,授權檔與 GitHub 的判定都核對過。拿浮水印工具做正事的設計師或店家,最怕的就是輸出品的授權模糊,這裡沒有這個問題,加完浮水印的圖是自己的圖,商用不需要再問任何人。
專案的體質也查了一遍。存放庫 2023 年 10 月建立,當時還是純前端的傳統寫法;2026 年 4 月整個重寫成 Next.js 16 加 TypeScript,換成現在這套介面,浮水印渲染也順勢抽成了獨立的純函式模組;6 月初修掉一次相依套件的安全漏洞,月底更新了一次贊助說明。86 顆星、18 個 fork,存放庫裡唯一的一筆討論是作者自己修漏洞的合併請求。這是一個還活著的專案,同時也是一個完全由一個人撐著的專案,功能要不要長、漏洞什麼時候修,取決於作者的個人節奏,要把關鍵流程壓在它身上的團隊,這點要先放進評估。
真需要全解析度輸出,MIT 授權留了一條明路:那個 800px 的上限是一個常數,改大之後重新部署一份,就是屬於自己的版本。README 記了 Vercel 與 Cloudflare Pages 兩條部署路線,附現成的打包指令,官網本身跑在 Vercel 上,另外還備了一個 pages.dev 的站,部署出來的介面與官網同一套。要拿掉統計腳本也是在這一步順手完成。代價同樣具體:這份部署從此歸你維護,相依套件的安全更新要自己盯,6 月那次修漏洞就是最好的提醒,作者不再替你的副本把關。對大多數人更務實的順序是,先確認自己的圖 800px 裝不裝得下,裝得下就用官方站,裝不下再考慮這條路。
適合的場景很具體:社群貼圖加防搬運字樣、給客戶看的草稿先壓個字、網頁截圖標出處、部落格插圖落款。家長在社團分享孩子的生活照,想加個「請勿轉載」的字樣,這種圖片內容與標記需求同時存在的情境,用它是加分的組合,因為兩件事都在自己的瀏覽器裡完成,照片從頭到尾沒交給任何人。整套流程走完大概是這個節奏:開啟網頁、把圖拖進虛線框、打字、掃一眼預覽確認字樣落在想要的位置、按下保存圖片,下載資料夾裡就是成品,多數時候一分鐘內結束。這些用途的目標解析度本來就不高,800px 的上限碰不到,換到的則是不用註冊、圖片不出門的乾淨流程,臨時性的一次需求尤其省事,做完即走,不留任何東西在別人的伺服器上。
該繞路的也一樣具體。攝影原圖的交付保護、電商主圖的量產、需要疊品牌 Logo 的情境,這幾類都會撞牆,而且撞的位置不同:攝影與電商撞在解析度,Logo 撞在功能本身。替代路線站內都寫過,圖片要先縮放可以看 PicsResizer 的瀏覽器縮圖實測,要裁切用 CropImage,格式轉換有 ConvertTool。浮水印的需求若是「看不出來」的版權標記而不是嚇阻字樣,那屬於盲水印的領域,盲水印工具的介紹是另一個起點;要 Logo 與批次,往桌面軟體找會比線上工具快。
水印寶把一件小事做得可核對,這在浮水印工具裡不算常態。用它之前先確認一件事就好:要存的那張圖,800px 裝不裝得下。裝得下,它把隱私承諾做成了可以驗證的事實,開網頁就能用;裝不下,改原始碼自己部署,或者直接換工具,兩條路都比硬用來得合理。