fbpx

Google Chrome擴充套件《Monster》網站錯誤檢測及源碼分析工具

我們知道在設計網頁時,不少人都會使用W3C所提供的檢測工具來修正網頁符合標準規範,除此之外,網路上還有許多是用來檢測及分析網站錯誤的工具,Google Chrome擴充套件《Monster》是由大陸的Alipay UED所開發製作的一套網站檢測、分析及評分的工具,會根據網站的CSS、JS、HTML產生出評分,並顯示錯誤及警告的問題,讓我們可以針對這些問題對網站進行改善。

Google Chrome擴充套件《Monster》小檔案:

官方網站:http://ued.alipay.com/
軟體版本:1.0.0
軟體下載頁:請點我

Google Chrome擴充套件《Monster》檢測項目列表:

檢測是否有重複ID的標籤;
檢測是否使用內聯標籤嵌套塊級標籤,如a嵌套div;
檢測https協議頁面,是否使用了http協議的圖片、JS、CSS等;
檢測compatMode、doctype是否出錯;
檢測是否使用了HTML5不再支持的標記,如font,s,u等;
檢測標籤是否正確關閉;
檢測CSS、JS、background-image文件是否為404;
檢測CSS、JS文件是否重複調用;
檢測是否引用過多外部JS、CSS文件;
檢測CSS、JS、HTML是否壓縮;
檢測CSS樣式表是否使用了CSS expression;
檢測Cookie是否超過30KB;
檢測是否有form標籤嵌套form標籤;
檢測是否直接在標籤裡定義JS事件,如<a href=”#” onclick=”…”>link</a>;
檢測<meta charset=”utf-8″ />是否為<head>第一個子標籤;
檢測一個<form>標籤內部是否出現二個input[type=submit]標籤;
檢測是否在<form>標籤中使用了id=”submit” 的標籤;
檢測是否將<style>塊放置在</head>前面;
檢測是否將<script>塊放置在</body>前面;
檢測<img>標籤是否指定alt屬性;
檢測是否為input[text]指定label;
檢測網頁編碼是否為gbk或utf-8;
檢測是否使用了@import導入樣式表;
如果CSS、JS指定類似於“?t=20100405”時間戳,則自動輸出最後修改時間,方便對比;
如果background-image超過6個,則提示所有背景圖片及大小,超過30KB,標紅顯示;

如何安裝Google Chrome套件?

進入下載頁後,點擊『安裝』,下載完後會再跳出安裝的視窗,再點一次『安裝』吧。

01

安裝完畢後在瀏覽器右上角的套件區就會多一個小圖示,這樣就安裝完成了。

02




Google Chrome擴充套件《Monster》使用介紹:

開啟要檢測的網站後,點擊右上角Monster的圖示,等候幾秒鐘後即會出現檢測及評分的結果,主要顯示錯誤、警告、資訊及分數,我們可以點擊錯誤及警告進入看看分析結果。

03

在錯誤中會顯示一些較重大的問題,不過script不夾在html裡還真是困難,光是廣告代碼就佔了不少,其它像是inline屬性這個是Bloggerads的廣告代碼所造成,而id重覆也是,如果丫湯將廣告全拿掉是80幾分…而按下每一個項目後面的藍色箭頭或是詳細,可以直接在網頁上看到錯誤的問題所在。

04

而在警告中顯示的項目也是會影響評分,不過有些是沒辦法修改的,迫於無奈..所以參考就好,如果有些錯誤是不想理他的,可以按下畫面的右上有一個選項設定的小圖示,可以進入設定檢測項目。

05

進入項目後,再將不想列入規則的部份去掉,不過去掉只是表示不顯示此錯誤結果,並不會影響分析出來的分數哦,丫湯的網站基本上是被廣告代碼扣分扣一堆,你的呢?也快去測看看吧。

06

你可能對這些內容也有興趣

作者:阿湯

對電腦 & 網路資訊充滿興趣與熱情、瘋了似的每日堅持發文,「阿湯」這個名字是由湯姆克魯斯而來的,雖然我沒有他帥氣,也不會演電影,但我會寫文章....

更多關於的文章》

1 個留言

  1. 蘇丞泰表示:

    有 1 處 script 標簽 混合在HTML中間。
    這要怎麼處理呢?

    阿湯說:

    不懂你的意思

發表留言 »

姓名(*)
信箱(*)