在對一個網站做SEO診斷時,網站上的4XX頁面是個不可或缺的一環,提供一份報告指出一個網站有哪些無效的連結、以及這些連結出現在那些頁面是剛接觸到客戶的起手式之一。這篇文章要教大家如何使用Screaming Frog這個強大的SEO工具來找出網站上無效的連結。
如果你熟悉Screaming Frog這個軟體,也許會想 “咦,阿不就把網址丟進去就會跑出來了嗎?”,是這樣沒錯,但是有一個很常被忽略的點是301 redirect,有時候爬完的結果會顯示連結被重定向到其他網頁,而該網頁被再一個301 redirect到404的頁面,這就是所謂的redirect chain,這種類型的404頁面就不是這麼的顯而易見。
如果你沒聽過或是不熟悉Screaming Frog,它是個爬蟲工具。輸入一個網址(ex. www.darrenhhuang.com),這隻青蛙就會跟隨網站上的連結開始爬你的網站,然後回傳給你蒐集到的一切資料,包括每個網頁的title/description、圖片的alt tag和size、以及上面提到的每個連結出去後回傳的server code….等,相當的實用。文末會再稍微多介紹一下這個產品,以後也會有更多的文章來寫它在實務上的應用。
前言
這篇文章用台灣新創競技場的網站(http://www.startupstadium.tw/)作為示範,並沒有甚麼特別原因,只是偶然看到他們的網頁,然後很喜歡他們在做的事情,當然,如果能幫助他們修復網站上的一些小缺陷、提高用戶體驗就再好不過了!
直接404頁面
- 將網站丟入Screaming Frog後,讓它爬
- 右側可以選Response Codes為4XX的頁面,這裡可以看到有17個不存在的頁面被找到
- 左側會出現這17個頁面的URL和一些其他資料
- 接下來去Bulk Export > Response Codes > Client Error (4xx) Inlinks將”這些頁面以及他們從哪裡被連過來”匯出”。
- Destination: 告訴你哪一個網頁是不存在的
- Source: 指的是這個不存在的網頁是哪startupstadium的哪一個網頁被找到
- Type: 為該連結的種類,是連結無效(HREF)或是引用的圖片不存在(IMG),或其他原因。
藉此我們就可以找到網站上已經失效的連結並修復!
間接404頁面 (Redirect Chain to 404s)
找完直接顯示404 error的頁面後,接著要找的是容易被忽略的間接404頁面。像文章開頭說的,這類型的連結之所以不明顯,是因為在screaming frog這種crawler tools裡不會直接告訴你這些連結的server code是4XX,而只會告訴你它們被3XX重定向到其他地方去了。
至於重定向到哪裡? 可能是一個200頁面、可能是一個404頁面、也有可能是再一個301頁面然後接一個404頁面。
- 一樣先丟入網址,然後右邊選Redirects(3XX),可以看到有151個
- 左邊會出現這151個回傳3XX server code的連結資料
- 接著選上面的Export匯出資料,會看到這些連結會被重定向到哪裡
- 把A欄的這堆URL選起來,回到Screaming Frog上,將模式切換成”List Mode”,然後貼上
- 到Configuration->Spider->Advanced->Always Follow Redirects 給它打勾,然後就可以按start開始跑
- 跑完以後到 Reports->Redirect Chains匯出表格
- 匯出以後會看到一個長得像下圖的excel檔案,這裡可以看到:
- 第47列的連結301跳轉到另一個回傳404的網址
- 第51列的連結301跳轉到一個再一次301跳轉到一個回傳200的網址
- 接著再交叉比對步驟3匯出的資料,就可以看出哪些3XX連結其實是404頁面!
補充1: Server Code
這篇文章有時候用4XX、3XX,有時候又用404、301,希望沒有造成太多困惑! 這邊的3個數字代表的是當我們向伺服器要求一個連結的時候得到的伺服器代碼:
- 200代表一切正確無誤
- 3XX代表重定向,我們要求的A連結已經搬家到B連結
- 4XX代表客戶端的錯誤,我們要求的連結不存在
- 5XX代表伺服器端的錯誤,表示伺服器沒有辦法回應我們的請求
每個伺服器代碼又有不同種類,301, 302, 403, 404, 410…等等,為了閱讀的流暢性我把他們混著用,當我說301其實指的是所有類型的跳轉(3xx),說404其實指的是所有類型的客戶端錯誤(4xx)~
補充2: Screaming Frog
這個尖叫青蛙是在SEO界無人不知無人不曉的工具! 免費版本只能爬500個連結,付費版則是149英鎊一年。除了本文說的找到broken links以外,它還可以…
- 看看網站上是不是每一頁都有裝到GA Code
- 列出每一頁的Metadata (標題、description、canonical……等等)
- 檢查sitemap裡的URL是否正確
- 檢查是否有檔案過大的圖片
結語
希望耐心看完這篇落落長文章的人是有學到東西的! 如果你有一個網站但是沒錢買Screaming Frog,歡迎下面留言跟我說~ 留下你的網址和一兩個你希望在此部落格看到的SEO文章主題當作交換,我很樂意花點時間檢測你的網站上壞掉的連結!
如果兩天內沒有回應,請寄信到我的信箱 darrenhhuang@gmail.com,再次感謝閱讀!
4. 把A欄的這堆URL選起來,回到Screaming Frog上,將模式切換成”List Mode”,然後貼上
到這個步驟卡了,要怎樣貼上?
我嘗試UPLOAD之後還是到SPIDER—>ADVANED選項
選不到任何東西
謝謝你
你好~感謝你的提問!
切換成list mode以後點Upload應該會有五個選項: From a file, Enter manually, Paste, Download sitemap, Download sitemap index。一般我就是把A欄的的URL選起來以後複製,然後選Paste,再按OK就可以了!
截了幾個圖給你瞧瞧,希望有解答到! https://imgur.com/a/Fc6qx
您好
我在第五個步驟:”到Configuration->Spider->Advanced->Always Follow Redirects 給它打勾,然後就可以按start開始跑”卡住了
Configuration打開,所有的選項都是灰底,無法點選QQ
Hmmm…我猜你的Screaming Frog應該是免費版本吧? 要是我沒記錯configuration的設定都是要付費版才可以更該設定唷。
(抱歉回復的晚了,如果你有需要我可以幫你爬一下~ 歡迎寄信給我: darrenhhuang@gmail.com)