火狐瀏覽器外掛程式工具

使用火狐瀏覽器網頁設計製作中經常使用到的外掛程式工具。

下面為您介紹在網頁設計製作中經常使用到的火狐瀏覽器外掛程式工具：
1.Firebug
Firebug是開發人員們鍾愛火狐瀏覽器的一個重要原因，Firebug是火狐瀏覽器上一個集成式的強大調試環境，很多調試套用外掛程式都 必須基於Firebug平台，包括下面會介紹到了一些Web測試和調試工具，所以Firebug可以說是每一個Web設計開發人員必備的工具。
按照提示安裝到Firefox中之後，在瀏覽器底部狀態欄就可以看到Firebug的圖示，點擊之後彈出firebug調試視窗，這裡面有除了Firebug自身的工具外，其他選擇性安裝的Firebug平台外掛程式的調試入口，比如Page Speed等。
2.Page Speed
Google於今年4月確認將網頁載入速度作為排名因素之後，站長們對頁面性能更加重視。其實無論是對SEO而言，還是對用戶體驗而言，提高頁面的載入速度都相當重要。Google也提供了這枚檢測頁面載入速度的工具。
Page Speed外掛程式是基於firebug平台的火狐外掛程式，它為每一個頁面進行載入速度評分，不僅如此，更提供了最佳化建議，因此，有改進網頁載入性能的頁面最佳化人員，這個工具是非常的必須。
安裝以後，Page Speed就會出現在Firebug視窗中，可以為瀏覽器的當前頁面檢測載入性能，點擊Page Speed界面中的“Analyze Performance”按鈕執行分析，Page Speed會為分析的頁面進行評分，滿分100分，評分當然越高越好，不過最佳化的目標應該是達到85分以上。
3.Web Developer
從這個工具名稱應該能夠大概猜到它的用途，沒錯，這是一個集眾多頁面測試功能於一身的強大火狐外掛程式，能夠查看CSS錯誤和Cookies 信息，設定突出顯示表格、Heading、圖片URL等幾乎所有頁面元素，這對頁面調試非常有用，尤其當頁面結構非常複雜的時候，這些工具能夠讓你快速找 到特定元素的分布。
小陸平時很喜歡用這個工具來查找頁面的實效圖片，因為在火狐里，實效的圖片不會像IE那些顯示小紅叉。
安裝以後作為一個工具列出現在瀏覽器中，如下圖：
4. HTML Validator
網頁符合W3C標準十分重要，一方面是為了讓頁面能夠跨瀏覽器兼容，另一方面也是為了讓搜尋引擎能夠順利的抓取和理解你的頁面。所有讓頁 面通過W3C校驗是網頁最佳化工作很重要的一方面，使用HTML Validator能夠高效的檢測頁面的HTML代碼有效性，不僅如此，它還能顯示出錯的代碼位置，並給出錯誤說明和修改建議，是個非常不錯的工具。
安裝完成以後，在火狐瀏覽器右下角會出現一個紅色的“叉”或者一個綠色的“勾”，分別表示頁面無效和有效。如果在你的頁面顯示的是綠勾，那恭喜你，你的代碼非常規範，如果有錯也不用著急，雙擊紅叉標誌能夠顯示錯誤信息，根據提示逐個修改就行。
另外值得注意的是，HTML代碼的有效性還是要以W3C官方的校驗為準，小陸在使用此工具過程中發現它的校驗規則跟W3C標準有些非常細微的差別，不過大部分時候還是一致，如果不放心，請使用W3CmarkupValidation Service確認驗證。
5. Simple Links Counter
在網站維護的時候，連結的有效性檢測是一個讓人頭疼的工作，頁面中繁多的連結著實讓維護難度倍增，可能一次不嚴謹的批量查找替換讓很多鏈 接出錯，這個錯誤是老闆和用戶都無法容忍的，所有對於這個問題，尤其要倍加小心。SLC（Simple Links Counter）能夠自動檢測頁面中的連結是否有效，你能夠會說Dreamweaver里也有連結檢查，沒錯，DW自帶了連結檢查功能，不過DW的檢測僅 限於站內連結，對站外連結便無能為力。
除了檢測連結有效性，SLC還能顯示頁面分別有多少站外連結，多少站內連結，以及具體的連結URL地址，對網站不良外鏈檢查也是很方便的。
6. X-Ray
如果能在瀏覽器里看到頁面內容是被那一些HTML標籤所包含，是不是很直觀呢，X-Ray就是這樣一款工具。普通的一個網頁在前端設計師 們眼中，不僅是單純的文字圖片，而是各種網頁標籤組成的結構圖，但這些畫面純粹存在於設計師們的大腦中，X-Ray提供了一個讓讓它視覺化的方法，尤其是 在瀏覽別人的網站時尤其有用。
安裝以後，瀏覽器郵件選單就多了一個“X-Ray”選項。這個工具的缺點是會讓頁面變得很亂，不過只要研究的頁面對象不是太多，還是能夠應付得過來。
7 .yslow
有一個比Google Page Speed更強大網頁性能最佳化工具，那就是YSlow，它是由Yahoo提供的頁面性能評測和最佳化工具，YSlow也有頁面性能評分，有趣的 是，YSlow評分接近的兩個頁面，Page Speed評分卻相去甚遠，在實際的頁面最佳化時，YSlow的評分並不作為重要參考，因為YSlow提供了其他更多有用的信息。它能夠統計一個網頁中包含 的所有元素，包括圖片檔案、CSS檔案、JS檔案等，而且顯示了頁面的HTTP請求數，小陸認為這是頁面性能最佳化最重要的指標之一，所以根據YSlow提 供的信息進行針對性的最佳化，能夠產生非常明顯的效果。
YSlow同樣是一個Firebug平台的外掛程式，需要在Firebug里運行。
8. Colorzilla
回憶一下我們是如何給網頁配色的？首先打開圖形軟體（比如PS或者Fireworks等），導入頁面效果圖，使用軟體中的拾色器取得圖片 上某個位置的顏色，然後將顏色的RGB或者十六進制值複製到Dreamweaver中，如果沒有效果圖的時候，我們還要先截圖，額，這樣實在太浪費時間。
除了一些常用的顏色之外，很少有人能夠在看到顏色時立刻準確的說得出它的顏色值，其實有一款火狐外掛程式能夠幫你“說出”顏色 值：Colorzilla能夠取得瀏覽器中任何一點的顏色值，並且表示為RGB和十六進制值，可以非常方便的複製使用，在製作和修改頁面時候大大提高工作 效率。
9. MeasureIt
除了取色以外，精確度量頁面元素尺寸也是非常重要的操作，尤其是對像小陸這樣頁面設計“像素派”，並且很多時候在頁面調試的時候，也需要 知道某些元素的尺寸以確定是否符合預留的空間。MeasureIt是一個很方便的頁面測量工具，只需要拖動滑鼠就能完成度量，是不是很直觀？