網(wǎng)頁(yè)設(shè)計(jì)師需要的火狐附加組件

發(fā)布時(shí)間：2017-01-17 09:16:14

發(fā)布者：369563174

瀏覽量:

作為一個(gè)webdesigner（網(wǎng)站設(shè)計(jì)師），你應(yīng)該注意到了國(guó)外主流瀏覽器Firefox。如果你還沒(méi)有使用Firefox，您可以現(xiàn)在去下載它?；鸷颂峁┚W(wǎng)頁(yè)瀏覽體驗(yàn)之外，而且還提供了一個(gè)功能，是其他任何瀏覽器無(wú)法媲美的。那就是第三方開發(fā)的附加組件工具可以根據(jù)不同愛好和需求安裝加載在Firefox瀏覽器中，大大提高您的工作效率并節(jié)省您的時(shí)間，

目前Firefox的附加組件達(dá)到成百上千個(gè)，有的幫助您瀏覽被屏蔽的網(wǎng)站，有的幫助您下載隱藏文件，有的幫助您實(shí)現(xiàn)網(wǎng)站窗口單一化和自動(dòng)翻頁(yè)等等，既然有這么多不同功能的組件可以下載，我們今天介紹6種針對(duì)網(wǎng)站設(shè)計(jì)師需要的組件。

Web Developer

雖然被稱為 Web Developer，但是這一Firefox附加組件對(duì)于網(wǎng)頁(yè)設(shè)計(jì)師來(lái)說(shuō)絕對(duì)是非常寶貴的。

如果你添加安裝完畢此組件，網(wǎng)站設(shè)計(jì)人員會(huì)發(fā)現(xiàn)有用的是CSS菜單。這個(gè)菜單的功能包括顯示CSS是否出錯(cuò)，查看CSS，編輯和加入自定義樣式信息。另外 1個(gè)特點(diǎn)是圖像菜單。可以查看ALT屬性，圖像尺寸，圖像文件大小和圖像的路徑，您可以禁用圖像，找到無(wú)效的圖像，ALT屬性替換圖像等一些額外的功能。

Firebug

盡管Web Developer是我們第一推薦， Firebug 緊隨其后也是我們要重點(diǎn)推薦的。

有了Firebug的，你可立即編輯，調(diào)試和監(jiān)測(cè)任何網(wǎng)頁(yè)。Firebug可以讓你對(duì)任何網(wǎng)頁(yè)CSS，HTML和JavaScript完全控制。最棒的是，您調(diào)試的每個(gè)不同的變化，都可以立即看到效果。

像大多數(shù)好的Firefox插件一樣，F(xiàn)irebug 也有增值服務(wù)可以選擇，這樣用戶可以使用一些額外的功能。

Colorzilla

作為一個(gè)網(wǎng)頁(yè)設(shè)計(jì)師，當(dāng)您在網(wǎng)上沖浪的時(shí)候，你永遠(yuǎn)不知道什么時(shí)候靈感會(huì)打動(dòng)你。比如，您可能會(huì)看一個(gè)網(wǎng)站的色彩，你真的很喜歡。

如果你想快速，有效的抓出這些色彩，你應(yīng)該安裝 ColorZilla 附加組件。

ColorZilla附加功能的在線滴管，這使得它非常簡(jiǎn)單的抓取顏色精確值。除了在線滴管，ColorZilla提供多種附加功能，大部分的網(wǎng)頁(yè)設(shè)計(jì)師會(huì)找到有用的，如 DOM的色彩分析儀和在線配色等。

FireShot

雖然你的操作系統(tǒng)具有內(nèi)置的屏幕捕捉功能，但這并不意味著默認(rèn)的屏幕捕獲符合您實(shí)際需要的情況，比如一般都抓一屏，如果網(wǎng)站很長(zhǎng)就要抓很多次，還是斷開的，而且所抓取的內(nèi)容還包括瀏覽器窗口。

幸運(yùn)的是，F(xiàn)ireshot插件，提供只抓去瀏覽器以內(nèi)的網(wǎng)頁(yè)功能，連同其他有用的多種功能。

FireShot的是一種先進(jìn)的Firefox屏幕捕獲附件組件。除了讓您能夠捕獲整個(gè)網(wǎng)頁(yè)（即使網(wǎng)頁(yè)不是作為對(duì)您的瀏覽器窗口的限制而導(dǎo)致的不可見部分），F(xiàn)ireShot的還可以直接在屏幕捕獲后添加注釋。

FireShot 讓您在屏幕捕獲后保存上有多種選擇。他們不僅可以被保存為不同的文件格式，但也可以保存到本地計(jì)算機(jī)，或服務(wù)器網(wǎng)絡(luò)。目前，因?yàn)檫@功能，這個(gè)附加已吸引了超過(guò)15.0萬(wàn)活躍用戶，并已證明是網(wǎng)頁(yè)設(shè)計(jì)人員和其他互聯(lián)網(wǎng)專業(yè)人士的摯愛。

CSS驗(yàn)證器/HTML Validator

作為設(shè)計(jì)師，你要確保你的網(wǎng)站作品，都可以很容易在任何電腦和平臺(tái)上顯示和展示。首先就是確保這CSS和HTML代碼的W3C驗(yàn)證。

無(wú)論是 CSS驗(yàn)證器還是HTML驗(yàn)證當(dāng)我們安裝了CSS驗(yàn)證器/HTML Validator這個(gè)組件以后，可以在瀏覽器上一點(diǎn)，就會(huì)進(jìn)入驗(yàn)證頁(yè)面，根據(jù)驗(yàn)證結(jié)果調(diào)整自己的網(wǎng)站。

Window Resizer的瀏覽器

互聯(lián)網(wǎng)，最令網(wǎng)頁(yè)設(shè)計(jì)師沮喪的問(wèn)題之一，就是我們所設(shè)計(jì)的網(wǎng)站，需要在不同屏幕尺寸下顯示。

因?yàn)槟悴恢赖脑L問(wèn)者的瀏覽器分辨率是640 × 480，800 × 600，1024 × 768，1280 × 1024或1600 × 1200，所以我們必須解決不同分辨率網(wǎng)站顯示的問(wèn)題。

我發(fā)現(xiàn)安裝 Window Resizer附加組件，是最有效的方式來(lái)完成這項(xiàng)任務(wù)。一旦您下載并安裝此插件，您可以按照上述尺寸查看自己的網(wǎng)頁(yè)在不同分辨率下的表現(xiàn)。

我們可以通過(guò)調(diào)試去解決大部分分辨率下的展示問(wèn)題。

1. Web Developer Toolbar

功能非常強(qiáng)大，是做網(wǎng)頁(yè)設(shè)計(jì)師的必備工具。

2. CssViewer

可以在網(wǎng)頁(yè)中查看某個(gè)區(qū)域的CSS，我常常用它研究一些特別的效果是如何做出來(lái)的。

3. Firebug

用來(lái)調(diào)試網(wǎng)頁(yè)，如果HTML，CSS或者JS出錯(cuò)，它會(huì)有對(duì)應(yīng)提示。