Screens · T2 截圖走查 · 網站建置・設計稿・搬遷

官網搬遷/平台脫鉤:200 多頁靜態鏡像,零外連、零破圖

品牌官網原本掛在一個電商平台上,想離開又怕網站中斷。做法:整站爬下來做成靜態鏡像,逐頁做視覺回歸比對,確認像素級一致才切換。這裡放的是「平台上的原站」與「靜態鏡像」的逐頁對照縮圖,加上驗收數字。

網站搬遷靜態鏡像視覺回歸SEO 轉址零停機

素材:搬遷工程的自動比對截圖(左:原平台,右:靜態鏡像)。去識別化:整站是客戶品牌,所以只用縮小模糊後的對照圖看版面一致性,數字取整。

01

首頁:原站 vs 鏡像

整頁長圖逐區塊比對,橫幅、商品格、頁尾都一致。

首頁:原站 vs 鏡像
02

商品頁

圖片、規格、購買區塊完整保留;原本平台的購物車改指向新的下單方式。

商品頁
03

商品集合頁

分類列表與排序版面一致。

商品集合頁
04

分類頁

側欄與網格一致。

分類頁
05

部落格/文章頁

文章列表、內文、相關文章全數搬過來。

部落格/文章頁
06

一般頁面

關於我們、條款等靜態頁。

一般頁面

驗收數字(取整)

項目結果說明
預期頁數200 多頁從 sitemap 與站內連結展開
成功鏡像100%缺頁 0
靜態資產300 多個檔案、約 40 MB圖片、字型、CSS、JS 全部本地化
破圖0逐頁檢查 img/背景圖
內部死連結0帳號、購物車等平台功能頁改為新入口
外部依賴0不再載入原平台任何資源

流程

1. 爬取   :以真實瀏覽器逐頁載入,含延遲載入的圖片與字型
2. 本地化 :所有資產下載到本機,路徑改寫;外部 CDN 一律移除
3. 改寫   :帳號/購物車等平台功能連結改指向新流程
4. 比對   :每頁在相同視窗尺寸截圖,視覺回歸逐張比對
5. 上線   :靜態託管(Cloudflare Pages),舊網址 301 轉址、sitemap 重送
6. 切換   :DNS 切換前先用 hosts 驗證,切換當天零停機