制作網(wǎng)頁(yè)一般都用什么軟件呢?記事本?notepad?DW?firework?UltraEdit?FrontPage?

相信寫(xiě)過(guò)網(wǎng)頁(yè)代碼的人見(jiàn)到這些軟件都不生疏,其實(shí)這些專(zhuān)業(yè)的軟件以為,還有一些比較小巧的軟件,應用起來(lái)也是很方便了,當然功能性可能會(huì )欠缺一些,比如說(shuō)DW的聯(lián)想功能,只需要輸入一部分標簽就可以出現下拉選擇自己要書(shū)寫(xiě)的代碼,但是作為輔助功能還是很好用的,下面就來(lái)講一下。


綜合開(kāi)發(fā)工具

綜合的網(wǎng)站開(kāi)發(fā)工具幾乎都是瀏覽器的插件,提供了許許多多的功能,例如:

開(kāi)關(guān) CSS、開(kāi)關(guān) Javascript、開(kāi)關(guān) Cache:

可以馬上看到你的網(wǎng)頁(yè)在瀏覽器中沒(méi)有 CSS、沒(méi)有 Javascript 或沒(méi)有快取時(shí)的是長(cháng)怎么樣子。為什么要看沒(méi)有 CSS 和 Javascript 的狀況呢?一切都是為了 Accessibility ??!

檢視頁(yè)面中文件的 DOM 結構和指定范圍的原始碼。

檢視每個(gè)元素或 DIV 的ID、Class、目前的CSS樣式(包括繼承的樣式),也可以將元素或 DIV 的外框顯示出來(lái)。對于找出 CSS 和 Javascript 的問(wèn)題十分有用。

檢驗 HTML 和 CSS 語(yǔ)法是否正確、符合 W3C 的標準。

因為這些工具是屬于瀏覽器的插件,所以又分為給 IE 和 Firefox (縮寫(xiě)為FF) 所使用的版本,包括有:

Internet Explorer Developer Toolbar (IE)

Web Developer Extension (FF)

Firebug (FF)

HTTP 呼叫檢視工具

讓你可以很容易看到任何由瀏覽器所發(fā)出的 HTTP Request 的一切細節,包括檔頭資訊、所傳遞的參數、檔案大小、傳輸速度和時(shí)間…等等。用來(lái)觀(guān)察 Ajax 呼叫的行為和排錯最方便。

HttpWatch (IE)

Firebug (FF)

原始碼工具

其實(shí)大部分的綜合開(kāi)發(fā)工具就已經(jīng)有這樣的提供功能,讓你單獨檢視網(wǎng)頁(yè)中某個(gè)區域的原始碼,或是幫你檢查語(yǔ)法的正確性,另外也有單獨小巧的原始碼相關(guān)工具可以使用。想要鼠標滑過(guò)去就立刻看到該范圍的原始碼嗎?而不需要在茫?!按a“海中撈針。

Instant Source (IE, 不是免費的)

HTML VALIDATOR (FF)

圖形相關(guān)工具

除了用 Photoshop、Fireworks 這類(lèi)標準的大型軟件來(lái)切圖以外,對于平常一些簡(jiǎn)單的工作,殺機焉用牛刀呢?

Color Cop:可以吸取畫(huà)面上任何地方的顏色色碼。

MeasureIt (FF):測量畫(huà)面上的像素距離,例如想知道行距、邊界要設為多少像素時(shí),就靠他了。

Screen Calipers:這是另一套用來(lái)測量畫(huà)面上像素距離的小軟件。

Split Browser (FF):將 Firefox 同一個(gè)瀏覽器視窗分為上下或左右兩半,讓你可以在同一個(gè)畫(huà)面上同時(shí)看到兩個(gè)或多個(gè)不同的網(wǎng)頁(yè)內容,互相做比對,而不需要在多個(gè)視窗中切換來(lái)切換去。

IE Tab (FF):雖然是叫做 IE Tab,但這可是 Firefox 的插件。讓你在 Firefox 的瀏覽器視窗中開(kāi)啟 IE,神奇吧!

MWSnap:免費的螢幕抓圖軟件,用來(lái)切圖也很方便,只要用秀圖軟件將原始網(wǎng)頁(yè)設計的整張圖打開(kāi)、顯示在螢幕上,就可以用螢幕抓圖軟件,擷取出某個(gè)范圍的圖形了。

HyperSnap:另一套好用的螢幕抓圖軟件,但不是免費的。

Picasa:Google 的免費秀圖、圖片管理軟件。

Adobe Labs’ Kuler:Adobe 提供配色參考的網(wǎng)站,想不出要用什么顏色時(shí),看一看也許會(huì )有不一樣的靈感。

除了以上這些其實(shí)chrome的審查元素功能也是很好的查錯排錯功能,現在比較主流的瀏覽器基本上都有這個(gè)功能,利用360瀏覽器(極速模式或者極速版)就有。


Tag: 網(wǎng)站 網(wǎng)站開(kāi)發(fā) 網(wǎng)站開(kāi)發(fā)工具 網(wǎng)站開(kāi)發(fā)軟件