Web、UI與CSS

整理 URL 後製作分享用 QR Code

使用工具

QR Code 能掃卻目標錯誤，仍達不到目的；URL 正確但裁掉留白或印太小，也可能讀不出。將網址內容檢查與影像讀取分開，便於定位應改哪一步。先用 example.com 虛構資料，只檢查字串而不存取。

輸入範例後可見 hostname 為 example.com、連接埠 8443、路徑 /catalog，查詢和 fragment 分開顯示。結構化比從長串裡找網域更清楚。工具不傳送請求，因此不確認伺服器存在、憑證有效或頁面已發布。

僅作說明、不存取的 URL

https://example.com:8443/catalog?tag=book&tag=gift&q=red+bag#details

https://example.com@other.example/path 中 @ 前是使用者資訊，真正 hostname 是 other.example，不能憑開頭熟悉名字判斷。印刷 QR 會把字串交給所有可讀取者，應避免放使用者名稱、密碼或秘密認證值。

tag 出現兩次，依次是 book、gift，解析會保留順序。附加增加值，設定則替換該鍵的值。接收方取首個、末個還是全部，取決服務協定，工具不能推斷唯一答案。

表單式查詢把 q=red+bag 讀成 red bag，字面加號需區分 %2B。編輯重建可能改變編碼寫法，即使含義一樣也會改變簽章 URL 位元組，因此不要隨意正規化或排序，先檢查重建結果再產生 QR。

將確認後的 URL 以尺寸 320、容錯 M、留白 4 產生。工具只編碼字串，不存取目標，成功不代表網站安全。掃碼測試時盡可能先查看解碼網址，再決定開啟，核對網域、路徑和參數。

周圍留白用於將符號與環境分開。留白 4 是四個模組寬，不是整圖四像素。裁切或緊貼邊框會改變產生時條件，最終排版和列印也要保留留白。

長參數增加編碼量，相同寬度容納更多模組時每格更小。提高容錯也可能需要更多空間，不保證更易讀。先檢查真正不必要的 URL 資料，再保留必要內容並調整尺寸與使用條件。

放大螢幕預覽能讀，不等於紙上小碼可讀。應按最終尺寸、列印品質、距離、照明和裝置測試。SVG 易縮放，但變形或裁切仍會出問題；不要把容錯當成可隨意蓋標誌的許可，先確認無裝飾時可靠讀取。

審核時把預期 URL、產生設定和最終排版圖片放在一起，檢查是否改網址後仍用舊圖，或遺留校樣網址。短連結還涉及控制權和未來轉址變化，工具不會保證這些營運條件。

需要確認目標已公開時，應另行以獲授權的一般瀏覽器操作檢查。解析和產生是不連網的準備工具，目標可達性與內容是另一項工作，可避免一輸入就存取陌生網站。

產生成功、掃碼有反應不證明網址正確，路徑錯字或缺參數也會被忠實編碼。先核對解出的主機、路徑和參數再跳轉。SheepDev 不存取目標，因此不驗證公開狀態或權限。

紙本分發應按實際尺寸列印，檢查靜區裁切、反光和模糊。更高錯誤修正並非萬能，仍與密度相關。長 URL 小尺寸會使模組細小。縮短輸入應先選受控正確 URL，而非自動引入未知短網址服務。

列印後內容不會因想改目的地而自動更新。管理重新導向需另行設計，工具不發轉址 URL。可附可讀說明或網址給無法掃碼的人。保留源字串、圖片和實物掃碼確認，避免混用版本。