發新話題

開發DHTML網頁好用的小工具

開發DHTML網頁好用的小工具

你寫網頁是用什麼軟體呢?Dreamweaver?FrontPage?UltraEdit 還是記事本?其實除了這類編寫 HTML 和程式碼的軟體以外,還有很多小巧而且免費的軟體,可以幫助你在寫網頁時更方便、寫的更好哦!尤其時在寫 CSS、Javascript 或 Ajax 的時候,這些都是不可或缺的軟體呢!
綜合開發工具綜合的網站開發工具幾乎都是瀏覽器的外掛,提供了許許多多的功能,例如:
  • 開關 CSS、開關 Javascript、開關 Cache:可以馬上看到你的網頁在瀏覽器中沒有 CSS、沒有 Javascript 或沒有快取時的是長怎麼樣子。為什麼要看沒有 CSS 和 Javascript 的狀況呢?一切都是為了 Accessibility 啊!
  • 檢視頁面中文件的 DOM 結構和指定範圍的原始碼。
  • 檢視每個元素或 DIV 的ID、Class、目前的CSS樣式(包括繼承的樣式),也可以將元素或 DIV 的外框顯示出來。對於找出 CSS 和 Javascript 的問題十分有用。
  • 檢驗 HTML 和 CSS 語法是否正確、符合 W3C 的標準。
因為這些工具是屬於瀏覽器的外掛,所以有分為給 IE 和 Firefox (縮寫為FF) 所使用的版本,包括有:
HTTP 呼叫檢視工具讓你可以很容易看到任何由瀏覽器所發出的 HTTP Request 的一切細節,包括檔頭資訊、所傳遞的參數、檔案大小、傳輸速度和時間...等等。用來觀察 Ajax 呼叫的行為和除錯最方便了!
原始碼工具其實大部分的綜合開發工具就已經有這樣的提供功能,讓你單獨檢視網頁中某個區域的原始碼,或是幫你檢查語法的正確性,另外也有單獨小巧的原始碼相關工具可以使用。想要滑鼠滑過去就立刻看到該範圍的原始碼嗎?而不需要在茫茫"碼"海中撈針。
圖形相關工具除了用 Photoshop、Fireworks 這類標準的大型軟體來切圖以外,對於平常一些簡單的工作,殺機焉用牛刀呢?
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 :可以吸取畫面上任何地方的顏色色碼。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 (FF):測量畫面上的像素距離,例如想知道行距、邊界要設為多少像素時,就靠他了。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 (FF):將 Firefox 同一個瀏覽器視窗分為上下或左右兩半,讓你可以在同一個畫面上同時看到兩個或多個不同的網頁內容,互相做比對,而不需要在多個視窗中切換來切換去。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 (FF):雖然是叫做 IE Tab,但這可是 Firefox 的外掛。讓你在 Firefox 的瀏覽器視窗中開啟 IE,神奇吧!
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 :這是另一套用來測量畫面上像素距離的小軟體。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 :免費的螢幕抓圖軟體,用來切圖也很方便,只要用秀圖軟體將原始網頁設計的整張圖打開、顯示在螢幕上,就可以用螢幕抓圖軟體,擷取出某個範圍的圖形了。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 :另一套好用的螢幕抓圖軟體,但不是免費的。
  • 訪客無法瀏覽此圖片或連結,請先 註冊登入會員 :Adobe 提供配色參考的網站,想不出要用什麼顏色時,不妨去看一看找尋靈感吧!

TOP

感謝大大無私的分享唷
小弟來幫推 推一個唷
再次感謝你的無私3Q^^~!
不多說了 趕緊下載去嚕~!
~~~~~~~~~~~~~~~~~~~~~~~~~~!

TOP

發新話題

本站所有圖文均屬網友發表,僅代表作者的觀點與本站無關,如有侵權請通知版主會盡快刪除。