把 QR Code 匯出成 SVG，而不是包了一層殼的點陣圖

01

檔案裡究竟裝著什麼

匯出的是一個 SVG 元素，帶有明確的寬高，以及以模組為單位量度的 viewBox。每個深色模組都是整數座標上的一個 1×1 矩形，三個定位圖形各自是獨立的形狀，因此圓角樣式與模組本身是方的、圓的還是點狀的互不相干。沒有任何部分是從點陣圖描出來的，因為它從來就不是點陣圖。

靜空區是畫布的一部分，而不是事後才想起的東西：viewBox 等於碼加上你選的留白，預設四個模組，最多可以到十六個。透明背景意味著根本不寫背景矩形，這正是它能直接放在有色紙上而周圍不帶白框的原因。

• 每個模組一個矩形，落在整數座標上
• 靜空區包含在 viewBox 之內
• 前景色與背景色是六位十六進位值
• 背景透明時不寫背景矩形

02

向量的關鍵在邊緣，不在檔案大小

掃描器讀的是深色模組與淺色模組之間的那條邊界。把一張小 PNG 放大，會讓每一條邊界都變糊，而糊掉的邊界就是含混的資料——這就是為什麼放大的碼會在某個尺寸上失敗，而同一個碼若以向量匯出，在同樣的尺寸上完全撐得住。SVG 根本就沒有解析度可以損失。

這也是一個檔案能應付所有版面的原因。放進喜帖的和放上海報的是同一份東西：印刷廠縮放它，模組的邊緣仍然停在圖形規定的位置上。

03

設計過的卡片在哪裡不再是純向量

裸碼從頭到尾都是向量。卡片在能是向量的地方就是向量——矩陣保持它的圖形，形狀、背景與漸層也仍然是形狀。

有兩樣東西過不了這一關。照片或上傳的標誌沒有向量形態，因此它以高解析度點陣圖的身分被裝在 SVG 裡一起走。文字仍然是活的文字，上面標著字型名稱，這意味著沒有那套字型的機器會換成別的字型，行寬隨之改變。當排版必須精確時，請在排版軟體裡做字，再單獨匯出碼。

匯出為 PDF 的卡片會被壓平成頁面上的一張高解析度影像——由照片構成的版面不可能是別的樣子——而 Mosaqo 在 A4 上的算圖精度遠高於 300 dpi，所以無論如何都可以直接付印。以圖形身分抵達頁面的，只有裸碼，不論它是 SVG 還是 PDF。

• QR 矩陣：向量圖形
• 上傳的照片、標誌與貼紙：嵌入的點陣圖
• 文字：活的文字，所以要嘛隨附字型，要嘛在排版軟體裡做字

04

PNG 與 PDF 匯出各自的用途

螢幕、電子郵件與簡報，PNG 是對的答案——這些地方只放一次，而且尺寸你已經知道。匯出時給足大小，之後絕不再放大。

PDF 是同一份圖形落在頁面上：碼被畫出來而不是被點陣化，置中放在 A4 上，可以直接列印，也可以就這樣交給別人。它同樣沒有解析度，所以放大頁面只會放大碼，不會讓任何一條邊變軟。當碼要進入別人掌控的版面、以只有他們知道的尺寸出現時，請改送 SVG。

05

改色與擺放這個檔案

因為檔案本身是文字，顏色不必打開設計軟體就能改：模組的填色是你選的前景色，背景矩形是背景色。請保持慣常的方向——淺底深模組。反白的碼有不少掃描器讀得到，但不是全部，這讓它在任何印刷品上都成了一場賭博。

擺放檔案時，讓靜空區保持乾淨，並抵住那些會讓邊緣變軟的效果：陰影、混合模式、壓在繁複畫面上的透明度。站在照片上的碼之所以失敗，和一個糊掉的碼是同一個道理。

06

測試你匯出的檔案，而不是預覽圖

打開匯出的 SVG，按最終尺寸放進真正的版面，在真實紙張上印一張，然後用兩支不同的手機，在讀者實際會拿著它的距離上，在這個位置真實擁有的光線下掃一掃。

編輯器在你工作時就會檢查對比、靜空區與資料密度，這些檢查能在付印之前擋下大部分問題。它們看不見的是上光、摺頁，以及房間裡的光。